:root{--ws-bg:#f6eee2;--ws-surface-1:#fcf7ef;--ws-surface-2:#f1e6d6;--ws-surface-3:#e8dac6;--ws-ink:#3a2f28;--ws-ink-2:#75665a;--ws-muted:#a39383;--ws-line:#eadfcf;--ws-line-strong:#c9b39b;--ws-alpha-1:#5a3a220d;--ws-alpha-2:#5a3a2214;--ws-alpha-3:#5a3a2229;--clay:#d97757;--clay-deep:#c6613f;--terracotta:#a9502f;--clay-soft:#d9775724;--cell-bg:#fdf9f2;--cell-on:#5b4334;--coral:#e98a74;--coral-soft:#e98a742e;--ws-font-content:"ZCOOL KuaiLe", "Nunito", "Noto Sans SC", "PingFang SC", sans-serif;--ws-font-ui:"Nunito", "Noto Sans SC", "PingFang SC", -apple-system, "Hiragino Sans GB", sans-serif;--ws-radius-chip:6px;--ws-radius-btn:8px;--ws-radius-card:12px;--ws-radius-glass:14px;--ws-shadow-card:0 1px 2px #5c3a1e0d, 0 8px 24px -8px #5c3a1e1f;--ws-shadow-pop:0 2px 6px #5c3a1e12, 0 16px 40px -12px #5c3a1e33;--ws-glass-bg:#faf3e9bd;--ws-glass-blur:blur(14px) saturate(1.3);--ws-dur-1:.12s;--ws-dur-2:.16s;--ws-dur-3:.24s;--ws-ease-out:cubic-bezier(.165, .84, .44, 1);--ws-ease-swift:cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--ws-bg);color:var(--ws-ink);font:500 14px/1.5 var(--ws-font-ui);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;background-image:radial-gradient(120% 60% at 50% -10%,#fbe9d8 0%,#0000 60%);background-attachment:fixed}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible{outline:2px solid var(--ws-alpha-3);outline-offset:2px}.glass{background:var(--ws-glass-bg);-webkit-backdrop-filter:var(--ws-glass-blur);backdrop-filter:var(--ws-glass-blur);box-shadow:inset 0 1px 0 #ffffffb3, var(--ws-shadow-pop)}.btn{letter-spacing:.02em;min-height:44px;transition:background var(--ws-dur-1) var(--ws-ease-out), transform var(--ws-dur-1) var(--ws-ease-out);border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:16px;font-weight:700;display:inline-flex}.btn:active{transform:scale(.98)}.btn.primary{background:var(--ws-ink);color:var(--ws-bg)}.btn.primary:active{background:#2a211c}.btn.secondary{background:var(--ws-surface-1);border:1px solid var(--ws-line);box-shadow:var(--ws-shadow-card)}.btn.ghost{color:var(--ws-ink-2);background:0 0}.btn.ghost:active{background:var(--ws-alpha-1)}.btn.block{width:100%}.btn.small{min-height:36px;padding:0 12px;font-size:14px}.icon-btn{border-radius:var(--ws-radius-btn);background:0 0;border:0;flex:none;place-items:center;width:40px;height:40px;display:grid}.icon-btn:active{background:var(--ws-alpha-2)}.icon-btn.off,.float-btn.off{color:var(--ws-muted)}.float-btn{width:44px;height:44px;transition:transform var(--ws-dur-1) var(--ws-ease-out);border:0;border-radius:50%;flex:none;place-items:center;display:grid}.float-btn:active{transform:scale(.94)}.card{background:var(--ws-surface-1);border:1px solid var(--ws-line);border-radius:var(--ws-radius-card)}.home{max-width:520px;padding:max(16px, env(safe-area-inset-top)) 16px max(32px, env(safe-area-inset-bottom));flex-direction:column;gap:16px;margin:0 auto;display:flex;position:relative}.home-mute{z-index:2;top:max(16px, env(safe-area-inset-top));position:absolute;right:16px}.hero{text-align:center;flex-direction:column;align-items:center;padding:8px 0 4px;display:flex}.brand h1{font:400 48px/1.15 var(--ws-font-content);letter-spacing:.06em;color:var(--ws-ink);text-shadow:0 2px #d977572e;margin:0}.brand p{color:var(--ws-ink-2);font:17px/1.5 var(--ws-font-content);letter-spacing:.04em;margin:8px 0 0}.notice{border-radius:var(--ws-radius-card);background:var(--clay-soft);color:var(--terracotta);text-align:center;margin:0;padding:8px 12px;font-size:13px}.jelly{place-items:center;width:160px;height:132px;display:grid;position:relative}.jelly:before{content:"";background:radial-gradient(closest-side,#d9775729,#0000);border-radius:50%;position:absolute;inset:10px 18px 22px}.jelly-drift{animation:13s ease-in-out infinite jelly-drift}.jelly-bob{transform-origin:50% 40%;animation:4.6s cubic-bezier(.45,0,.55,1) infinite jelly-bob}.jelly-shadow{background:#7848281f;border-radius:50%;width:64px;height:8px;margin-left:-32px;animation:4.6s cubic-bezier(.45,0,.55,1) infinite jelly-shadow;position:absolute;bottom:8px;left:50%}.clawd.swim{filter:drop-shadow(0 6px 10px #a9502f2e);display:block;overflow:visible}.clawd.swim .claw-l{animation:4.6s ease-in-out infinite swim-claw-l}.clawd.swim .claw-r{animation:4.6s ease-in-out infinite swim-claw-r}.clawd.swim .leg{transform-box:fill-box;transform-origin:50% 0;animation:2.3s ease-in-out infinite tentacle}.clawd.swim .leg-1{animation-delay:-.4s}.clawd.swim .leg-2{animation-delay:-.8s}.clawd.swim .leg-3{animation-delay:-1.2s}@keyframes jelly-drift{0%,to{transform:translate(-14px)rotate(-3deg)}50%{transform:translate(14px)rotate(3deg)}}@keyframes jelly-bob{0%,to{transform:translateY(8px)scale(1.04,.96)}30%{transform:translateY(-6px)scale(.96,1.05)}60%{transform:translateY(-12px)scale(1)}}@keyframes jelly-shadow{0%,to{opacity:1;transform:scaleX(1)}60%{opacity:.55;transform:scaleX(.7)}}@keyframes swim-claw-l{0%,to{transform:rotate(6deg)}30%{transform:rotate(-12deg)}}@keyframes swim-claw-r{0%,to{transform:rotate(-6deg)}30%{transform:rotate(12deg)}}@keyframes tentacle{0%,to{transform:skew(14deg)scaleY(1.1)}50%{transform:skew(-14deg)scaleY(.9)}}.continue{text-align:left;box-shadow:var(--ws-shadow-card);border-color:#0000;align-items:center;gap:12px;padding:16px;display:flex}.continue:active{background:var(--ws-surface-2)}.continue-main{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.continue-label{color:var(--clay-deep);font-size:12px}.continue-name{font:18px/1.35 var(--ws-font-content);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.continue-bar{background:var(--ws-surface-2);border-radius:2px;height:4px;margin-top:6px;overflow:hidden}.continue-bar i{background:var(--clay);border-radius:2px;height:100%;display:block}.continue-meta{color:var(--ws-ink-2);font-variant-numeric:tabular-nums;flex-direction:column;align-items:flex-end;font-size:12px;display:flex}.continue-go{background:var(--clay-deep);border-radius:50%;flex:none;place-items:center;width:40px;height:40px;display:grid}.mini-hearts{color:var(--clay);letter-spacing:1px}.mini-hearts i{color:#d9cbb8;font-style:normal}.home-actions{grid-template-columns:1.4fr 1fr;gap:12px;display:grid}.home-actions .btn{min-height:52px}.presets-head{justify-content:space-between;align-items:baseline;margin:8px 2px 12px;display:flex}.presets-head h2{font:400 23px/1.3 var(--ws-font-content);margin:0}.presets-head span{color:var(--ws-ink-2);font-variant-numeric:tabular-nums;font-size:13px}.preset-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.preset{text-align:left;box-shadow:var(--ws-shadow-card);transition:transform var(--ws-dur-1) var(--ws-ease-out), background var(--ws-dur-1) linear;border-color:#0000;flex-direction:column;gap:10px;padding:10px 10px 12px;display:flex}.preset:active{background:var(--ws-surface-2);transform:scale(.98)}.thumb{aspect-ratio:1;background:var(--ws-surface-2);border-radius:8px;place-items:center;width:100%;display:grid;position:relative;overflow:hidden}.thumb svg{width:72%;height:72%;fill:var(--cell-on)}.thumb .thumb-grid{fill:none;stroke:var(--ws-line-strong);stroke-width:.06px;opacity:.6}.thumb b{font:400 40px/1 var(--ws-font-content);color:var(--clay);opacity:.85;position:absolute}.preset.done .thumb{background:#f8e9dc}.preset-meta{flex-direction:column;padding:0 2px;display:flex}.preset-no{color:var(--ws-muted);letter-spacing:.06em;font-variant-numeric:tabular-nums;font-size:11px}.preset-name{font:17px/1.35 var(--ws-font-content)}.preset.done .preset-no{color:var(--clay-deep)}.game{flex-direction:column;min-height:100dvh;display:flex}.hud-back,.hud-mute,.hearts{z-index:5;top:max(10px, env(safe-area-inset-top));position:fixed}.hud-back{left:max(10px, env(safe-area-inset-left))}.hud-mute{right:max(10px, env(safe-area-inset-right))}.hud-title{z-index:4;top:max(10px, env(safe-area-inset-top));pointer-events:none;flex-direction:column;justify-content:center;max-width:calc(50% - 116px);height:44px;line-height:1.25;display:flex;position:fixed;left:62px}.hud-title strong{color:var(--ws-ink-2);white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:400;overflow:hidden}.progress{color:var(--ws-muted);font-variant-numeric:tabular-nums;font-size:12px}.hearts{border-radius:20px;align-items:center;gap:4px;height:40px;margin-top:2px;padding:0 12px;display:flex;left:50%;transform:translate(-50%)}.heart{transition:opacity var(--ws-dur-3) var(--ws-ease-out);display:grid}.heart.lost svg{display:block}.heart.break{animation:heart-break .42s var(--ws-ease-out)}@keyframes heart-break{0%{transform:scale(1)}30%{transform:scale(1.25)rotate(-8deg)}60%{transform:scale(.9)rotate(6deg)}to{transform:scale(1)}}.stage{padding:max(60px, calc(env(safe-area-inset-top) + 56px)) 8px 84px;flex:1;place-items:center;display:grid}.board{--cell:32px;--rowclue:60px;--colclue:60px;--fs:14px;grid-template-columns:var(--rowclue) calc(var(--cell) * var(--n) + 3px);grid-template-rows:var(--colclue) calc(var(--cell) * var(--n) + 3px);font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;display:grid}.corner{border-radius:var(--ws-radius-chip)}.col-clues{grid-template-columns:repeat(var(--n), var(--cell));padding:0 1.5px;display:grid}.row-clues{grid-template-rows:repeat(var(--n), var(--cell));padding:1.5px 0;display:grid}.clue{color:var(--ws-ink);font:700 var(--fs)/1 var(--ws-font-ui);transition:color var(--ws-dur-2) var(--ws-ease-out), background var(--ws-dur-2) var(--ws-ease-out);display:flex}.clue.col{justify-content:flex-end;align-items:center;gap:calc(var(--fs) * .12);border-radius:6px 6px 0 0;flex-direction:column;padding-bottom:4px}.clue.row{justify-content:flex-end;align-items:center;gap:calc(var(--fs) * .42);padding-right:calc(var(--fs) * .3);border-radius:6px 0 0 6px}.clue.hot{background:var(--clay-soft)}.clue.done{color:var(--ws-muted);opacity:.8}.clue.done span{text-decoration:line-through;-webkit-text-decoration-color:var(--ws-alpha-3);text-decoration-color:var(--ws-alpha-3)}.clue.flash{animation:flash .52s var(--ws-ease-out)}.clue.flash span{animation:flash-num .52s var(--ws-ease-swift)}@keyframes flash{0%{color:var(--clay-deep);opacity:1;background:#d9775752}35%{color:var(--clay-deep);opacity:1;background:#d977573d}to{background:0 0}}@keyframes flash-num{0%{transform:scale(1)}30%{transform:scale(1.28)}60%{transform:scale(.96)}to{transform:scale(1)}}.cells{grid-template-columns:repeat(var(--n), var(--cell));grid-template-rows:repeat(var(--n), var(--cell));border:1.5px solid var(--ws-line-strong);background:var(--cell-bg);box-shadow:var(--ws-shadow-card);touch-action:none;border-radius:6px;display:grid;position:relative;overflow:hidden}.cell{border-right:1px solid var(--ws-line);border-bottom:1px solid var(--ws-line);position:relative}.cell.lc{border-right:0}.cell.lr{border-bottom:0}.cell.mr{border-right-color:var(--ws-line-strong)}.cell.mb{border-bottom-color:var(--ws-line-strong)}.cell:before{content:"";background:var(--cell-on);opacity:0;transition:transform var(--ws-dur-2) var(--ws-ease-swift), opacity var(--ws-dur-1) linear;border-radius:3px;position:absolute;inset:1.5px;transform:scale(0)}.cell.on:before{opacity:1;transform:scale(1)}.cell.hinted:before{background:var(--clay-deep)}.cell.x{background:var(--coral-soft)}.cell.x:after{content:"";background:linear-gradient(45deg, transparent calc(50% - 1px), var(--coral) calc(50% - 1px), var(--coral) calc(50% + 1px), transparent calc(50% + 1px)), linear-gradient(-45deg, transparent calc(50% - 1px), var(--coral) calc(50% - 1px), var(--coral) calc(50% + 1px), transparent calc(50% + 1px));position:absolute;inset:22%}.cell.settled:after{content:"";background:var(--ws-alpha-3);border-radius:50%;width:4px;height:4px;margin:-2px 0 0 -2px;position:absolute;top:50%;left:50%}.cell.ghost:before{opacity:1;background:var(--ws-alpha-3);transform:scale(1)}.cell.pop:before{animation:.3s linear pop}@keyframes pop{0%{opacity:1;background:#e58a68;animation-timing-function:cubic-bezier(.3,0,.5,1);transform:scale(1.18,.55)}35%{background:var(--clay);animation-timing-function:cubic-bezier(.3,0,.5,1);transform:scale(.9,1.14)}65%{background:#4c372a;transform:scale(1.07,.96)}to{background:var(--cell-on);transform:scale(1)}}.cell.hinted.pop:before{animation-name:pop-hint}@keyframes pop-hint{0%{opacity:1;background:#f0a283;transform:scale(1.18,.55)}35%{transform:scale(.9,1.14)}65%{transform:scale(1.07,.96)}to{background:var(--clay-deep);transform:scale(1)}}.cell.wrong{animation:wrong .38s var(--ws-ease-out)}.cell.wrong:after{animation:wrong-x .3s var(--ws-ease-swift) 80ms both}@keyframes wrong{0%{background:#e98a749e;transform:translate(0)}20%{transform:translate(-3px)}40%{transform:translate(3px)}60%{transform:translate(-2px)}80%{transform:translate(1px)}to{background:var(--coral-soft);transform:translate(0)}}@keyframes wrong-x{0%{opacity:0;transform:scale(.3)rotate(-45deg)}to{opacity:1;transform:none}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-3px)}40%{transform:translate(3px)}60%{transform:translate(-2px)}80%{transform:translate(1px)}}.cells.nudge{animation:nudge .26s var(--ws-ease-out)}@keyframes nudge{0%,to{box-shadow:0 0 #d9775700}40%{box-shadow:0 0 0 4px #d9775740}}.cell.ripple{animation:ripple .44s var(--ws-ease-out) var(--d,0s) backwards}@keyframes ripple{0%{background-color:var(--cell-bg)}30%{background-color:#f8dcc8}to{background-color:var(--cell-bg)}}.cell.x.ripple{animation-name:none}.cell.glint:before{animation:glint .42s var(--ws-ease-out) var(--d,0s) both}@keyframes glint{0%,to{background:var(--cell-on);transform:scale(1)}35%{background:var(--clay);transform:scale(.8)}65%{transform:scale(1.06)}}.cell.wave:before{animation:wave .52s var(--ws-ease-out) var(--d,0s) both}@keyframes wave{0%{background:var(--cell-on);transform:scale(1)}40%{background:var(--clay);transform:scale(.82)}to{background:var(--cell-on);transform:scale(1)}}.board.lost .cells{animation:shake .42s var(--ws-ease-out)}.board.hitstop .cell:before{animation-play-state:paused!important}.cells.sweep:after{content:"";z-index:3;pointer-events:none;animation:sweep .76s var(--ws-ease-out) both;background:linear-gradient(105deg,#0000 32%,#fff6e8d9 46%,#d9775752 54%,#0000 68%);position:absolute;inset:-10%}@keyframes sweep{0%{transform:translate(-100%)}to{transform:translate(100%)}}.confetti{z-index:9;pointer-events:none;width:0;height:0;position:fixed}.confetti i{opacity:0;width:6px;height:10px;animation:confetti 1.3s cubic-bezier(.2, .7, .4, 1) var(--d,0s) forwards;border-radius:2px;position:absolute;top:-5px;left:-3px}.confetti i.dot{border-radius:50%;width:7px;height:7px}@keyframes confetti{0%{opacity:1;transform:translate(0)scale(.4)rotate(0)}45%{opacity:1;transform:translate(var(--dx), var(--dy)) scale(1) rotate(calc(var(--rot) * .6))}to{opacity:0;transform:translate(calc(var(--dx) * 1.1), calc(var(--dy) + 90px)) scale(.9) rotate(var(--rot))}}.band,.cursor{pointer-events:none;opacity:0;transition:opacity var(--ws-dur-1) linear;position:absolute;top:0;left:0}.band-r{height:var(--cell);background:var(--ws-alpha-1);right:0}.band-c{width:var(--cell);background:var(--ws-alpha-1);bottom:0}.cursor{width:var(--cell);height:var(--cell);border:2px solid var(--clay);transition:opacity var(--ws-dur-1) linear, transform 60ms linear;border-radius:4px}.cells.tracking .band,.cells.tracking .cursor{opacity:1}.clawd-fab{z-index:6;right:max(16px, env(safe-area-inset-right));bottom:max(20px, env(safe-area-inset-bottom));width:60px;height:60px;transition:transform var(--ws-dur-1) var(--ws-ease-out), opacity var(--ws-dur-2) linear;border:0;border-radius:50%;place-items:center;display:grid;position:fixed}.clawd-fab:active{transform:scale(.94)}.clawd-fab:disabled{opacity:.5;filter:grayscale(.7)}.clawd-fab .clawd{margin-top:2px}.hint-count{background:var(--clay-deep);color:#fff8f0;font-variant-numeric:tabular-nums;border-radius:11px;min-width:22px;height:22px;padding:0 6px;font-size:12px;font-weight:800;line-height:22px;position:absolute;top:-2px;right:-2px}.clawd .claw-l,.clawd .claw-r{transform-box:fill-box}.clawd .claw-l{transform-origin:100% 100%}.clawd .claw-r{transform-origin:0 100%}.clawd-fab.pinch .claw-l{animation:pinch-l .36s var(--ws-ease-out) 2}.clawd-fab.pinch .claw-r{animation:pinch-r .36s var(--ws-ease-out) 2}@keyframes pinch-l{50%{transform:rotate(-14deg)}}@keyframes pinch-r{50%{transform:rotate(14deg)}}.toast{z-index:7;left:50%;bottom:max(96px, calc(env(safe-area-inset-bottom) + 84px));opacity:0;pointer-events:none;border-radius:var(--ws-radius-glass);white-space:nowrap;transition:opacity var(--ws-dur-2) linear, transform var(--ws-dur-3) var(--ws-ease-swift);padding:8px 16px;font-size:14px;position:fixed;transform:translate(-50%,8px)}.toast.show{opacity:1;transform:translate(-50%)}.result-wrap{z-index:10;padding:16px 16px max(24px, env(safe-area-inset-bottom));opacity:0;transition:opacity var(--ws-dur-3) linear;background:linear-gradient(#0000 40%,#5a3a2224);justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.result-wrap.show{opacity:1}.result{border-radius:var(--ws-radius-glass);text-align:center;width:100%;max-width:420px;transition:transform var(--ws-dur-3) var(--ws-ease-swift);padding:24px 16px 16px;transform:translateY(16px)}.result-wrap.show .result{transform:none}.result h2{font:400 26px/1.3 var(--ws-font-content);margin:4px 0}.result p{color:var(--ws-ink-2);margin:0 0 16px;font-size:14px}.result-icon{place-items:center;display:grid}.actions{flex-direction:column;gap:8px;display:flex}.coach{z-index:8;left:12px;right:88px;bottom:max(20px, env(safe-area-inset-bottom));border-radius:var(--ws-radius-glass);max-width:440px;padding:12px;position:fixed}.coach-text{margin:0 0 8px;font-size:14px;line-height:1.6}.coach-text b{color:var(--clay-deep);font-weight:800}.coach-row{align-items:center;gap:4px;display:flex}.coach-dots{flex:1;gap:4px;display:flex}.coach-dots i{background:var(--ws-alpha-3);border-radius:50%;width:6px;height:6px}.coach-dots i.on{background:var(--ws-ink)}.spot{z-index:1;transition:background-color var(--ws-dur-3) linear;border-radius:6px;position:relative;background-color:var(--clay-soft)!important}.cells.spot{outline:3px solid var(--clay);outline-offset:2px}.clawd-fab.spot{outline:3px solid var(--clay);outline-offset:3px;z-index:9;position:fixed}.hearts.spot{outline:2px solid var(--clay);outline-offset:2px;z-index:9;position:fixed}.game:has(.coach) .stage{padding-bottom:180px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important}.cell,.confetti i{--d:0s!important}.cells.sweep:after,.confetti{display:none!important}.jelly-drift,.jelly-bob,.jelly-shadow,.clawd.swim .claw-l,.clawd.swim .claw-r,.clawd.swim .leg{animation:none!important}}