:root{--bg:#f4f7fb;--fg:#141820;--mute:#667085;--line:#1418201a;--water:#3b82f6;--band-perfect:#16a34a;--band-close:#ca8a04;--band-okay:#ea580c;--band-far:#dc2626;--font-sans:Inter, system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--text-meta:.6875rem;--text-chrome:.8125rem;--text-body:.9375rem;--text-title:1.375rem;--text-figure:1.75rem;--text-display:clamp(2rem, 5vw, 2.75rem)}*{box-sizing:border-box}html,body{min-height:100dvh;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:var(--text-body);-webkit-font-smoothing:antialiased;overscroll-behavior:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;line-height:1.45}button,a{font:inherit}.scene{isolation:isolate;min-height:100dvh;padding:max(22px, env(safe-area-inset-top)) max(28px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(28px, env(safe-area-inset-left));background:radial-gradient(120% 80% at 78% 0,#fff6e4 0%,#f7f9fc 38%,#eef3f8 100%);flex-direction:column;display:flex;position:relative}.sun{z-index:0;pointer-events:none;background:radial-gradient(circle,#ffe2a08c,#ffe2a000 68%);width:48vw;height:48vw;position:absolute;top:-12vh;right:-6vw}.pool{z-index:0;pointer-events:none;background:radial-gradient(#50a0ff29,#0000 70%);width:min(420px,56vw);height:90px;position:absolute;bottom:12%;left:50%;transform:translate(-50%)}.topbar,.bottombar{z-index:2;justify-content:space-between;align-items:center;display:flex;position:relative}.word{color:inherit;letter-spacing:-.04em;background:0 0;border:0;padding:0;font-size:1.35rem;font-weight:600;line-height:1.2}.nav{gap:8px;display:flex}.icon{color:var(--mute);cursor:pointer;background:0 0;border:0;padding:6px 8px;font-size:1.125rem}.icon:hover{color:var(--fg)}.icon-sfx{justify-content:center;align-items:center;line-height:0;display:inline-flex}.icon-sfx svg{display:block}.icon-sfx .sfx-off,.icon-sfx[aria-pressed=true] .sfx-on{display:none}.icon-sfx[aria-pressed=true] .sfx-off{display:block}.play{z-index:2;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex;position:relative}.kicker{font-family:var(--font-mono);font-size:var(--text-meta);letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin:0 0 10px;font-weight:500;line-height:1.3}.prompt{font-size:var(--text-display);letter-spacing:-.045em;color:var(--fg);margin:0;font-weight:600;line-height:1.1}.prompt .fluid-name{color:var(--water)}.sub{color:var(--mute);font-size:var(--text-chrome);margin:10px 0 0;line-height:1.4}.rig{aspect-ratio:1;touch-action:manipulation;-webkit-user-select:none;user-select:none;width:min(340px,86vw);height:auto;margin:10px 0 4px;position:relative}.rig canvas,.rig svg{width:100%;height:100%;display:block;position:absolute;inset:0}.rig svg,#glass-bend{pointer-events:none}.bottombar{color:var(--mute);font-size:var(--text-chrome);grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;display:grid}.bottombar>#play-yesterday{grid-column:3;justify-self:end}.controls{grid-column:2;justify-self:center;align-items:center;gap:12px;display:flex}.submit{border:1.5px solid var(--fg);color:var(--fg);font-size:var(--text-body);cursor:pointer;background:0 0;border-radius:10px;padding:14px 20px;font-weight:600}.submit:disabled{color:#9aa3ad;opacity:.55;cursor:default;border-color:#d0d5dc}.cta{color:#fff;font-size:var(--text-body);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;background:#141820;border:0;border-radius:10px;padding:14px 22px;font-weight:600}.controls .cta{min-width:11rem}.cta:disabled{color:#5c6570;cursor:default;background:#c5cbd4}.ghost{color:var(--mute);font-size:var(--text-chrome);cursor:pointer;text-underline-offset:3px;background:0 0;border:0;padding:0;text-decoration:underline}.sheet{width:calc(100% - 32px);max-width:360px;color:var(--fg);background:#fff;border:0;border-radius:16px;padding:0;box-shadow:0 16px 50px #1418201f}.sheet::backdrop{background:#f4f7fbb8}:is(body:has(dialog[open]) .kicker,body:has(dialog[open]) .prompt,body:has(dialog[open]) .sub){opacity:0}.sheet-body{padding:24px 24px 22px}.sheet h2{font-size:var(--text-title);letter-spacing:-.03em;margin:0 0 16px;font-weight:600;line-height:1.2}.help-goal{color:#3c4450;font-size:var(--text-body);margin:-6px 0 14px;line-height:1.45}.sheet ol{color:#3c4450;font-size:var(--text-body);margin:0;padding-left:1.1em;line-height:1.55}.sheet p{color:#3c4450;font-size:var(--text-body);margin:0 0 10px;line-height:1.5}#result-detail{white-space:pre-line}#result-detail.is-day{white-space:normal;flex-direction:column;gap:2px;display:flex}#result-detail.is-day .day-line--perfect{color:var(--band-perfect)}#result-detail.is-day .day-line--close{color:var(--band-close)}#result-detail.is-day .day-line--okay{color:var(--band-okay)}#result-detail.is-day .day-line--far{color:var(--band-far)}#result-detail.is-day .day-line--avg{color:#3c4450}.sheet-actions{flex-direction:column;gap:10px;margin-top:22px;display:flex}.sheet-actions .cta{width:100%;font-size:var(--text-body);letter-spacing:-.01em;border-radius:10px;padding:12px 16px;font-weight:600}.sheet-meta{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 18px;min-height:1.2em;margin-top:14px;display:flex}.sheet-meta:empty{display:none}.sheet-meta .ghost,.sheet-meta .support{font-size:var(--text-chrome)}.delta{font-size:var(--text-figure);letter-spacing:-.04em;color:var(--fg);margin:0 0 6px;font-weight:600;line-height:1.15}.band{font-family:var(--font-mono);font-size:var(--text-meta);letter-spacing:.1em;text-transform:uppercase;color:var(--water);margin:0 0 14px;font-weight:500;line-height:1.3}#result[data-band=perfect] .delta,#result[data-band=perfect] .band{color:var(--band-perfect)}#result[data-band=close] .delta,#result[data-band=close] .band{color:var(--band-close)}#result[data-band=okay] .delta,#result[data-band=okay] .band{color:var(--band-okay)}#result[data-band=far] .delta,#result[data-band=far] .band{color:var(--band-far)}#result.is-perfect .sheet-body{box-shadow:inset 3px 0 0 var(--band-perfect)}#result.is-perfect .delta{animation:.45s ease-out perfect-pop}@keyframes perfect-pop{0%{text-shadow:0 0 #0000;transform:scale(1)}40%{text-shadow:0 0 18px #16a34a73;transform:scale(1.06)}to{text-shadow:0 0 #0000;transform:scale(1)}}@media (prefers-reduced-motion:reduce){#result.is-perfect .delta{animation:none}}.stats-row{border-top:1px solid var(--line);font-size:var(--text-body);justify-content:space-between;padding:8px 0;display:flex}.stats-row span:last-child{font-variant-numeric:tabular-nums}.support{color:var(--mute);font-size:var(--text-chrome)}@media (width<=480px){.scene{padding:max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left))}.prompt{font-size:clamp(1.6rem,7.2vw,2.25rem)}.sub{max-width:22rem;padding:0 4px}.rig{width:min(340px,92vw);margin:8px 0 2px}.icon{justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:10px;display:inline-flex}.submit,.cta{min-height:44px;padding:12px 16px}.bottombar{gap:10px 12px}.controls .cta{min-width:0}.sheet{width:calc(100% - 24px);max-height:calc(100dvh - 24px);overflow:auto}.sheet-body{padding:20px 18px 18px}}@media (height<=700px){.kicker{margin-bottom:6px}.sub{margin-top:6px}.rig{width:min(280px,78vw);margin:4px 0 0}}