:root{--bg:#05080f;--bg2:#0a1020;--panel:#0f1a34;--panel2:#0c1528;--line:#20325c;--ink:#eaf2ff;--dim:#93a7d4;--dim2:#586a97;--cyan:#3fe3ff;--cyan-d:#1aa6d8;--gold:#ffcf3f;--green:#57e08f;--red:#ff5d70;--purple:#bd93ff;--magenta:#ff86c8;--orange:#ff9d43;--font-ui:"Segoe UI",system-ui,-apple-system,Roboto,sans-serif;--font-dsp:"Bahnschrift","DIN Alternate","Segoe UI Semibold",var(--font-ui);--r:14px}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-ui);overflow:hidden;user-select:none;-webkit-user-select:none;position:fixed;inset:0}#app{position:fixed;inset:0}img{image-rendering:pixelated}.ic{display:inline-flex;width:1em;height:1em;vertical-align:-.14em}.ic svg{width:100%;height:100%;stroke-width:2.2}.screen{position:absolute;inset:0;display:flex;flex-direction:column}.screen-enter{opacity:0;transform:scale(1.015)}.screen{transition:opacity .26s ease,transform .26s ease}.screen-exit{opacity:0;transform:scale(.985);pointer-events:none}.btn{font-family:var(--font-dsp);letter-spacing:.5px;height:52px;padding:0 26px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(180deg,#16234400,#0c152880);color:var(--ink);font-size:17px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:transform .1s,border-color .15s,box-shadow .15s,background .15s;backdrop-filter:blur(4px)}.btn:hover{transform:translateY(-2px);border-color:var(--cyan)}.btn:active{transform:translateY(0)}.btn .ic{font-size:20px}.btn.primary{background:linear-gradient(180deg,#54e9ff,#1c9fd4);color:#04121f;border:none;box-shadow:0 8px 22px #3fe3ff44,inset 0 1px #fff6;font-weight:700}.btn.primary:hover{filter:brightness(1.07);box-shadow:0 12px 30px #3fe3ff66}.btn.big{height:60px;font-size:20px;width:100%}.btn.ghost{background:#0e1a3366}.btn.warn:hover{border-color:var(--red)}.icon-btn{width:44px;height:44px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);color:var(--ink);font-size:20px;cursor:pointer;display:grid;place-items:center;transition:.12s;flex:0 0 auto}.icon-btn:hover{border-color:var(--cyan);color:var(--cyan)}.icon-btn .ic{font-size:20px}.boot{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:radial-gradient(900px 600px at 50% 35%,#12224a 0%,var(--bg) 60%);transition:opacity .4s}.boot-out{opacity:0}.boot-emblem{width:96px;height:96px;background:url(/assets/sprites/emblem.png) center/contain no-repeat;image-rendering:pixelated;filter:drop-shadow(0 0 22px #3fe3ff88);animation:float 2.4s ease-in-out infinite}@keyframes float{50%{transform:translateY(-8px)}}.boot-title{font-family:var(--font-dsp);font-size:34px;font-weight:700;letter-spacing:6px;color:#dff4ff;text-shadow:0 0 20px #3fe3ff88}.boot-bar{width:220px;height:8px;border-radius:8px;background:#0e1a33;border:1px solid var(--line);overflow:hidden}.boot-fill{height:100%;width:0;background:linear-gradient(90deg,#3fe3ff,#ffcf3f);transition:width .2s;box-shadow:0 0 14px #3fe3ff}.boot-pct{font-family:var(--font-dsp);color:var(--dim);font-size:13px;letter-spacing:2px}.title-screen{position:absolute;inset:0;overflow:hidden}.title-screen{background:radial-gradient(1100px 720px at 50% 38%,#0e1a34,#060a14 68%),repeating-linear-gradient(0deg,transparent 0 39px,#12213d22 39px 40px),repeating-linear-gradient(90deg,transparent 0 39px,#12213d22 39px 40px)}.title-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;display:block}.title-veil{position:absolute;inset:0;pointer-events:none;background:radial-gradient(560px 380px at 50% 42%,#05080fee,#05080f88 45%,#05080f00 75%),linear-gradient(180deg,#05080f66,#05080f00 30% 70%,#05080fdd)}.title-hint{position:absolute;left:0;right:0;bottom:64px;text-align:center;color:var(--dim2);font-size:11px;letter-spacing:1px;pointer-events:none;animation:hintpulse 4s ease-in-out infinite}@keyframes hintpulse{50%{opacity:.45}}.title-scan{position:absolute;inset:0;pointer-events:none;opacity:.25;mix-blend-mode:overlay;background:repeating-linear-gradient(0deg,#000 0 2px,#0000 2px 4px)}.title-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;pointer-events:none}.title-inner>*{pointer-events:auto}.title-emblem{width:112px;height:112px;display:block;image-rendering:pixelated;filter:drop-shadow(0 0 20px #3fe3ff77);animation:float 3s ease-in-out infinite;margin-bottom:6px}.wordmark{font-family:var(--font-dsp);font-weight:700;line-height:.92;letter-spacing:2px}.wordmark .w1{display:block;font-size:clamp(44px,13vw,84px);color:#eafbff;text-shadow:0 0 26px #3fe3ff99,0 3px 0 #0b2a3a}.wordmark .w2{display:block;font-size:clamp(44px,13vw,84px);background:linear-gradient(180deg,#ffe98a,#ff9d43);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px #ffcf3f66)}.title-tag{margin-top:14px;color:var(--dim);font-size:14px;letter-spacing:.5px;max-width:340px}.title-menu{margin-top:26px;display:flex;flex-direction:column;gap:10px;width:min(340px,86vw)}.title-menu .btn.big{background:#0c1830;border:1px solid #1e335c;color:#e7eefc;justify-content:flex-start;padding:0 22px;box-shadow:none;font-weight:600}.title-menu .btn.big .ic{margin-right:6px;color:var(--cyan)}.title-menu .btn.big:hover{border-color:var(--cyan);background:#0f2242;transform:translateY(-1px)}.title-menu .btn.primary.big{background:linear-gradient(180deg,#1d5f7a,#123f54);border:1px solid #3fe3ff66;color:#eafcff}.title-menu .btn.primary.big .ic{color:#eafcff}.title-menu .btn.primary.big:hover{background:linear-gradient(180deg,#247795,#154a63);border-color:var(--cyan)}.title-foot{position:absolute;left:0;right:0;bottom:20px;display:flex;align-items:center;justify-content:center;gap:16px}.title-corner{position:absolute;top:16px;right:16px;display:flex;gap:10px;z-index:6}.chip{display:inline-flex;align-items:center;gap:7px;background:#0b1428cc;border:1px solid var(--line);padding:8px 14px;border-radius:22px;font-weight:700;font-size:14px;font-family:var(--font-dsp);letter-spacing:1px}.chip .ic{color:var(--gold);font-size:16px}.select-screen{position:absolute;inset:0;display:flex;flex-direction:column;background:radial-gradient(700px 500px at 80% -10%,#122247 0,var(--bg) 55%)}.sel-head{display:flex;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid var(--line);background:#080e1ccc;backdrop-filter:blur(8px);z-index:2}.sel-head h1{font-family:var(--font-dsp);font-size:22px;letter-spacing:1px;font-weight:700}.sel-head .chip{margin-left:auto}.sel-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:10px 16px 60px}.sel-inner{max-width:840px;margin:0 auto}.sel-head h1{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.world-head>div:nth-child(2){min-width:0;flex:1}.world{margin-top:24px}.world-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.world-badge{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-family:var(--font-dsp);font-weight:700;font-size:15px;background:#12213f;border:1px solid var(--line)}.world-name{font-family:var(--font-dsp);font-size:18px;font-weight:700;letter-spacing:.5px}.world-sub{color:var(--dim2);font-size:12px}.world-prog{margin-left:auto;color:var(--gold);font-size:13px;font-weight:700;font-family:var(--font-dsp)}.lv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:10px}.lv{position:relative;aspect-ratio:1;border-radius:14px;background:linear-gradient(180deg,#13203d,#0c1528);border:1px solid var(--line);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding-bottom:10px;transition:transform .1s,border-color .15s,box-shadow .15s;overflow:hidden}.lv:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 120%,#3fe3ff22,transparent 60%);opacity:0}.lv:hover{transform:translateY(-3px);border-color:var(--cyan);box-shadow:0 8px 22px #0007}.lv:hover:before{opacity:1}.lv .n{font-family:var(--font-dsp);font-size:22px;font-weight:700}.lv .s{font-size:11px;letter-spacing:2px;color:var(--gold);height:13px;line-height:1}.lv .s .off{color:#33436b}.lv.done{border-color:#2b6b4a}.lv.locked{opacity:.45;cursor:not-allowed;background:#0b1120}.lv.locked:hover{transform:none;border-color:var(--line);box-shadow:none}.lv.locked .n{color:var(--dim2)}.lv .lockic{color:var(--dim2);font-size:16px}.diffbar{position:absolute;bottom:7px;left:0;right:0;display:flex;gap:3px;justify-content:center}.diffbar i{width:6px;height:3px;border-radius:2px;background:#25355e}.diffbar i.d1{background:#57e08f}.diffbar i.d2{background:#a8dd5c}.diffbar i.d3{background:#ffcf3f}.diffbar i.d4{background:#ff9d43}.diffbar i.d5{background:#ff5d70}.lv.locked .diffbar i.on{opacity:.45}.play-screen{position:absolute;inset:0;display:flex;flex-direction:column;background:radial-gradient(800px 600px at 70% -15%,#101f45 0,var(--bg) 55%)}.hud{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#080e1ccc;border-bottom:1px solid var(--line);backdrop-filter:blur(8px);z-index:3}.hud-title{min-width:0}.hud-title .nm{font-family:var(--font-dsp);font-weight:700;font-size:16px;letter-spacing:.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-title .ht{color:var(--dim);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}.hud-right{margin-left:auto;display:flex;align-items:center;gap:10px;flex:0 0 auto}.objbar{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap;padding:8px 12px;background:#070c18cc;border-bottom:1px solid var(--line);backdrop-filter:blur(6px);z-index:2}.goalpill{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;background:#0b1428;border:1px solid var(--line);color:var(--dim);font-size:12px;padding:6px 12px;border-radius:20px}.goalpill b{color:var(--gold);font-family:var(--font-dsp)}.goalpill .ic{font-size:14px;color:var(--cyan)}.tickbox{font-family:var(--font-dsp);font-variant-numeric:tabular-nums;font-weight:700;font-size:15px;color:var(--cyan);min-width:74px;text-align:right;letter-spacing:1px}.stage{flex:1;position:relative;display:grid;place-items:center;overflow:hidden;padding:8px}.board-wrap{position:relative}#board{touch-action:none;border-radius:16px;box-shadow:0 24px 60px #000a,0 0 0 1px #ffffff08}#flash{position:absolute;inset:0;border-radius:16px;pointer-events:none;opacity:0;transition:opacity .22s;mix-blend-mode:screen}.shake{animation:shk .34s}@keyframes shk{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(3px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}.dock{padding:12px 14px calc(14px + env(safe-area-inset-bottom));background:#080e1ccc;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px;backdrop-filter:blur(8px)}.palette{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;min-height:4px}.tool{position:relative;min-width:76px;height:66px;border-radius:14px;background:linear-gradient(180deg,#13203d,#0c1528);border:1px solid var(--line);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px 12px;transition:.12s}.tool:hover{border-color:var(--cyan)}.tool.sel{border-color:var(--cyan);background:#14315c;box-shadow:0 0 0 2px #3fe3ff33,0 6px 16px #0006}.tool.empty{opacity:.35;pointer-events:none;filter:grayscale(.6)}.tool .spr{width:30px;height:30px;image-rendering:pixelated;background-size:contain;background-repeat:no-repeat;background-position:center}.tool .tl{font-size:11px;color:var(--dim);font-weight:600}.tool .cnt{position:absolute;top:-8px;right:-8px;background:var(--cyan);color:#04121f;font-weight:800;font-size:12px;min-width:22px;height:22px;border-radius:22px;display:grid;place-items:center;padding:0 6px;box-shadow:0 2px 8px #0006}.hinttip{text-align:center;color:var(--dim2);font-size:12px;min-height:14px}.controls{display:flex;gap:8px;justify-content:center;align-items:center}.controls .btn{height:48px;padding:0 16px;font-size:15px}.controls .btn.run{padding:0 30px}.controls .icon-btn{width:48px;height:48px}.overlay{position:absolute;inset:0;background:#05080fd8;display:grid;place-items:center;z-index:30;padding:20px;animation:fade .22s ease}@keyframes fade{0%{opacity:0}to{opacity:1}}.card{position:relative;background:linear-gradient(180deg,#13224a,#0c1730);border:1px solid var(--line);border-radius:22px;padding:30px 34px;text-align:center;min-width:min(360px,90vw);box-shadow:0 30px 80px #000b;animation:pop .38s cubic-bezier(.2,1.35,.4,1)}@keyframes pop{0%{transform:scale(.82);opacity:0}to{transform:scale(1);opacity:1}}.card h2{font-family:var(--font-dsp);font-size:28px;letter-spacing:1px;margin-bottom:4px}.card .sub{color:var(--dim);font-size:13px;margin-bottom:16px}.starrow{display:flex;justify-content:center;gap:16px;margin:6px 0 14px}.st{display:flex;flex-direction:column;align-items:center;gap:5px}.st .ic{font-size:44px;color:#2c3d63;transition:.1s}.st.on .ic{color:var(--gold);filter:drop-shadow(0 0 14px #ffcf3f88);animation:starpop .5s cubic-bezier(.2,1.7,.4,1) both}.st.on .ic svg{fill:var(--gold)}@keyframes starpop{0%{transform:scale(0) rotate(-35deg)}70%{transform:scale(1.3)}to{transform:scale(1)}}.st .lbl{font-size:10px;color:var(--dim2)}.st.on .lbl{color:var(--dim)}.streak{color:var(--gold);font-family:var(--font-dsp);font-weight:700;font-size:14px;min-height:18px;margin-bottom:14px;letter-spacing:.5px}.card-btns{display:flex;gap:10px;justify-content:center}.card-btns .btn{height:50px}.toast{position:absolute;left:50%;bottom:26%;transform:translate(-50%);background:#2a0f1aee;border:1px solid var(--red);color:#ffd7dd;padding:11px 18px;border-radius:12px;font-size:13px;font-weight:600;z-index:20;pointer-events:none;box-shadow:0 10px 30px #0008;max-width:80vw;text-align:center;animation:tin .28s ease}@keyframes tin{0%{transform:translate(-50%,10px);opacity:0}to{transform:translate(-50%);opacity:1}}.guide-card{max-width:min(520px,92vw)}.guide-card.wide{max-width:min(620px,94vw)}.guide-eyebrow{font-family:var(--font-dsp);font-size:12px;letter-spacing:3px;color:var(--cyan);margin-bottom:6px}.guide-card{display:flex;flex-direction:column;max-height:88vh}.guide-list{display:flex;flex-direction:column;gap:12px;margin:16px 0 20px;text-align:left;max-height:min(56vh,460px);overflow-y:auto;padding-right:6px;flex:1 1 auto}.guide-item{display:flex;gap:14px;align-items:flex-start;background:#0b142acc;border:1px solid var(--line);border-radius:14px;padding:12px 14px}.guide-spr{width:48px;height:48px;flex:0 0 auto;image-rendering:pixelated;background:#0a1226;border:1px solid var(--line);border-radius:10px}.guide-spr.glyph{display:grid;place-items:center;font-family:var(--font-dsp);font-weight:800;font-size:26px;color:var(--gold);border-color:#4a3a1a;text-shadow:0 0 10px #ffcf3f66}.guide-body{min-width:0}.guide-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:4px}.guide-name{font-family:var(--font-dsp);font-weight:700;font-size:16px}.guide-desc{font-size:13px;color:var(--dim);line-height:1.5}.tag{font-size:10px;font-weight:700;letter-spacing:.5px;padding:2px 7px;border-radius:20px;background:#1a2745;border:1px solid var(--line);color:var(--dim2)}.tag.place{background:#0f3350;border-color:#1c5f80;color:var(--cyan)}.tag.w{background:#241a3d;border-color:#3d2c63;color:var(--purple)}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--line)}.settings-row:first-of-type{border-top:none}.switch{width:52px;height:30px;border-radius:20px;background:#22345c;position:relative;cursor:pointer;transition:.15s;border:1px solid var(--line)}.switch.on{background:var(--cyan-d)}.switch:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:.15s}.switch.on:after{left:25px}@media (max-width:560px){.wordmark .w1,.wordmark .w2{font-size:clamp(40px,15vw,70px)}.hud-title .ht{max-width:40vw}.controls .btn{padding:0 12px}}@media (prefers-reduced-motion:reduce){*{animation-duration:1ms!important;transition-duration:.05s!important}}.title-subrow{display:flex;gap:8px;margin-top:2px}.title-subrow .btn{flex:1 1 0;min-width:0;height:46px;padding:0 6px;font-size:13px;white-space:nowrap;overflow:hidden}.title-subrow .btn .ic{font-size:16px}.title-menu .btn.big.endless .ic{color:var(--purple)}.title-menu .btn.big.endless:hover{border-color:var(--purple)}.icon-btn.hint{color:var(--gold)}.icon-btn.hint:hover{border-color:var(--gold);color:var(--gold);box-shadow:0 0 16px #ffcf3f44}.confetti{position:absolute;top:-8%;width:9px;height:14px;border-radius:2px;pointer-events:none;animation:confetti-fall 1.5s cubic-bezier(.3,.5,.6,1) forwards;opacity:.95;z-index:5}@keyframes confetti-fall{to{transform:translateY(560px) rotate(540deg);opacity:0}}.ach-toast{position:fixed;top:18px;left:50%;transform:translate(-50%,-140%);z-index:60;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:16px;background:linear-gradient(180deg,#14224a,#0c1730);border:1px solid var(--gold);box-shadow:0 14px 40px #000a,0 0 22px #ffcf3f33;transition:transform .4s cubic-bezier(.2,1.4,.5,1)}.ach-toast.in{transform:translate(-50%)}.ach-toast .ach-emoji{width:38px;height:38px;image-rendering:pixelated;filter:drop-shadow(0 2px 4px #000)}.ach-toast .ach-t{font-size:11px;letter-spacing:1px;color:var(--gold);font-family:var(--font-dsp)}.ach-toast .ach-n{font-size:16px;font-weight:700;color:var(--ink)}.ach-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 4px;max-height:52vh;overflow:auto;padding-right:4px}.ach-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:#0c162e88;border:1px solid var(--line);opacity:.6}.ach-item.got{opacity:1;border-color:#3a5a92;background:linear-gradient(180deg,#122145,#0c1730)}.ach-badge{width:46px;height:46px;flex:0 0 auto;image-rendering:pixelated;border-radius:12px;background:#0a1428;border:1px solid var(--line);padding:3px}.ach-badge.locked{opacity:.5;filter:grayscale(.6)}.ach-item.got .ach-badge{box-shadow:0 0 16px #ffcf3f22}.ach-name{font-weight:700;font-size:15px}.ach-desc{font-size:12px;color:var(--dim)}.ach-check{margin-left:auto;color:var(--green)}@media (max-width:640px){.ach-list{grid-template-columns:1fr}}.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:14px 0 4px;max-height:52vh;overflow:auto}.theme-card{padding:12px;border-radius:16px;background:#0c162e;border:1px solid var(--line);cursor:pointer;text-align:center;transition:.14s;display:flex;flex-direction:column;align-items:center;gap:8px}.theme-card:hover{transform:translateY(-2px)}.theme-card.sel{border-color:var(--cyan);box-shadow:0 0 18px #3fe3ff33}.theme-card.locked{opacity:.55;cursor:default}.theme-card.locked:hover{transform:none}.theme-name{font-weight:700;font-size:14px}.theme-tag{font-size:12px;color:var(--cyan);font-family:var(--font-dsp)}.theme-tag.lock{color:var(--dim2)}.theme-card.sel .theme-tag{color:var(--gold)}.goalchip{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:11px;background:#0c162e;border:1px solid var(--line);color:var(--dim);font-size:13px;font-family:var(--font-dsp);letter-spacing:.3px}.goalchip .ic{color:var(--gold);font-size:15px}.goalchip b{color:var(--ink);font-weight:700}@media (max-width:560px){.goalchip{display:none}}.coach{position:absolute;left:50%;bottom:14px;transform:translate(-50%);z-index:8;width:min(560px,92%);padding:14px 18px;border-radius:16px;text-align:center;line-height:1.5;background:linear-gradient(180deg,#14224acc,#0c1730ee);border:1px solid var(--cyan);box-shadow:0 12px 34px #000a,0 0 20px #3fe3ff22;backdrop-filter:blur(3px);color:var(--ink);font-size:15px;animation:coach-pop .3s ease both}.coach b{color:var(--cyan)}.coach .dim{color:var(--dim2);font-size:13px}@keyframes coach-pop{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.tut-badge{font-size:46px;text-align:center;margin-bottom:2px;filter:drop-shadow(0 4px 8px #000)}.set-hint{font-size:11px;color:var(--dim2);margin-top:2px}.theme-swatch{width:100%;height:auto;border-radius:10px;image-rendering:auto;display:block}.title-menu .btn.big.tutorial .ic{color:var(--green)}.title-menu .btn.big.tutorial:hover{border-color:var(--green)}
