:root{color-scheme:dark;--bg:#102424;--panel:#162f2e;--ink:#f4f0dc;--muted:#a5bbb2;--mint:#b4efca;--line:#ffffff19;--coral:#f5b49d}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% 0%,#264037 0,transparent 52%),var(--bg);color:var(--ink);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible,canvas:focus-visible{outline:2px solid var(--mint);outline-offset:5px}button{border:0;color:inherit;background:transparent}button:disabled{cursor:default}a{color:inherit;text-decoration:none}.shell{max-width:1168px;margin:auto;padding:0 44px}.topbar{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.back{font-size:13px}.back:hover{color:var(--mint)}.brand,.eyebrow,#touch-caption{font-size:10px;letter-spacing:2px;font-weight:650}.brand{color:var(--muted)}.quiet{color:var(--muted);font-size:12px;padding:7px 0}.quiet:hover{color:var(--ink)}.intro{display:flex;align-items:flex-end;justify-content:space-between;padding:43px 0 32px}.eyebrow{color:var(--mint);margin:0 0 15px;display:flex;align-items:center;gap:9px}.eyebrow>span{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--mint)}h1{font:400 clamp(40px,5vw,69px)/1.08 Georgia,serif;letter-spacing:-2.5px;margin:0}h1 em{color:var(--mint);font-weight:400}.intro-copy{font-size:13px;color:var(--muted);margin:0 0 6px;padding-right:5px;line-height:1.8}.game-card{border:1px solid #65857855;border-radius:18px;overflow:hidden;background:#132d2c;box-shadow:0 22px 70px #0002}.hud{height:68px;padding:0 25px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#1a3330}.level-heading{display:flex;align-items:center;gap:16px}.level-heading>span{font:11px ui-monospace,monospace;color:var(--mint);padding:6px 9px;border:1px solid #a3d0b530;border-radius:5px}.level-heading h2{font-weight:500;font-size:14px;letter-spacing:.1px;margin:0}.hud-right{display:flex;align-items:center;gap:20px;font:12px ui-monospace,monospace;color:var(--muted)}#star-count{color:#f4d392}#pause{width:30px;height:34px;border:1px solid var(--line);border-radius:7px}.stage{position:relative;aspect-ratio:16/9;background:#163532;isolation:isolate;overflow:hidden}canvas{display:block;width:100%;height:100%;outline-offset:-4px;touch-action:none}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0b272d7a;backdrop-filter:blur(5px);padding:16px;overflow:auto}.overlay[hidden]{display:none}.panel{text-align:center;max-width:540px;width:100%;margin:auto}.panel .eyebrow{justify-content:center;font-size:9px;margin-bottom:15px}.panel h2{font:400 clamp(28px,4vw,50px)/1.1 Georgia,serif;letter-spacing:-1px;margin:0 0 16px}.panel h2 em{font-weight:400;color:var(--mint)}.panel p{color:#c8d9cc;font-size:13px;line-height:1.7;margin:0 0 23px}.primary{border-radius:8px;background:var(--mint);color:#13372d;font-size:13px;font-weight:650;padding:13px 24px;box-shadow:0 3px 0 #77b692;min-height:46px}.primary:hover{background:#cbffdb}.primary span{margin-left:20px}.text-button{display:block;margin:17px auto 0;font-size:12px;color:#c8d9cc;text-decoration:underline;text-underline-offset:4px}.panel .reward-icon{display:flex;width:59px;height:59px;background:#c1f7cf14;border:1px solid #b4efca70;border-radius:16px;align-items:center;justify-content:center;color:var(--mint);font-size:29px;margin:0 auto 16px}.panel .reward-key{font:11px ui-monospace,monospace;color:#f7d8ab;margin-top:-10px;margin-bottom:23px}.panel .result-line{font:11px ui-monospace,monospace;color:var(--muted);margin-bottom:18px}.game-footer{min-height:53px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 25px;border-top:1px solid #ffffff09}#hint{font-size:12px;color:#b8cebe;margin:0;max-width:90%}.touch-controls{padding:0 24px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.touch-controls .directions,.touch-controls .actions{display:flex;gap:8px}.touch-controls button{border:1px solid #94b9a638;background:#274238;border-radius:10px;min-width:54px;height:48px;color:var(--ink);touch-action:none;user-select:none;-webkit-user-select:none;font-size:20px;transition:background .12s}.touch-controls button.pressed{background:#46654e;border-color:var(--mint)}.touch-controls .actions button{font-size:12px;padding:0 14px;min-width:82px}.touch-controls small{color:#b3cab5;margin-left:8px}.touch-controls button:disabled{opacity:.25}#touch-caption{color:#769386;font-size:8px;letter-spacing:1.6px}.below{display:flex;justify-content:space-between;gap:30px;margin:27px 0 23px}.below .eyebrow{font-size:9px;color:#b3c7ba;margin-bottom:12px}.toolkit{display:flex;flex-wrap:wrap;gap:6px}.tool{padding:6px 10px;border:1px solid #7fa88e30;border-radius:20px;font-size:10px;color:#86a391;display:flex;align-items:center;gap:5px}.tool.earned{border-color:#b4efca50;color:var(--mint);background:#b4efca09}.tool.locked{letter-spacing:2px;padding-left:14px;padding-right:14px}.bottom-actions{display:flex;flex-wrap:wrap;align-content:start;gap:0 20px;justify-content:flex-end;min-width:170px}.bottom-actions>span{color:#759687;font-size:10px;flex-basis:100%;text-align:right;margin-top:10px}.how{border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--muted);font-size:12px}.how summary{padding:15px 0;list-style:none;cursor:pointer}.how summary span{float:right}.how>div{max-width:800px;padding:0 0 16px}.how p{line-height:1.8}.endnote{font-size:10px;color:#7a9889;margin:23px 0 34px}.endnote span{padding:0 8px}.toast{position:absolute;left:50%;bottom:23px;transform:translateX(-50%);background:#fff0cc;color:#304b37;border-radius:30px;font-size:12px;padding:8px 17px;opacity:0;pointer-events:none;white-space:nowrap;transition:opacity .2s}.toast.show{opacity:1}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:19px 0}.level-grid button{border:1px solid #a3d0b543;background:#183d36;padding:12px 8px;border-radius:8px;font-size:11px;min-height:66px}.level-grid button strong{display:block;font:24px Georgia,serif;color:var(--mint);margin-bottom:3px}.level-grid button:disabled{opacity:.35}.level-grid button:hover:not(:disabled){background:#315747}.panel.compact h2{font-size:34px}.panel.compact p{margin-bottom:10px}.panel .secondary{border:1px solid #aac8b660;border-radius:8px;padding:11px 18px;font-size:12px;margin-left:9px}.panel .danger{background:#f5b49d;color:#492d26}
@media(max-width:700px){.shell{padding:0 18px}.topbar{height:70px}.brand{font-size:8px;letter-spacing:1.2px}.intro{padding:28px 0 23px}.intro .eyebrow{font-size:8px;letter-spacing:1.5px;margin-bottom:12px}.intro-copy{display:none}h1{font-size:43px;letter-spacing:-1.5px}.hud{height:57px;padding:0 14px}.level-heading{gap:8px}.level-heading h2{font-size:11px}.level-heading>span{font-size:9px;padding:5px 6px}.hud-right{gap:10px;font-size:10px}.stage{aspect-ratio:4/3}.game-footer{padding:10px 14px;gap:10px}#hint{font-size:11px}.touch-controls{padding:0 13px 14px;gap:8px}#touch-caption{display:none}.touch-controls button{min-width:51px;height:51px}.touch-controls .actions button{min-width:70px;padding:0 9px}.touch-controls small{display:none}.below{display:block;margin:23px 0}.bottom-actions{margin-top:16px;justify-content:flex-start;gap:0 22px}.bottom-actions>span{text-align:left;flex-basis:auto}.tool{font-size:9px}.panel h2{font-size:32px;margin-bottom:12px}.panel p{font-size:11px;margin-bottom:16px}.panel .eyebrow{font-size:8px;margin-bottom:10px}.panel .reward-icon{width:42px;height:42px;margin-bottom:11px;font-size:23px;border-radius:12px}.panel .reward-key{font-size:10px;margin-bottom:14px}.panel .result-line{font-size:10px;margin-bottom:12px}.primary{padding:10px 18px;min-height:42px;font-size:12px}.text-button{font-size:11px;margin-top:11px}.level-grid{gap:6px;margin:12px 0}.level-grid button{padding:7px 4px;min-height:49px;font-size:8px}.level-grid button strong{font-size:18px;margin-bottom:0}.panel.compact h2{font-size:26px}.endnote{font-size:9px}.panel .secondary{margin-left:4px;font-size:11px;padding:10px}.overlay{padding:12px}.how{font-size:11px}}
@media(max-height:600px) and (orientation:landscape){.topbar{height:46px}.intro{padding:13px 0}.intro h1{font-size:34px}.intro .eyebrow{display:none}.shell{max-width:900px}.stage{aspect-ratio:20/9;max-height:63vh}.hud{height:45px}.game-footer{min-height:40px}.touch-controls{padding-bottom:10px}.touch-controls button{height:44px}.panel h2{font-size:26px}.panel p{margin-bottom:12px}.panel .eyebrow{margin-bottom:7px}.panel .reward-icon{display:none}.below{margin:18px 0}.overlay{backdrop-filter:blur(3px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.game-card{scroll-margin-top:16px}.stage{max-height:calc(100svh - 230px);min-height:220px}
/* Keep canvas backing-store resizes out of layout, including orientation changes. */
.stage canvas{position:absolute;inset:0}
.stage{width:100%}