:root{--shell:#e3e3e3;--shell-edge:#c6c6c6;--lcd:#c6c6c6;--bezel:#141414;--ink:#141414;--ink-soft:#6a6a6a;--ui:system-ui, -apple-system, "Segoe UI", roboto, sans-serif;--field-left:0px;--field-top:0px;--field-width:0px;--field-height:0px}*,:before,:after{box-sizing:border-box}html,body{height:100%}body{font-family:var(--ui);color:var(--ink);background:var(--shell);overscroll-behavior:none;touch-action:none;margin:0;overflow:hidden}main{width:100%;height:100dvh;display:block;position:relative}canvas{width:100%;height:100%;image-rendering:pixelated;touch-action:none;display:block}.offscreen{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.nameplate{z-index:1;white-space:nowrap;letter-spacing:.18em;color:var(--ink-soft);text-transform:uppercase;pointer-events:none;margin:0;font-size:.66rem;font-weight:700;position:absolute;top:1rem;left:50%;transform:translate(-50%)}.controls{z-index:2;align-items:center;gap:.25rem;height:44px;padding-right:.5rem;display:flex;position:absolute;top:0;right:0}.control{width:36px;height:36px;color:var(--ink);cursor:pointer;background:var(--shell-edge);border:1px solid var(--bezel);border-radius:0;place-content:center;padding:0;transition:color .16s,background-color .16s,border-color .16s,transform .16s;display:grid}.control svg{fill:currentColor;width:18px;height:18px;display:block}.control:hover,.control:focus-visible{color:var(--lcd);background:var(--ink);border-color:var(--ink);transform:none}.control:disabled{color:#a3a99a;cursor:default;background:var(--shell);border-color:var(--shell-edge);transform:none}.control .play-head,.controls[data-paused=true] .bar-left,.controls[data-paused=true] .bar-right{display:none}.controls[data-paused=true] .play-head{display:block}.controls[data-paused=true] .control[data-action=pause]{color:var(--lcd);background:var(--ink);border-color:var(--ink)}.outcome{opacity:0;pointer-events:none;place-content:center;justify-items:center;gap:1.25rem;transition:opacity .12s steps(2,end);display:grid;position:absolute;inset:0}.outcome[data-shown=true]{opacity:1}.outcome-word{letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:clamp(1.5rem,6vw,2.25rem);font-weight:700}.replay{color:var(--ink);font-size:1.6rem;line-height:1;animation:1.2s step-end infinite replay-pulse}@keyframes replay-pulse{0%,49%{opacity:1}50%,to{opacity:.15}}@media (prefers-reduced-motion:reduce){.outcome{transition:none}.replay{opacity:.85;animation:none}}.panel{top:var(--field-top);pointer-events:none;width:150px;margin:0;font-size:.75rem;position:absolute}.panel p{margin:0 0 1.15rem}.panel span{letter-spacing:.18em;color:var(--ink-soft);text-transform:uppercase;font-size:.62rem;font-weight:700;display:block}.panel b{font-variant-numeric:tabular-nums;color:var(--ink);margin-top:.15rem;font-size:1.4rem;font-weight:700;line-height:1.1;display:block}.panel-left{left:calc(var(--field-left) - 150px - 52px);text-align:right}.panel-right{left:calc(var(--field-left) + var(--field-width) + 52px)}.meter{background:var(--shell-edge);border:1px solid var(--bezel);width:100%;height:9px;margin-top:.4rem;display:block}.meter-fill{background:#1f7a2e;width:0%;height:100%;transition:width .2s linear;display:block}.meter-fill[data-soon=true]{background:#c62d1f}.panels{display:contents}:root[data-panels=false] .panels{pointer-events:none;align-items:stretch;height:68px;padding:0 .4rem;display:flex;position:absolute;top:36px;left:0;right:0}:root[data-panels=false] .panel{flex:1;align-items:center;width:auto;display:flex;position:static}:root[data-panels=false] .panel p{text-align:center;margin:0}:root[data-panels=false] .panel p[data-compact]{border-left:1px solid #c3c3c3;flex:1}:root[data-panels=false] .panel-left p:first-of-type{border-left:0}:root[data-panels=false] .panel p:not([data-compact]){display:none}:root[data-panels=false] .panel span{letter-spacing:.08em;font-size:.66rem}:root[data-panels=false] .panel b{margin-top:.1rem;font-size:1.45rem}:root[data-panels=false] .panel p[data-short] span{display:none}:root[data-panels=false] .panel p[data-short]:before{letter-spacing:.08em;color:var(--ink-soft);text-transform:uppercase;content:attr(data-short);font-size:.66rem;font-weight:700;display:block}@media (prefers-reduced-motion:reduce){.meter-fill{transition:none}}.hearts{gap:4px;margin-top:.35rem;display:flex}.heart{fill:#c62d1f;shape-rendering:crispedges;width:18px;height:14px}.heart[data-spent=true]{fill:#b4b4b4}.banner{top:var(--field-top);left:var(--field-left);z-index:1;width:var(--field-width);height:var(--field-height);letter-spacing:.2em;color:var(--ink);text-align:center;text-indent:.2em;text-transform:uppercase;opacity:0;pointer-events:none;background:#c6c6c6e0;place-content:center;margin:0;font-size:clamp(1.6rem,5vw,2.4rem);font-weight:700;transition:opacity .14s;display:grid;position:absolute}.banner[data-shown=true]{opacity:1}@media (prefers-reduced-motion:reduce){.banner{transition:none}}