:root{--blue: #29b6e6;--blue-light: #5ecff2;--blue-dark: #1b8cb4;--blue-deep: #0f3b4d;--yellow: #ffd93b;--yellow-dark: #e6b800;--yellow-glow: #fff2a8;--cream: #fff8e1;--white: #ffffff;--pink: #ff6b9c;--purple: #9b6dff;--success: #3fcf7b;--success-dark: #2faa63;--danger: #ff6b6b;--danger-dark: #cc5555;--shadow: 0 10px 30px rgba(15, 59, 77, .22);--shadow-sm: 0 4px 12px rgba(15, 59, 77, .12);--radius: 22px;--radius-sm: 14px;font-family:Nunito,system-ui,-apple-system,sans-serif;font-size:18px}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100vh;background:var(--blue);color:var(--blue-deep);overflow-x:hidden}#app{min-height:100vh;display:flex;flex-direction:column}h1,h2,h3,.brand,button,.pill{font-family:Fredoka,Nunito,sans-serif}.home{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:40px 80px;align-items:center;background:radial-gradient(circle at 70% 25%,#5ecff2 0%,transparent 55%),radial-gradient(circle at 20% 80%,#4dd0f0 0%,transparent 55%),linear-gradient(135deg,#29b6e6,#1b8cb4);position:relative;overflow:hidden}.home:before{content:"10110011 01001010 11010101 00110100 10110010 01001011 11010100 00110101 10110011 01001010 11010101 00110100 10110010 01001011 11010100 00110101";position:absolute;top:0;right:0;bottom:0;left:0;color:#ffffff12;font-family:ui-monospace,Courier New,monospace;font-size:30px;letter-spacing:8px;word-break:break-all;line-height:2;padding:20px;pointer-events:none;z-index:0}.home:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:radial-gradient(circle at 15% 20%,#fff 2px,transparent 3px),radial-gradient(circle at 85% 70%,#fff 3px,transparent 4px),radial-gradient(circle at 50% 10%,#ffd93b 2px,transparent 3px),radial-gradient(circle at 10% 70%,#ffd93b 2px,transparent 3px),radial-gradient(circle at 90% 20%,#fff 2px,transparent 3px),radial-gradient(circle at 60% 85%,#fff 2px,transparent 3px);opacity:.8;z-index:0;animation:twinkle 3s ease-in-out infinite}@keyframes twinkle{0%,to{opacity:.4}50%{opacity:.9}}.home>*{position:relative;z-index:1}.home-hero{text-align:left;max-width:520px}.home-hero .brand{font-size:110px;margin:0 0 15px;color:var(--white);text-shadow:5px 5px 0 var(--blue-deep),10px 10px 30px rgba(0,0,0,.3);letter-spacing:-3px;line-height:1}.home-hero .brand .k{color:var(--yellow)}.home-hero .tagline{font-size:24px;color:var(--white);margin:0 0 32px;font-weight:600;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.home-form{background:var(--white);padding:32px;border-radius:var(--radius);box-shadow:var(--shadow);max-width:460px;border:4px solid var(--yellow)}.home-form label{display:block;font-weight:700;margin-bottom:12px;font-size:20px;color:var(--blue-deep)}.home-form input{width:100%;padding:16px 20px;font-size:22px;border:3px solid #e3eff4;border-radius:var(--radius-sm);font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s}.home-form input:focus{border-color:var(--blue);box-shadow:0 0 0 4px #29b6e633}.home-mascot{display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;text-align:center}.home-mascot-img{max-width:320px;height:auto;filter:drop-shadow(0 20px 30px rgba(0,0,0,.35));animation:float 4s ease-in-out infinite}.home-mascot .mascot-name{font-family:Fredoka,sans-serif;font-size:32px;font-weight:700;color:var(--white);text-shadow:2px 2px 0 var(--blue-deep);margin:12px 0 0}.home-mascot .mascot-tagline{font-size:16px;color:var(--white);opacity:.9;margin:2px 0 0}@keyframes float{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-18px) rotate(2deg)}}.mascot-label{display:block;font-weight:700;margin:16px 0 10px;font-size:18px;color:var(--blue-deep)}.mascot-picker{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:18px}.mascot-pick{background:#fff8e1;border:3px solid transparent;border-radius:14px;padding:4px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s,border-color .15s,background .15s}.mascot-pick img{width:100%;height:100%;object-fit:contain}.mascot-pick:hover{transform:translateY(-3px) scale(1.05);background:#fff0b8}.mascot-pick.selected{border-color:var(--blue);background:#e3f6fc;box-shadow:0 4px 10px #29b6e659}button{cursor:pointer;border:none;font-weight:700;border-radius:var(--radius-sm);padding:14px 24px;font-size:18px;transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,background .2s;font-family:Fredoka,Nunito,sans-serif;letter-spacing:.3px}button:hover{transform:translateY(-3px) scale(1.03)}button:active{transform:translateY(2px) scale(.98)}.btn-primary{background:var(--yellow);color:var(--blue-deep);box-shadow:0 6px 0 var(--yellow-dark),0 10px 20px #e6b8004d;margin-top:24px;width:100%;font-size:22px;padding:18px}.btn-primary:hover{background:#ffe066}.btn-secondary{background:var(--white);color:var(--blue-deep);box-shadow:0 4px #b3d8e6}.btn-play{background:var(--success);color:var(--white);box-shadow:0 5px 0 var(--success-dark),0 8px 16px #3fcf7b4d;font-size:20px}.btn-play:hover{background:#4dd98a}.btn-stop{background:var(--danger);color:var(--white);box-shadow:0 5px 0 var(--danger-dark)}.selector{flex:1;display:flex;flex-direction:column;background:radial-gradient(circle at 80% 0%,rgba(255,217,59,.25) 0%,transparent 50%),radial-gradient(circle at 10% 100%,rgba(155,109,255,.18) 0%,transparent 60%),linear-gradient(180deg,#29b6e6,#1b8cb4);min-height:100vh}.selector-topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 28px;background:#0f3b4d4d;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:2px solid rgba(255,255,255,.1)}.selector-topbar .topbar-left{display:flex;align-items:center;gap:15px}.selector-topbar .topbar-left img{height:50px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.3))}.selector-topbar .topbar-left .brand-small{font-size:28px;font-weight:700;color:var(--white);text-shadow:2px 2px 0 var(--blue-deep);letter-spacing:-1px;font-family:Fredoka,sans-serif}.selector-topbar .topbar-left .brand-small .k{color:var(--yellow)}.selector-topbar .topbar-right{display:flex;align-items:center;gap:12px}.player-pill-dark{background:#0000004d;color:var(--white);padding:10px 18px;border-radius:999px;font-weight:700;font-family:Fredoka,sans-serif;border:2px solid rgba(255,255,255,.2)}.selector-main{flex:1;padding:36px 40px 60px;max-width:1200px;width:100%;margin:0 auto}.selector-hero{text-align:center;margin-bottom:36px;color:var(--white)}.selector-hero h1{margin:0 0 8px;font-size:48px;font-family:Fredoka,sans-serif;text-shadow:3px 3px 0 var(--blue-deep);letter-spacing:-1px}.selector-hero p{margin:0;font-size:18px;opacity:.95}.day-section{margin-bottom:36px;background:#fffffff2;border-radius:24px;padding:22px 26px 26px;box-shadow:0 12px 30px #0f3b4d38;border-top:6px solid var(--blue)}.day-section.theme-d1{border-top-color:var(--blue)}.day-section.theme-d2{border-top-color:var(--success)}.day-section.theme-d3{border-top-color:var(--yellow-dark)}.day-section.theme-d4{border-top-color:var(--pink)}.day-section.theme-sandbox{border-top-color:var(--purple);background:radial-gradient(circle at 100% 0%,rgba(155,109,255,.12) 0%,transparent 55%),#fffffff2}.day-section.theme-sandbox .day-icon{background:linear-gradient(135deg,var(--purple) 0%,var(--pink) 100%);color:var(--white);box-shadow:0 4px #6f4ac9}.day-sub{margin:4px 0 0;font-size:15px;color:#5a7484;font-weight:600}.day-header{display:flex;align-items:center;gap:14px;margin-bottom:20px}.day-header .day-icon{font-size:34px;width:54px;height:54px;background:var(--cream);border-radius:14px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px #e0cd7e}.day-header h2{margin:0;font-size:24px;color:var(--blue-deep);font-family:Fredoka,sans-serif}.reto-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}.reto-card{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:8px;padding:16px 18px;background:var(--white);border-radius:18px;border:3px solid #e3eff4;box-shadow:0 4px #b3d8e6;cursor:pointer;position:relative;font-family:Fredoka,Nunito,sans-serif;color:var(--blue-deep);min-height:110px;transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,border-color .2s}.reto-card:hover{transform:translateY(-4px);border-color:var(--blue);box-shadow:0 8px 0 var(--blue),0 12px 20px #0f3b4d33}.reto-card:active{transform:translateY(0)}.reto-card-num{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--blue-deep);color:var(--white);border-radius:999px;font-size:17px;font-weight:700}.reto-card-name{font-size:16px;font-weight:700;line-height:1.25}.reto-card.current{border-color:var(--yellow);box-shadow:0 4px 0 var(--yellow-dark);background:linear-gradient(135deg,#fff 60%,#fff8d6)}.reto-card.done{background:linear-gradient(135deg,#e6fff0,#c7f5d9);border-color:var(--success);box-shadow:0 4px 0 var(--success-dark)}.reto-card.done .reto-card-num{background:var(--success)}.sandbox-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.reto-card.sandbox-card{min-height:140px;background:linear-gradient(135deg,#fff,#f4edff);border-color:#e2d5ff;box-shadow:0 4px #c6b2f0;gap:6px}.reto-card.sandbox-card:hover{border-color:var(--purple);box-shadow:0 8px 0 var(--purple),0 12px 20px #9b6dff40}.reto-card.sandbox-card.current{background:linear-gradient(135deg,#fff 60%,#efe3ff);border-color:var(--purple);box-shadow:0 4px #6f4ac9}.reto-card .sandbox-icon{background:linear-gradient(135deg,var(--purple) 0%,var(--pink) 100%);color:var(--white);font-size:22px;width:44px;height:44px}.sandbox-sub{font-size:14px;font-weight:600;color:#5a7484;line-height:1.35;font-family:Nunito,sans-serif}.reto-card-check{position:absolute;top:12px;right:14px;background:var(--success);color:#fff;width:26px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;box-shadow:0 2px 0 var(--success-dark)}@media (max-width: 700px){.selector-main{padding:20px 16px 40px}.selector-hero h1{font-size:36px}.day-section{padding:18px}.reto-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.reto-card{min-height:92px}}.editor{display:grid;grid-template-rows:auto 1fr;height:100vh;background:#e8f5fc}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dark) 100%);box-shadow:0 4px 16px #0f3b4d2e;z-index:10;color:var(--white)}.topbar-left{display:flex;align-items:center;gap:15px}.topbar-left img{height:56px;width:auto;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25));animation:wobble 5s ease-in-out infinite}@keyframes wobble{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}.topbar-left .brand-small{font-size:32px;font-weight:700;color:var(--white);text-shadow:2px 2px 0 var(--blue-deep);letter-spacing:-1px}.topbar-left .brand-small .k{color:var(--yellow)}.challenge-title{font-weight:700;color:var(--white);font-size:18px;font-family:Fredoka,sans-serif}.topbar-right{display:flex;align-items:center;gap:12px}.player-pill{background:#fff3;color:var(--white);padding:10px 18px;border-radius:999px;font-weight:700;font-size:17px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:2px solid rgba(255,255,255,.3)}.editor-main{display:grid;grid-template-columns:1fr 520px;gap:0;overflow:hidden}.blockly-area{position:relative;background:#eaf6fc}.stage-area{background:linear-gradient(180deg,#f8fcff,#e8f5fc);display:flex;flex-direction:column;border-left:4px solid var(--yellow);box-shadow:-8px 0 20px #0f3b4d0f;position:relative}.stage-head{padding:18px 24px 16px;background:linear-gradient(135deg,var(--blue-deep) 0%,#1a5775 100%);color:var(--white);position:relative;overflow:hidden;display:flex;flex-direction:column;gap:14px;border-bottom:3px solid rgba(255,217,59,.6)}.stage-head-row{display:flex;align-items:center;gap:16px;position:relative}.stage-head:before{content:"";position:absolute;top:-50px;right:-50px;width:180px;height:180px;background:radial-gradient(circle,rgba(255,217,59,.18) 0%,transparent 70%);border-radius:50%}.stage-head-icon{flex-shrink:0;width:54px;height:54px;border-radius:14px;background:var(--yellow);color:var(--blue-deep);font-size:30px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px 0 var(--yellow-dark);position:relative}.stage-head-text{position:relative;min-width:0;flex:1}.stage-head h2{margin:0 0 4px;font-size:22px}.stage-head p{margin:0;font-size:15px;opacity:.92;line-height:1.45}.stage-canvas-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:26px 22px;position:relative;background:radial-gradient(circle at 50% 40%,rgba(255,217,59,.18) 0%,transparent 55%),radial-gradient(circle at 20% 90%,rgba(41,182,230,.14) 0%,transparent 60%),linear-gradient(180deg,#f8fcff,#e6f3f9)}.stage-canvas-wrap:before,.stage-canvas-wrap:after{content:"★";position:absolute;color:#ffd93b73;font-size:22px;animation:twinkle 3s ease-in-out infinite;pointer-events:none}.stage-canvas-wrap:before{top:18px;left:22px;animation-delay:.4s}.stage-canvas-wrap:after{bottom:20px;right:26px;font-size:16px;animation-delay:1.2s}.stage-screen{position:relative;padding:14px 14px 18px;border-radius:28px;background:linear-gradient(145deg,#143c52,#0a2838);box-shadow:0 24px 50px #0f3b4d59,0 6px #00000040,inset 0 2px #ffffff14;width:fit-content;max-width:100%}.stage-screen:before{content:"";position:absolute;top:-10px;left:-10px;right:-10px;bottom:-10px;border-radius:34px;background:radial-gradient(circle at 50% 0%,rgba(255,217,59,.25) 0%,transparent 60%);z-index:-1;filter:blur(14px)}.topbar-middle{flex:1;display:flex;align-items:center;justify-content:center;min-width:0}.stage-hud{display:flex;gap:8px;flex-wrap:wrap;position:relative}.hud-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;background:#ffffff2e;border:1px solid rgba(255,255,255,.25);border-radius:999px;color:var(--white);font-size:13px;font-weight:700;font-family:Fredoka,Nunito,sans-serif;letter-spacing:.4px;text-shadow:0 1px 2px rgba(0,0,0,.2);transition:background .3s,color .3s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.hud-badge[hidden]{display:none}.hud-badge .hud-icon{font-size:16px}.hud-badge .hud-label{text-transform:uppercase;font-size:11px;opacity:.9}.hud-badge .hud-value{background:#00000047;padding:2px 8px;border-radius:999px;font-variant-numeric:tabular-nums}.hud-goal.done{background:var(--success);border-color:#ffffff80;color:#fff;box-shadow:0 0 10px #3fcf7b99}.hud-goal.done .hud-icon{filter:drop-shadow(0 0 4px #fff)}.screen-inner{position:relative;border-radius:16px;overflow:hidden;box-shadow:inset 0 0 0 2px #ffffff14,inset 0 4px 12px #00000080}#stage-canvas{background:var(--cream);display:block;max-width:100%;height:auto}.screen-glare{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(135deg,#ffffff24,#fff0 35%),linear-gradient(315deg,#ffffff0d,#fff0 30%);border-radius:16px}#stage-canvas.celebrating{animation:celebrate .6s ease-out}@keyframes celebrate{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.04) rotate(-2deg)}75%{transform:scale(1.04) rotate(2deg)}}.stage-controls{padding:18px 24px;background:var(--white);display:flex;gap:12px;border-top:3px solid #e3eff4}.stage-controls button{flex:1}.feedback-toast{position:absolute;top:18px;left:50%;transform:translate(-50%,-30px);opacity:0;pointer-events:none;display:inline-flex;align-items:center;gap:14px;max-width:calc(100% - 40px);padding:16px 26px 16px 20px;background:var(--white);color:var(--blue-deep);border-radius:999px;box-shadow:0 8px 24px #0f3b4d38,0 2px #0000000d inset;font-weight:700;font-size:18px;line-height:1.25;transition:opacity .25s ease,transform .25s cubic-bezier(.34,1.56,.64,1);z-index:50;border:3px solid transparent}.feedback-toast.shown{opacity:1;transform:translate(-50%);pointer-events:auto}.feedback-toast .toast-icon{font-size:34px;line-height:1;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--cream)}.feedback-toast .toast-text{display:inline-block;max-width:460px}.feedback-toast[data-state=ok]{background:linear-gradient(135deg,#e8fff1,#c7f5d9);border-color:var(--success);color:#14733f;animation:toast-bounce .6s cubic-bezier(.34,1.56,.64,1)}.feedback-toast[data-state=ok] .toast-icon{background:var(--success);color:var(--white)}.feedback-toast[data-state=error]{background:linear-gradient(135deg,#ffecec,#fcc);border-color:var(--danger);color:#a02222;animation:toast-shake .5s ease-in-out}.feedback-toast[data-state=error] .toast-icon{background:var(--danger);color:var(--white)}.feedback-toast[data-state=info]{background:linear-gradient(135deg,#fff8e1,#ffe9a8);border-color:var(--yellow)}.feedback-toast[data-state=info] .toast-icon{background:var(--yellow)}@keyframes toast-bounce{0%{transform:translate(-50%,-30px) scale(.6);opacity:0}60%{transform:translate(-50%,6px) scale(1.08);opacity:1}to{transform:translate(-50%) scale(1);opacity:1}}@keyframes toast-shake{0%,to{transform:translate(-50%)}25%{transform:translate(calc(-50% - 8px))}75%{transform:translate(calc(-50% + 8px))}}.blocklyFlyoutLabelText{font-family:Fredoka,Nunito,sans-serif!important;font-weight:700!important;font-size:15px!important;fill:#fff!important}.wk-section-label>rect.blocklyFlyoutLabelBackground,.blocklyFlyoutLabel>rect{rx:8;ry:8;stroke:#0000001a;stroke-width:1}.wk-section-0 .blocklyFlyoutLabelText{fill:#fff!important}.blocklyFlyoutLabel{cursor:default}.wk-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f3b4d8c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;opacity:0;transition:opacity .2s ease}.wk-modal-backdrop.shown{opacity:1}.wk-modal{background:var(--white);color:var(--blue-deep);border-radius:var(--radius);padding:32px 30px 24px;max-width:460px;width:100%;box-shadow:0 30px 60px #00000059,0 0 0 4px var(--yellow);text-align:center;transform:translateY(20px) scale(.92);transition:transform .25s cubic-bezier(.34,1.56,.64,1);font-family:Nunito,sans-serif}.wk-modal-backdrop.shown .wk-modal{transform:translateY(0) scale(1)}.tone-success .wk-modal{box-shadow:0 30px 60px #00000059,0 0 0 4px var(--success)}.tone-warning .wk-modal{box-shadow:0 30px 60px #00000059,0 0 0 4px var(--danger)}.wk-modal-icon{width:72px;height:72px;margin:0 auto 14px;background:var(--yellow);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:40px;box-shadow:0 6px 0 var(--yellow-dark);animation:pop-in .4s cubic-bezier(.34,1.56,.64,1)}.tone-success .wk-modal-icon{background:var(--success);box-shadow:0 6px 0 var(--success-dark);color:#fff}.tone-warning .wk-modal-icon{background:var(--danger);box-shadow:0 6px 0 var(--danger-dark);color:#fff}@keyframes pop-in{0%{transform:scale(0)}70%{transform:scale(1.15)}to{transform:scale(1)}}.wk-modal-title{font-family:Fredoka,Nunito,sans-serif;font-size:26px;margin:0 0 10px;color:var(--blue-deep)}.wk-modal-message{margin:0 0 24px;font-size:17px;line-height:1.45;color:#3a5968;font-weight:600}.wk-modal-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.wk-modal-btn{cursor:pointer;border:none;font-weight:700;border-radius:var(--radius-sm);padding:13px 24px;font-size:17px;font-family:Fredoka,Nunito,sans-serif;letter-spacing:.3px;transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,background .2s;min-width:130px}.wk-modal-btn:hover{transform:translateY(-2px)}.wk-modal-btn:active{transform:translateY(1px)}.wk-modal-btn-primary{background:var(--yellow);color:var(--blue-deep);box-shadow:0 5px 0 var(--yellow-dark)}.wk-modal-btn-primary:hover{background:#ffe066}.wk-modal-btn-success{background:var(--success);color:#fff;box-shadow:0 5px 0 var(--success-dark)}.wk-modal-btn-success:hover{background:#4dd98a}.wk-modal-btn-danger{background:var(--danger);color:#fff;box-shadow:0 5px 0 var(--danger-dark)}.wk-modal-btn-secondary{background:#e8f1f6;color:var(--blue-deep);box-shadow:0 5px #b3d8e6}.wk-modal-btn-secondary:hover{background:#d8eaf1}.confetti-canvas{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999}@media (max-width: 1100px){.editor-main{grid-template-columns:1fr 460px}}@media (max-width: 900px){:root{font-size:16px}.home{grid-template-columns:1fr;padding:30px 20px;text-align:center}.home-hero{text-align:center;margin:0 auto}.home-hero .brand{font-size:72px}.home-mascot img{max-width:280px}.editor-main{grid-template-columns:1fr;grid-template-rows:1fr auto}.stage-area{border-left:none;border-top:4px solid var(--yellow)}.topbar-middle{display:none}.stage-hud{width:100%;justify-content:flex-start}}.menu{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#1b2a4e,#0f1a36);color:#fff}.menu-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.menu-title{font-size:clamp(1.6rem,4vw,2.6rem);text-align:center;margin:0 0 2.5rem}.menu-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;width:100%;max-width:820px}.menu-card{background:#fff;color:#233;border:none;border-radius:24px;padding:2rem 1.5rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.6rem;box-shadow:0 10px 30px #00000040;transition:transform .15s ease,box-shadow .15s ease}.menu-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px #0000004d}.menu-card:active{transform:translateY(-1px)}.menu-card-icon{font-size:4rem;line-height:1}.menu-card h2{margin:.2rem 0 0;font-size:1.6rem}.menu-card p{margin:0;color:#556;text-align:center}.menu-card-desafios{background:linear-gradient(160deg,#fff 60%,#ffeaa0)}.menu-card-proyectos{background:linear-gradient(160deg,#fff 60%,#d8c3ff)}.projects{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#1b2a4e,#0f1a36);color:#fff}.projects-main{flex:1;padding:2rem;max-width:1100px;width:100%;margin:0 auto}.projects-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}.projects-head h1{margin:0 0 .3rem}.projects-head p{margin:0;color:#c9d4ee}.projects-new{font-size:1.05rem;padding:.8rem 1.4rem}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.1rem}.projects-empty{grid-column:1 / -1;text-align:center;padding:3rem 1rem;background:#ffffff0d;border-radius:20px;border:2px dashed rgba(255,255,255,.2)}.projects-empty-icon{font-size:3.5rem}.projects-empty h2{margin:.5rem 0}.projects-empty p{margin:0;color:#c9d4ee}.project-card{position:relative;background:#fff;color:#233;border-radius:18px;overflow:hidden;box-shadow:0 6px 18px #0003;transition:transform .15s ease}.project-card:hover{transform:translateY(-3px)}.project-card-open{all:unset;cursor:pointer;display:flex;flex-direction:column;width:100%;box-sizing:border-box}.project-card-thumb{height:100px;display:flex;align-items:center;justify-content:center;font-size:3rem}.project-thumb-principiante{background:linear-gradient(135deg,#a7e9a8,#4caf50)}.project-thumb-junior{background:linear-gradient(135deg,#c9a7f7,#7b3ff2)}.project-card-body{padding:.8rem 1rem 1rem;display:flex;flex-direction:column;gap:.2rem}.project-card-body h3{margin:0;font-size:1.1rem}.project-card-level{font-size:.85rem;color:#666}.project-card-date{font-size:.75rem;color:#999}.project-card-delete{position:absolute;top:8px;right:8px;background:#00000080;color:#fff;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s ease}.project-card:hover .project-card-delete{opacity:1}.project-card-delete:hover{background:#d9534f}.modal-new-project{max-width:480px;width:100%}.modal-new-project .modal-body{display:flex;flex-direction:column;gap:1rem;padding:1.2rem}.modal-new-project label{font-weight:600}.modal-new-project input[type=text],.modal-new-project #np-name{padding:.7rem .9rem;border:2px solid #ddd;border-radius:12px;font-size:1rem;width:100%;box-sizing:border-box}.modal-new-project #np-name:focus{outline:none;border-color:#7b3ff2}.np-levels{border:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem}.np-levels legend{font-weight:600;margin-bottom:.3rem}.np-level{display:flex;align-items:stretch;cursor:pointer}.np-level input{position:absolute;opacity:0;pointer-events:none}.np-level-card{flex:1;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:0 .8rem;padding:.8rem 1rem;border:2px solid #e2e2e2;border-radius:14px;transition:border-color .15s ease,background .15s ease}.np-level-card .np-level-icon{grid-row:1 / 3;font-size:2rem;align-self:center}.np-level-card strong{font-size:1.05rem}.np-level-card .np-level-sub{font-size:.85rem;color:#666}.np-level input:checked+.np-level-card{border-color:#7b3ff2;background:#f6f0ff}.modal-actions{display:flex;gap:.6rem;justify-content:flex-end;margin-top:.3rem}.save-indicator{font-size:.85rem;color:#4caf50;opacity:0;transition:opacity .2s ease;margin-right:.3rem}.save-indicator.shown{opacity:1}
