:root{--ink: #14323c;--ink-soft: rgba(20, 50, 60, .62);--frost: rgba(250, 249, 245, .6);--frost-edge: rgba(255, 255, 255, .55);--emerald: #0f8f77;--emerald-deep: #0a6a59;--foam: #f7faf8;--hairline: rgba(20, 50, 60, .16)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;font-family:ui-monospace,SF Mono,SFMono-Regular,Menlo,monospace;color:var(--ink);background:#0e2830}#scene{position:fixed;inset:0;width:100%;height:100%;display:block}.fade{position:fixed;inset:0;background:#dfe7e6;pointer-events:none;transition:opacity 1.6s ease;z-index:30}.fade.out{opacity:0}.hud-top{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:22px 28px;pointer-events:none;z-index:10}.wordmark h1{font-family:Iowan Old Style,Palatino Nova,Palatino,Georgia,serif;font-weight:400;font-style:italic;font-size:clamp(30px,4vw,44px);letter-spacing:.04em;color:var(--foam);text-shadow:0 1px 14px rgba(10,35,45,.45);line-height:1}.tagline{margin-top:6px;font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:#f7faf8d1;text-shadow:0 1px 8px rgba(10,35,45,.5)}.hud-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}.tide{font-size:11px;letter-spacing:.22em;color:#f7faf8e6;text-shadow:0 1px 8px rgba(10,35,45,.55)}.sound{pointer-events:auto;background:none;border:1px solid rgba(247,250,248,.45);border-radius:6px;padding:3px 10px;font-family:inherit;font-size:9.5px;letter-spacing:.22em;color:#f7faf8e6;cursor:pointer;transition:opacity .2s ease}.sound.muted{opacity:.5}.hint{font-size:11.5px;letter-spacing:.06em;color:#f7faf8d9;text-shadow:0 1px 8px rgba(10,35,45,.55);max-width:300px;text-align:right;line-height:1.6;transition:opacity 1s ease}.hint.faded{opacity:0}.hint kbd{font-family:inherit;border:1px solid rgba(247,250,248,.5);border-radius:4px;padding:1px 6px;font-size:10px}.mischief{position:fixed;left:20px;bottom:20px;z-index:15;padding:14px 18px 12px;background:var(--frost);border:1px solid var(--frost-edge);border-radius:14px;backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);box-shadow:0 12px 32px #0a232d38;max-width:240px;user-select:none}.mischief h2{font-family:Iowan Old Style,Palatino Nova,Palatino,Georgia,serif;font-style:italic;font-weight:400;font-size:17px;letter-spacing:.06em;color:var(--ink);margin-bottom:8px}.mischief ul{list-style:none}.mischief li{font-size:11px;line-height:1.5;padding:3px 0;color:var(--ink);letter-spacing:.02em}.mischief li .tick{margin-right:7px;color:var(--emerald-deep)}.mischief li.done{text-decoration:line-through;color:var(--ink-soft)}.mischief.celebrate{animation:celebrate .6s ease}@keyframes celebrate{0%,to{transform:scale(1)}35%{transform:scale(1.06) rotate(-1.2deg)}70%{transform:scale(.99) rotate(.6deg)}}@media(max-width:900px){.mischief{display:none}}.console{position:fixed;left:50%;bottom:20px;transform:translate(-50%);display:flex;align-items:stretch;gap:20px;padding:16px 22px;background:var(--frost);border:1px solid var(--frost-edge);border-radius:20px;backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);box-shadow:0 18px 48px #0a232d47;z-index:20;user-select:none;-webkit-user-select:none}.energy{display:flex;flex-direction:column;align-items:center;gap:8px}.energy-tube{position:relative;width:26px;flex:1;min-height:108px;border-radius:13px;border:1px solid var(--hairline);background:#ffffff80;overflow:hidden}.energy-fill{position:absolute;left:0;right:0;bottom:0;height:60%;background:linear-gradient(180deg,#35b598 0%,var(--emerald) 40%,var(--emerald-deep) 100%);transition:height .25s ease}.energy-fill:before{content:"";position:absolute;top:-4px;left:-30%;width:160%;height:8px;background:#f7faf8d9;border-radius:50%;animation:slosh 3.2s ease-in-out infinite}@keyframes slosh{0%,to{transform:translate(-6%) rotate(-2.5deg)}50%{transform:translate(6%) rotate(2.5deg)}}.energy-cost{position:absolute;left:0;right:0;z-index:2;height:0;background:repeating-linear-gradient(-45deg,#f7faf8bf 0 4px,#f7faf826 4px 8px);transition:height .2s ease,bottom .2s ease}.energy-cost.unaffordable{background:repeating-linear-gradient(-45deg,#c44a3acc 0 4px,#c44a3a40 4px 8px)}.energy-label{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft)}.knobs{display:flex;gap:14px}.knob{display:flex;flex-direction:column;align-items:center;width:96px}.knob-dial{width:88px;height:88px;cursor:ns-resize;touch-action:none;border-radius:50%;outline-offset:3px}.knob-dial:focus-visible{outline:2px solid var(--emerald)}.knob-dial svg{width:100%;height:100%;display:block}.knob-arc{fill:none;stroke:var(--hairline);stroke-width:3;stroke-linecap:round}.knob-arc-fill{fill:none;stroke:var(--emerald);stroke-width:3;stroke-linecap:round}.knob-tick{stroke:#14323c59;stroke-width:1}.knob-face{fill:#ffffffbf;stroke:var(--hairline);stroke-width:1}.knob:hover .knob-face,.knob.dragging .knob-face{fill:#fffffff2}.knob-needle{stroke:var(--ink);stroke-width:2.4;stroke-linecap:round}.knob-hub{fill:var(--emerald)}.knob-readout{margin-top:4px;font-size:13px;font-weight:600;color:var(--ink)}.knob-unit{margin-left:3px;font-size:9.5px;color:var(--ink-soft)}.knob-label{margin-top:2px;font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft)}.send{position:relative;width:96px;border:none;border-radius:16px;background:linear-gradient(165deg,#17a488,var(--emerald-deep));color:var(--foam);font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;line-height:1.7;cursor:pointer;transition:transform .12s ease,filter .2s ease,opacity .2s ease;box-shadow:0 8px 20px #0f8f7759}.send:hover:not(:disabled){filter:brightness(1.07)}.send:active:not(:disabled){transform:scale(.96)}.send:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.send.denied{animation:deny .35s ease}@keyframes deny{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.send-ring{position:absolute;inset:0;border-radius:16px;pointer-events:none}.send.fired .send-ring{animation:fire .7s ease-out}@keyframes fire{0%{box-shadow:0 0 #f7faf8e6}to{box-shadow:0 0 0 26px #f7faf800}}@media(max-width:640px){.console{gap:12px;padding:12px 14px;bottom:12px;max-width:calc(100vw - 16px)}.knob{width:72px}.knob-dial{width:64px;height:64px}.send{width:72px;font-size:10.5px}.hint{display:none}}@media(prefers-reduced-motion:reduce){.energy-fill:before{animation:none}.fade{transition:none}}