@font-face{font-family:Sora;src:url(../fonts/Sora-VF.subset.woff2)format("woff2");font-weight:100 800;font-display:swap}@font-face{font-family:Figtree;src:url(../fonts/Figtree-VF.subset.woff2)format("woff2");font-weight:300 900;font-display:swap}@font-face{font-family:Noto Sans SC;src:url(../fonts/NotoSansSC-VF.subset.woff2)format("woff2");font-weight:100 900;font-display:swap}:root{--ink:#1b1838;--ink-2:#26214d;--ink-3:#3d3673;--cream:#fff7e8;--gold:#ffd35c;--gold-2:#ffb020;--orange:#ff7a45;--red:#ff4d6d;--prism:linear-gradient(90deg, #ff4d6d, #ffb020, #ffe45c, #4cd97b, #4dc3ff, #7a6cff, #ff5ce1);--display:"Sora", "Noto Sans SC", system-ui, sans-serif;--body:"Figtree", "Noto Sans SC", system-ui, sans-serif;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--notch:14px;--hard:5px 6px 0 #0c0a20bf}:lang(zh-CN){--display:"Noto Sans SC", "Sora", system-ui, sans-serif;--body:"Noto Sans SC", "Figtree", system-ui, sans-serif}*{box-sizing:border-box}html,body{background:var(--ink);height:100%;color:var(--cream);font-family:var(--body);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none;margin:0;overflow:hidden}#game{outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}button{font:inherit;color:inherit}svg{display:block}.is-hidden{display:none!important}.screen{opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s linear .3s;position:absolute;inset:0}.screen.is-active{opacity:1;visibility:visible;transition:opacity .3s}.screen.is-active :is(button,input,.modal){pointer-events:auto}.logo-text,.modal-title,.banner b,.ribbon b,.level-num,.results-total b,.boot-logo b,.hud-level b,.hud-stats b{font-family:var(--display);paint-order:stroke fill;-webkit-text-stroke:.16em var(--ink);letter-spacing:.01em}.plate,.modal,.toast,.hud-hint{--n:var(--notch);clip-path:polygon(var(--n) 0, 100% 0, 100% calc(100% - var(--n)), calc(100% - var(--n)) 100%, 0 100%, 0 var(--n))}.plate{background:linear-gradient(#ffffff12,#0000 40%),#1b1838d6;border:3px solid #fff7e829}kbd{background:var(--cream);min-width:1.9em;height:1.9em;color:var(--ink);font:800 12px/1 var(--display);white-space:nowrap;border-radius:6px;place-items:center;padding:0 .45em;display:inline-grid;box-shadow:0 3px #b9ad98}kbd.wide{min-width:3.4em}kbd.round{color:#fff;border-radius:50%;min-width:1.9em;padding:0;box-shadow:0 3px #00000073}kbd.a{background:#3fbf6a}kbd.b{background:var(--red)}kbd.x{background:#3f8cff}kbd.y{background:#f2b21c}.screen-boot{background:radial-gradient(ellipse at 50% 40%, #3a2e6e, var(--ink) 70%);flex-direction:column;justify-content:center;align-items:center;gap:22px;display:flex}.boot-logo{flex-direction:column;align-items:center;gap:8px;display:flex}.boot-logo svg{filter:drop-shadow(0 0 22px #ffdc8c8c);width:120px;animation:2.6s ease-in-out infinite bob}.boot-logo b{color:var(--gold);text-shadow:var(--hard);font-size:clamp(34px,6vw,58px);font-weight:800}.boot-bar{background:var(--ink-2);border:3px solid var(--ink-3);border-radius:7px;width:min(320px,70vw);height:14px;overflow:hidden}.boot-bar i{background:var(--prism);transform-origin:0;height:100%;transition:transform .3s;display:block;transform:scaleX(.04)}.boot-label{letter-spacing:.3em;text-transform:uppercase;opacity:.7;font-size:12px;font-weight:800}.menu{flex-direction:column;align-items:flex-start;gap:12px;display:flex}.menu-row{flex-flow:wrap;justify-content:center;align-items:center;gap:14px}.btn{cursor:pointer;min-width:260px;font:800 20px/1.1 var(--display);letter-spacing:.02em;text-transform:uppercase;text-align:left;color:var(--cream);isolation:isolate;background:0 0;border:0;outline:none;padding:14px 30px 14px 34px;transition:transform .14s cubic-bezier(.3,1.6,.5,1),color .12s;position:relative}.btn:before,.btn:after{content:"";z-index:-1;border-radius:6px;transition:background .12s,border-color .12s,translate .14s;position:absolute;inset:0;transform:skew(-10deg)}.btn:before{background:#0f0d26;translate:5px 6px}.btn:after{background:#1b1838e6;border:3px solid #fff7e838}.btn span{align-items:center;gap:12px;display:inline-flex;position:relative}.btn span:before{content:"";opacity:0;border-top:7px solid #0000;border-bottom:7px solid #0000;border-left:10px solid;width:0;height:0;margin-left:-22px;transition:all .14s;transform:translate(-8px)}.btn:is(:hover,:focus-visible,:focus){color:var(--ink);transform:translate(8px)scale(1.03)}.btn:is(:hover,:focus-visible,:focus):after{background:linear-gradient(180deg, #ffe89a, var(--gold) 55%, var(--gold-2));border-color:#fff4c2}.btn:is(:hover,:focus-visible,:focus):before{background:var(--orange)}.btn:is(:hover,:focus-visible,:focus) span:before{opacity:1;transform:none}.btn:active{transform:translate(8px)scale(.97)}.btn:active:before{translate:2px 3px}.btn-primary{color:var(--gold)}.btn-primary:after{border-color:var(--gold);background:linear-gradient(#503c96f2,#231e50f2)}.btn-small{min-width:0;padding:11px 22px;font-size:16px}.menu-row .btn{text-align:center;min-width:180px}.menu-row .btn-small{min-width:150px}.menu-row .btn span{justify-content:center}.menu-row .btn span:before{display:none}.menu-row .btn:is(:hover,:focus-visible,:focus){transform:translateY(-3px)scale(1.04)}.bottom-bar{left:calc(24px + var(--safe-l));right:calc(24px + var(--safe-r));bottom:calc(16px + var(--safe-b));text-shadow:0 2px 0 var(--ink);justify-content:space-between;align-items:center;font-size:13px;font-weight:700;display:flex;position:absolute}.bottom-bar small{opacity:.6;font-size:12px;font-weight:600}.prompts{gap:22px;display:flex}.prompts span{align-items:center;gap:7px;display:inline-flex}.title-vignette{background:radial-gradient(at 18%,#141032b8,#0000 55%),linear-gradient(90deg,#14103280,#0000 50%);position:absolute;inset:0}.title-block{left:calc(max(40px, 6vw) + var(--safe-l));flex-direction:column;align-items:flex-start;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.screen-title.is-active .title-block>*{animation:.7s cubic-bezier(.2,1.2,.4,1) both rise}.screen-title.is-active .tagline{animation-delay:80ms}.screen-title.is-active .menu{animation-delay:.16s}.screen-title.is-active .title-stars{animation-delay:.24s}.logo{align-items:center;gap:18px;margin-bottom:6px;display:flex}.logo-prism{filter:drop-shadow(0 0 20px #ffdc968c)drop-shadow(4px 5px #0c0a20cc);width:clamp(80px,10vw,128px);animation:3.2s ease-in-out infinite bob}.logo-text{color:var(--cream);-webkit-text-stroke:0;flex-direction:column;margin:0;font-size:clamp(50px,7.6vw,100px);font-weight:800;line-height:.95;display:flex}.logo-text span{color:#fffaf0;-webkit-text-stroke:.12em var(--ink);text-shadow:.06em .07em #0c0a20e6}.logo-text small{letter-spacing:.5em;text-transform:uppercase;color:var(--gold);-webkit-text-stroke:.14em var(--ink);text-shadow:3px 4px #0c0a20d9;margin-top:12px;font-size:.26em}.logo-text small:after{content:"";background:var(--prism);border-radius:3px;width:100%;height:5px;margin-top:8px;display:block;box-shadow:3px 3px #0c0a20d9}.tagline{max-width:34ch;text-shadow:0 2px 0 var(--ink), 0 0 12px #141032e6;margin:10px 0 26px;font-size:clamp(15px,1.5vw,19px);font-weight:700;line-height:1.45}.title-stars{font:800 18px var(--display);background:#1b1838bf;border:2px solid #ffd35c80;border-radius:999px;align-items:center;gap:8px;margin-top:22px;padding:8px 16px;display:inline-flex}.title-stars svg,.levels-total svg{width:22px;fill:var(--gold);stroke:var(--ink);stroke-width:1.5px}.title-stars small{opacity:.6;font-size:13px}.screen-levels{background:linear-gradient(#1410328c,#141032cc);place-items:center;display:grid}.levels-wrap{flex-direction:column;align-items:center;gap:22px;width:min(1180px,100vw - 48px);display:flex}.levels-head{justify-content:space-between;align-items:center;gap:16px;width:100%;display:flex}.levels-head .modal-title{text-align:left}.levels-total{font:800 18px var(--display);background:#1b1838cc;border:2px solid #ffd35c80;border-radius:999px;align-items:center;gap:8px;padding:8px 16px;display:inline-flex}.level-grid{grid-template-columns:repeat(5,1fr);gap:18px;width:100%;display:grid}.level-card{--n:16px;cursor:pointer;text-align:left;color:var(--cream);background:var(--ink-2);border:0;outline:none;flex-direction:column;min-height:300px;padding:0;transition:transform .16s cubic-bezier(.3,1.6,.5,1);display:flex;position:relative}.level-grid .level-card{box-shadow:var(--hard);border-radius:14px;overflow:hidden}.screen-levels.is-active .level-card{animation:.55s cubic-bezier(.2,1.2,.4,1) both rise}.screen-levels.is-active .level-card:nth-child(2){animation-delay:50ms}.screen-levels.is-active .level-card:nth-child(3){animation-delay:.1s}.screen-levels.is-active .level-card:nth-child(4){animation-delay:.15s}.screen-levels.is-active .level-card:nth-child(5){animation-delay:.2s}.level-art{background:linear-gradient(180deg, var(--sky-a), var(--sky-b) 70%, var(--sky-c));height:150px;display:block;position:relative;overflow:hidden}.level-art .isle{width:96px;height:70px;position:absolute;top:60%;left:50%;transform:translate(-50%,-50%)}.level-art .isle:before{content:"";background:var(--floor);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);z-index:1;height:28px;position:absolute;top:0;left:0;right:0}.level-art .isle:after{content:"";background:linear-gradient(180deg, var(--under), #00000073);clip-path:polygon(0 0,50% 25%,100% 0,50% 100%);height:56px;position:absolute;top:14px;left:0;right:0}.level-art .beam{background:var(--prism);opacity:.85;width:120%;height:4px;position:absolute;top:44%;left:-10%;transform:rotate(-12deg);box-shadow:0 0 14px #ffffffe6}.level-num{color:var(--cream);text-shadow:4px 5px #0c0a20cc;font-size:44px;font-weight:800;position:absolute;top:10px;left:14px}.level-body{background:linear-gradient(180deg, #ffffff0f, transparent 50%), var(--ink-2);border-top:3px solid #fff7e826;flex-direction:column;flex:1;gap:6px;padding:14px 16px 18px;transition:background .14s;display:flex}.level-body small{font:800 11px var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}.level-body b{font:800 19px/1.15 var(--display)}.level-body em{opacity:.75;margin-top:auto;font-size:13px;font-style:normal;font-weight:700}.level-stars{gap:4px;display:flex}.level-stars i svg{fill:#ffffff1f;stroke:#ffffff40;stroke-width:1.5px;width:22px}.level-stars i.on svg{fill:var(--gold);stroke:var(--ink)}.level-card:is(:hover,:focus,:focus-visible):not(.is-locked){transform:translateY(-8px)scale(1.03)}.level-card:is(:hover,:focus,:focus-visible):not(.is-locked) .level-body{background:linear-gradient(180deg, #ffe89a, var(--gold) 60%, var(--gold-2));color:var(--ink)}.level-card:is(:hover,:focus,:focus-visible):not(.is-locked) .level-body small{color:var(--ink);opacity:.7}.level-card:is(:hover,:focus,:focus-visible):not(.is-locked) .level-stars i:not(.on) svg{fill:#1b183826;stroke:#1b183859}.level-card.is-locked{cursor:not-allowed}.level-card.is-locked .level-art{filter:grayscale(.85)brightness(.55)}.level-card.is-locked .level-body{opacity:.6}.level-card.is-locked:focus{transform:scale(1.01)}.level-card.is-locked:focus .level-body{opacity:.85;outline-offset:-3px;outline:3px solid #fff7e866}.level-lock{background:var(--ink);border:3px solid #fff7e859;border-radius:50%;place-items:center;width:54px;height:54px;display:grid;position:absolute;top:48px;left:50%;transform:translate(-50%)}.level-lock svg{fill:none;width:26px;stroke:var(--cream);stroke-width:2.4px;stroke-linejoin:round}.level-card.shake{animation:.4s shake}.screen-modal{-webkit-backdrop-filter:blur(5px)saturate(.85);background:#13112a80;place-items:center;display:grid}.screen-results,.screen-final{-webkit-backdrop-filter:none;background:#13112a47}.modal{--n:20px;background:linear-gradient(#ffffff14,#0000 30%),radial-gradient(at 50% 0,#7a6cff47,#0000 60%),#221d48;border:3px solid #fff7e82e;flex-direction:column;align-items:center;gap:18px;width:min(560px,100vw - 32px);max-height:calc(100vh - 32px);padding:34px 34px 30px;display:flex;position:relative;overflow:auto}.screen-modal.is-active .modal{animation:.38s cubic-bezier(.2,1.4,.4,1) both pop}.modal:before{content:"";background:var(--prism);height:6px;position:absolute;top:0;left:0;right:0}.modal .menu{align-items:stretch;width:100%}.modal .menu:not(.menu-row) .btn{text-align:center;min-width:0}.modal .menu:not(.menu-row) .btn span{justify-content:center}.modal .menu:not(.menu-row) .btn span:before{display:none}.modal .menu:not(.menu-row) .btn:is(:hover,:focus-visible,:focus){transform:scale(1.04)}.modal-wide{width:min(820px,100vw - 32px)}.modal-title{text-transform:uppercase;color:var(--cream);text-align:center;text-shadow:5px 6px #0c0a20d9;margin:0;font-size:clamp(32px,5vw,48px);font-weight:800}.modal-sub{opacity:.7;text-align:center;margin:-8px 0 0;font-size:14px;font-weight:600}.modal-pause{width:min(760px,100vw - 32px)}.pause-body{grid-template-columns:1fr 1.2fr;align-items:start;gap:26px;width:100%;display:grid}.help-wrap{background:#0c0a2066;border:2px solid #fff7e81a;border-radius:12px;padding:16px 18px}.help-wrap h3{font:800 12px var(--display);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:0 0 10px}.help{flex-direction:column;gap:9px;font-size:14px;font-weight:700;display:flex}.help>div{justify-content:space-between;align-items:center;gap:10px;display:flex}.help .keys{flex-wrap:wrap;align-items:center;gap:5px;display:inline-flex}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px 24px;width:100%;display:grid}fieldset{background:#0c0a2059;border:2px solid #fff7e81f;border-radius:12px;margin:0;padding:14px 16px 6px}fieldset:last-child{grid-column:1/-1}legend{font:800 12px var(--display);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);padding:0 8px}.row{justify-content:space-between;align-items:center;gap:16px;min-height:50px;font-size:16px;font-weight:700;display:flex}input[type=range]{appearance:none;background:linear-gradient(90deg, var(--gold) var(--fill,50%), var(--ink) var(--fill,50%));border:2px solid var(--ink-3);cursor:pointer;border-radius:7px;outline:none;width:170px;height:14px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--cream);border:4px solid var(--ink);width:24px;height:24px;box-shadow:0 2px 0 var(--ink);border-radius:50%}input[type=range]::-moz-range-thumb{background:var(--cream);border:4px solid var(--ink);border-radius:50%;width:18px;height:18px}input[type=range]:focus{border-color:var(--gold);box-shadow:0 0 0 3px #ffd35c59}.toggle{cursor:pointer;background:0 0;border:0;outline:none;justify-content:flex-end;align-items:center;gap:10px;min-width:88px;padding:0;font-size:14px;font-weight:800;display:inline-flex}.toggle i{background:var(--ink);border:2px solid var(--ink-3);border-radius:14px;width:50px;height:28px;transition:all .18s;position:relative}.toggle i:after{content:"";background:#8a84b3;border-radius:50%;width:18px;height:18px;transition:all .18s cubic-bezier(.3,1.5,.5,1);position:absolute;top:3px;left:3px}.toggle[aria-pressed=true] i{background:var(--gold);border-color:var(--gold-2)}.toggle[aria-pressed=true] i:after{background:var(--ink);left:25px}.toggle:focus i{box-shadow:0 0 0 3px #ffd35c73}.seg{background:var(--ink);border:2px solid var(--ink-3);border-radius:10px;gap:3px;padding:3px;display:inline-flex}.seg button{cursor:pointer;color:#fff7e8a6;background:0 0;border:0;border-radius:7px;outline:none;padding:8px 14px;font-size:14px;font-weight:800;transition:all .14s}.seg button[aria-pressed=true]{background:var(--gold);color:var(--ink);box-shadow:0 2px 0 var(--gold-2)}.seg button:focus{color:var(--cream);box-shadow:0 0 0 3px #ffd35c8c}.seg button[aria-pressed=true]:focus{color:var(--ink)}.board{flex-direction:column;gap:6px;width:100%;display:flex}.board-empty{text-align:center;opacity:.75;margin:0;padding:24px 0;font-weight:700}.board-head,.board-row{grid-template-columns:44px 1fr 80px 100px;align-items:center;gap:10px;padding:8px 14px;display:grid}.board-head{font:800 11px var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);opacity:.85}.board-row{background:#0c0a2066;border-radius:8px;font-weight:700}.board-row b{text-align:right;font:800 17px var(--display)}.board-head span:last-child{text-align:right}.board-row .rank{background:var(--ink-3);width:30px;height:30px;font:800 14px var(--display);border-radius:50%;place-items:center;display:grid}.board-row .r1{background:var(--gold);color:var(--ink)}.board-row .r2{color:var(--ink);background:#cfd6e8}.board-row .r3{color:var(--ink);background:#e39a5c}.board-row.is-new{outline:3px solid var(--gold);animation:1.4s ease-in-out infinite glow}.board-row .name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.modal-results{gap:14px;width:min(520px,100vw - 32px);padding-top:26px}.ribbon{clip-path:polygon(0 0,100% 0,95% 50%,100% 100%,0 100%,5% 50%);background:linear-gradient(#7a6cff,#5140c8);flex-direction:column;align-items:center;margin:0 -14px;padding:12px 44px 14px;display:flex;position:relative}.ribbon-gold{background:linear-gradient(180deg, #ffe38a, var(--gold-2))}.ribbon small{font:800 12px var(--display);letter-spacing:.24em;text-transform:uppercase;opacity:.85}.ribbon b{text-transform:uppercase;color:var(--cream);text-shadow:4px 5px #0c0a20bf;font-size:clamp(28px,4.4vw,40px);font-weight:800}.results-name{font:800 18px var(--display);opacity:.85;margin:0}.results-stars{align-items:flex-end;gap:10px;display:flex}.results-stars i svg{fill:#ffffff1a;stroke:#ffffff47;stroke-width:1.2px;width:58px}.results-stars i:nth-child(2) svg{width:74px}.results-stars i.on svg{fill:var(--gold);stroke:var(--ink);stroke-width:1.6px;filter:drop-shadow(0 0 12px #ffc850cc)drop-shadow(3px 4px #0c0a20cc)}.screen-results.is-active .results-stars i.on{animation:.55s cubic-bezier(.2,1.6,.4,1) both starpop;animation-delay:var(--d)}.results-best{background:var(--red);font:800 13px var(--display);letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:5px 14px;animation:1.2s ease-in-out infinite glow}.results-stats,.final-stats{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;width:100%;display:grid}.results-stats>div,.final-stats>div{background:#0c0a2066;border-radius:10px;flex-direction:column;align-items:center;padding:10px;display:flex}.results-stats span,.final-stats span{font:800 11px var(--display);letter-spacing:.2em;text-transform:uppercase;opacity:.7}.results-stats b,.final-stats b{font:800 30px var(--display)}.results-stats small,.final-stats small{opacity:.6;font-size:13px;font-weight:700}.results-breakdown{flex-direction:column;gap:4px;width:100%;font-size:14px;font-weight:700;display:flex}.results-breakdown div{opacity:.85;justify-content:space-between;padding:0 6px;display:flex}.results-total{background:#ffd35c1f;border:2px solid #ffd35c66;border-radius:10px;justify-content:space-between;align-items:baseline;width:100%;padding:10px 14px;display:flex}.results-total span{font:800 13px var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}.results-total b{color:var(--gold);font-size:34px;font-weight:800}.final-text{text-align:center;max-width:36ch;margin:0;font-size:16px;font-weight:700;line-height:1.5}.final-save{gap:10px;width:100%;display:flex}.final-name{border:3px solid var(--ink-3);background:var(--ink);min-width:0;color:var(--cream);font:800 16px var(--display);-webkit-user-select:text;user-select:text;border-radius:8px;outline:none;flex:1;padding:12px 14px}.final-name:focus{border-color:var(--gold)}.final-saved{font:800 16px var(--display);color:var(--gold)}.hud-top{top:calc(16px + var(--safe-t));left:calc(18px + var(--safe-l));right:calc(18px + var(--safe-r));justify-content:space-between;align-items:flex-start;gap:16px;display:flex;position:absolute}.hud-level-wrap,.hud-stats-wrap{filter:drop-shadow(var(--hard))}.hud-level{flex-direction:column;min-width:200px;padding:10px 22px 12px 18px;display:flex}.hud-level small{font:800 11px var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}.hud-level b{font-size:22px;font-weight:800}.hud-crystals{box-shadow:var(--hard);background:#1b1838b8;border:3px solid #fff7e824;border-radius:999px;gap:8px;padding:8px 14px;display:flex;position:absolute;top:0;left:50%;transform:translate(-50%)}.hud-crystals i{place-items:center;width:30px;height:30px;transition:transform .2s;display:grid}.hud-crystals svg{width:26px;fill:color-mix(in srgb, var(--c) 22%, #1b1838);stroke:color-mix(in srgb, var(--c) 60%, #fff);stroke-width:1.6px;stroke-linejoin:round;transition:all .25s}.hud-crystals i.is-lit svg{fill:var(--c);stroke:#fff;filter:drop-shadow(0 0 8px var(--c)) drop-shadow(0 0 3px #fff)}.hud-crystals i.is-lit{transform:scale(1.18)}.hud-crystals.pop{animation:.45s cubic-bezier(.2,1.6,.4,1) pulseX}.hud-right{align-items:flex-start;gap:12px;display:flex}.hud-stats{gap:20px;padding:8px 18px 10px;display:flex}.hud-stats>div{flex-direction:column;align-items:flex-end;display:flex}.hud-stats small{font:800 10px var(--display);letter-spacing:.2em;text-transform:uppercase;opacity:.7}.hud-stats b{font-size:24px;font-weight:800;line-height:1.1}.hud-stats em{color:var(--gold);font-size:11px;font-style:normal;font-weight:800}.hud-moves.is-over em{color:var(--orange)}.hud-btn{cursor:pointer;background:linear-gradient(#ffffff14,#0000 50%),#1b1838db;border:3px solid #fff7e838;border-radius:16px;place-items:center;width:58px;height:58px;padding:0;transition:transform .12s cubic-bezier(.3,1.6,.5,1),background .12s,border-color .12s;display:grid;position:relative;box-shadow:4px 5px #0c0a20cc}.hud-btn svg{fill:none;width:28px;stroke:var(--cream);stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round}.hud-btn:hover{border-color:var(--gold);background:linear-gradient(#4a3f96,#2f2766);transform:translateY(-3px)}.hud-btn.is-pressed{animation:.22s press}.hud-btn.is-disabled{opacity:.45}.hud-btn-label{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.hud-key{min-width:1.7em;height:1.7em;font-size:11px;position:absolute;bottom:-6px;right:-6px}.hud-pause{width:52px;height:52px}.hud-bottom{left:calc(18px + var(--safe-l));right:calc(18px + var(--safe-r));bottom:calc(16px + var(--safe-b));justify-content:space-between;align-items:flex-end;gap:16px;display:flex;position:absolute}.hud-actions{gap:12px;margin-left:auto;display:flex}.hud-context{text-shadow:0 2px 0 var(--ink), 0 0 8px #141032e6;white-space:nowrap;opacity:.92;gap:18px;font-size:13px;font-weight:800;display:flex;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.hud-context span{align-items:center;gap:6px;display:inline-flex}.touch-pad{gap:14px;display:flex}.touch-rotate,.touch-slide{gap:10px;display:flex}.touch-pad .hud-btn{border-radius:50%;width:72px;height:72px}.touch-pad .hud-btn svg{width:34px}.hud-bottom,.hud-context{transition:opacity .4s}.hud.is-solved .hud-bottom,.hud.is-solved .hud-context{opacity:0}.toast{--n:10px;left:50%;top:calc(80px + var(--safe-t));text-align:center;opacity:0;background:#1b1838eb;border:3px solid #ffd35c8c;max-width:min(560px,100vw - 40px);padding:10px 20px;font-size:15px;font-weight:800;transition:opacity .22s,transform .3s cubic-bezier(.2,1.4,.4,1);position:absolute;transform:translate(-50%,-10px)}.toast.is-active{opacity:1;transform:translate(-50%)}.swatch{color:var(--ink);border-radius:5px;padding:0 6px}.swatch[data-color=red]{background:#ff6b7a}.swatch[data-color=green]{background:#6ff09a}.swatch[data-color=blue]{background:#7aa6ff}.swatch[data-color=yellow]{background:#ffe066}.swatch[data-color=cyan]{background:#7ff4ff}.swatch[data-color=magenta]{background:#ff8cf0}.swatch[data-color=white]{background:#fff7e8}.banner{text-align:center;opacity:0;pointer-events:none;flex-direction:column;align-items:center;gap:6px;width:min(90vw,760px);display:flex;position:absolute;top:30%;left:50%;transform:translate(-50%,-50%)}.banner small{font:800 14px var(--display);letter-spacing:.34em;text-transform:uppercase;color:var(--gold);text-shadow:0 2px 0 var(--ink)}.banner b{color:var(--cream);text-shadow:6px 7px #0c0a20cc;font-size:clamp(36px,6vw,68px);font-weight:800;line-height:1.05}.banner p{max-width:40ch;text-shadow:0 2px 0 var(--ink), 0 0 12px #141032f2;margin:6px 0 0;font-size:clamp(15px,1.6vw,19px);font-weight:700;line-height:1.45}.banner.is-active{animation:4.2s cubic-bezier(.2,1,.3,1) both banner}.banner.is-big{top:36%}.banner.is-big b{color:#fff3c4;text-shadow:.05em .06em #0c0a20d9,0 0 40px #ffdc78cc;font-size:clamp(48px,9vw,110px)}.banner.is-big.is-active{animation:2.4s cubic-bezier(.2,1.4,.3,1) both bannerBig}.hud-hint{--n:12px;left:50%;bottom:calc(100px + var(--safe-b));border:3px solid var(--gold);opacity:0;background:linear-gradient(#ffffff14,#0000 50%),#1b1838f0;align-items:center;gap:14px;width:max-content;max-width:min(620px,100vw - 40px);padding:14px 22px 14px 16px;transition:opacity .25s,transform .35s cubic-bezier(.2,1.4,.4,1);display:flex;position:absolute;transform:translate(-50%,16px)}.hud-hint.is-active{opacity:1;transform:translate(-50%)}.hud-hint p{margin:0;font-size:16px;font-weight:800;line-height:1.5}.hud-hint p kbd{vertical-align:-.3em;margin:0 2px}.hint-gem{background:var(--gold);border-radius:50%;flex:none;place-items:center;width:42px;height:42px;animation:1.6s ease-in-out infinite pulse;display:grid}.hint-gem svg{fill:none;width:24px;stroke:var(--ink);stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round}.wipe{clip-path:circle(0%);pointer-events:none;z-index:20;background:radial-gradient(circle,#2b2460,#120f2a);position:absolute;inset:0}.wipe.is-in{pointer-events:auto;animation:.38s cubic-bezier(.6,0,.9,.5) both irisIn}.wipe.is-out{animation:.6s cubic-bezier(.2,.7,.3,1) both irisOut}.fatal{font:800 18px var(--display);text-align:center;place-items:center;padding:24px;display:grid;position:absolute;inset:0}@keyframes rise{0%{opacity:0;transform:translateY(26px)}}@keyframes pop{0%{opacity:0;transform:scale(.85)translateY(20px)}}@keyframes bob{50%{transform:translateY(-6px)}}@keyframes pulse{50%{transform:scale(1.12)}}@keyframes pulseX{50%{transform:translate(-50%)scale(1.12)}}@keyframes press{40%{transform:scale(.88)}}@keyframes shake{20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}@keyframes glow{50%{box-shadow:0 0 18px #ffd35cb3}}@keyframes starpop{0%{opacity:0;transform:scale(.2)rotate(-40deg)}70%{transform:scale(1.25)rotate(8deg)}to{opacity:1;transform:none}}@keyframes banner{0%{opacity:0;transform:translate(-50%,-40%)scale(.92)}12%{opacity:1;transform:translate(-50%,-50%)scale(1)}82%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-58%)}}@keyframes bannerBig{0%{opacity:0;transform:translate(-50%,-50%)scale(.4)}25%{opacity:1;transform:translate(-50%,-50%)scale(1.08)}40%{transform:translate(-50%,-50%)scale(1)}85%{opacity:1}to{opacity:0;transform:translate(-50%,-50%)scale(1.04)}}@keyframes irisIn{0%{clip-path:circle(0%)}to{clip-path:circle(75%)}}@keyframes irisOut{0%{clip-path:circle(75%)}to{clip-path:circle(0%)}}@media (max-width:1100px){.level-grid{grid-template-columns:repeat(5,minmax(150px,1fr));padding:4px 4px 14px;overflow-x:auto}.level-card{min-height:270px}}@media (max-width:760px){.title-block{text-align:center;align-items:center;width:calc(100vw - 32px);left:50%;transform:translate(-50%,-50%)}.title-vignette{background:radial-gradient(#141032a6,#0000 70%)}.menu{align-items:stretch}.pause-body{grid-template-columns:1fr}.hud-level{min-width:0}.hud-context{display:none}}@media (max-height:520px){:root{--notch:10px}.logo-text{font-size:clamp(38px,11vh,64px)}.logo-prism{width:70px}.tagline{max-width:40ch;margin:4px 0 12px;font-size:13px}.menu{gap:8px}.btn{min-width:220px;padding:9px 24px;font-size:16px}.btn-small{padding:8px 18px;font-size:14px}.title-stars{margin-top:10px;padding:5px 12px;font-size:14px}.bottom-bar{bottom:calc(8px + var(--safe-b))}.levels-wrap,.level-grid{gap:10px}.level-card{min-height:0}.level-art{height:84px}.level-art .isle{transform:translate(-50%,-50%)scale(.7)}.level-num{font-size:30px;top:6px}.level-lock{width:44px;height:44px;top:16px}.level-body{gap:3px;padding:8px 10px 10px}.level-body b{font-size:15px}.level-stars i svg{width:16px}.modal{gap:10px;max-height:calc(100vh - 16px);padding:20px 22px 18px}.modal-title{font-size:28px}.modal-results{gap:8px}.ribbon{padding:6px 30px 8px}.ribbon b{font-size:24px}.results-stars i svg{width:40px}.results-stars i:nth-child(2) svg{width:50px}.results-stats b,.final-stats b{font-size:22px}.results-stats>div,.final-stats>div{padding:5px}.results-breakdown{display:none}.results-total{padding:6px 12px}.results-total b{font-size:24px}.settings-grid{gap:10px 14px}.row{min-height:40px;font-size:14px}.hud-top{top:calc(8px + var(--safe-t))}.hud-level{padding:6px 14px 8px 12px}.hud-level b{font-size:16px}.hud-crystals{padding:5px 10px}.hud-crystals i{width:24px;height:24px}.hud-crystals svg{width:20px}.hud-stats{gap:12px;padding:5px 12px 6px}.hud-stats b{font-size:18px}.hud-btn{border-radius:14px;width:50px;height:50px}.hud-pause{width:46px;height:46px}.hud-bottom{bottom:calc(10px + var(--safe-b))}.touch-pad .hud-btn{width:64px;height:64px}.toast{top:calc(56px + var(--safe-t));padding:7px 14px;font-size:13px}.hud-hint{bottom:calc(80px + var(--safe-b));padding:9px 16px 9px 12px}.hud-hint p{font-size:13px}.hint-gem{width:32px;height:32px}.banner b{font-size:clamp(28px,9vh,48px)}.banner p{font-size:13px}}#ui.is-touch .hud-key{display:none}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
