:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--text:#e8eaed;--muted:#979ca4;--accent:#8ad8ec;--surface:#0d0e12b8;--control:#0d0e12d1;--line:#ffffff1c;--line-strong:#ffffff4d;--radius:5px;--edge:12px;color:var(--text);background:#020306;font:13px/1.4 system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}p{margin:0}h1{margin:0;font-size:15px;font-weight:600}small{color:var(--muted);font-size:11px}summary{cursor:pointer;color:var(--muted);font-size:12px}summary:hover{color:var(--text)}kbd{color:var(--muted);margin-inline-start:3px;font:10px/1 ui-monospace,monospace}#view{touch-action:none;block-size:100dvh;inline-size:100%;display:block;position:fixed;inset:0}:where(#demo-controls,.plan-editor) :is(button,select),#toggle-overlays{border:1px solid var(--line);border-radius:var(--radius);min-block-size:30px;font:inherit;color:var(--text);background:var(--control);cursor:pointer;padding:4px 10px}:where(#demo-controls,.plan-editor) :is(button,select):hover:not(:disabled),#toggle-overlays:hover{border-color:var(--line-strong)}:is(a,button,select,input,summary):focus-visible{outline:2px solid var(--accent);outline-offset:2px}:where(#demo-controls,.plan-editor) button[aria-pressed=true]{border-color:var(--line-strong);color:#fff;background:#ffffff29}:where(#demo-controls,.plan-editor) button[aria-pressed=true] kbd{color:#c8ccd2}.plan-editor button:disabled{opacity:.4;cursor:default}.plan-editor .primary{color:#111;background:#e8eaed;border-color:#0000;font-weight:600}.plan-editor .primary:hover{background:#fff}.segmented,.plan-modes{display:flex}:is(.segmented,.plan-modes) button{border-radius:0}:is(.segmented,.plan-modes) button:first-child{border-start-start-radius:var(--radius);border-end-start-radius:var(--radius)}:is(.segmented,.plan-modes) button:last-child{border-start-end-radius:var(--radius);border-end-end-radius:var(--radius)}:is(.segmented,.plan-modes) button+button{margin-inline-start:-1px}#hud{z-index:3;inset-block-start:max(var(--edge), env(safe-area-inset-top));inset-inline:max(var(--edge), env(safe-area-inset-left)) max(var(--edge), env(safe-area-inset-right));pointer-events:none;grid-template-columns:minmax(0,360px) minmax(0,1fr);align-items:start;gap:8px 16px;display:grid;position:fixed}#info{flex-direction:column;grid-area:1/1;gap:8px;min-inline-size:0;display:flex}#telemetry,#history-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:9px 11px}#telemetry{pointer-events:auto}#telemetry>summary{color:inherit}#telemetry h1{vertical-align:top;max-inline-size:calc(100% - 16px);display:inline-block}#status{font-size:13px;font-weight:400;display:block}.telemetry-details{gap:3px;margin-block-start:3px;display:grid}#status,#perf,#replay-status{font-variant-numeric:tabular-nums}#perf{color:var(--muted);font-size:11px}#replay-status{white-space:pre-line;margin-block-start:3px;font-size:12px}#replay-status:empty,#perf:empty{display:none}#notes{margin-block-start:2px}#notes p{color:var(--muted);margin-block-start:4px;font-size:12px}:is(#notes summary,#history-panel){pointer-events:auto}#history{block-size:72px;inline-size:100%;margin-block:5px 3px;display:block}.swatch{vertical-align:middle;block-size:2px;inline-size:10px;margin-inline-end:4px;display:inline-block}.swatch.best{background:#ffb126}.swatch.mean{background:#999;margin-inline-start:6px}#side{flex-direction:column;grid-area:1/2;align-items:flex-end;gap:8px;min-inline-size:0;display:flex}#demo-controls{flex-wrap:wrap;justify-content:flex-end;gap:6px 10px;display:flex}.mode-bar{align-items:center;gap:6px;display:flex}#demo-controls .group{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}#demo-controls :is(button,select){pointer-events:auto}#demo-controls[inert]{opacity:.5}#controls{overscroll-behavior:contain;pointer-events:auto;border-radius:var(--radius);max-block-size:calc(100dvh - 120px);inline-size:290px;max-inline-size:100%;overflow:auto}#controls .lil-gui{--width:100%;--font-family:system-ui, sans-serif;--font-size:12px;--input-font-size:12px;--background-color:#0d0e12db;--title-background-color:#ffffff0f;--widget-color:#ffffff17;--hover-color:#ffffff24;--focus-color:#fff3;--number-color:var(--accent);--string-color:#c8ccd2}#toggle-overlays{z-index:4;position:fixed;inset-block-end:max(var(--edge), env(safe-area-inset-bottom));inset-inline-end:max(var(--edge), env(safe-area-inset-right))}#credits{z-index:3;text-shadow:0 1px 10px #000;opacity:.8;justify-items:start;font-size:11px;display:grid;position:fixed;inset-block-end:max(var(--edge), env(safe-area-inset-bottom));inset-inline-start:max(var(--edge), env(safe-area-inset-left))}#credits a{min-block-size:24px;color:var(--muted);align-items:center;gap:4px;text-decoration:none;display:flex}#credits img{display:block}#credits:is(:hover,:focus-within){opacity:1}#credits a:hover{color:var(--text);text-underline-offset:3px;text-decoration:underline}.overlays-hidden #toggle-overlays{opacity:.55}body.overlays-hidden :is(#hud,#demo-readout,#credits,.plan-editor),.showcase :is(#history-panel,#notes,#perf){display:none}.showcase #telemetry{text-shadow:0 1px 12px #000;background:0 0;border-color:#0000;padding:16px 18px}.showcase h1{font-size:22px;font-weight:400}.showcase :is(#status,#replay-status){color:var(--muted);font-size:12px}#demo-readout{z-index:1;text-align:center;font-variant-numeric:tabular-nums;text-shadow:0 1px 10px #000;pointer-events:none;display:none;position:fixed;inset-block-end:max(28px, env(safe-area-inset-bottom));inset-inline-start:50%;translate:-50%}.showcase #demo-readout{display:block}#demo-readout dl{gap:clamp(22px,5vw,80px);margin:10px 0 0;display:flex}#demo-readout dt{color:#b4b4b4;white-space:nowrap;font-size:12px}#demo-readout dd{margin:2px 0 0;font-size:clamp(22px,3.4vw,40px);font-weight:300}#demo-phase{color:#ccc;font-size:14px}.plan-editor{z-index:2;pointer-events:none;position:fixed;inset:0;overflow:hidden}.plan-dock{display:contents}.plan-editor :is(button,select,input){font:inherit;color:var(--text);accent-color:var(--accent)}.plan-bar{flex-direction:column;align-items:center;gap:6px;inline-size:max-content;max-inline-size:calc(100% - 240px);display:flex;position:absolute;inset-block-end:max(var(--edge), env(safe-area-inset-bottom));inset-inline-start:50%;translate:-50%}.plan-note{background:var(--control);border-radius:var(--radius);text-align:center;padding:3px 8px;font-size:12px}.plan-note:empty{display:none}.plan-tools{pointer-events:auto;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;display:flex}.plan-preview{align-items:center;gap:6px;margin-inline-end:8px;display:flex}.plan-scrub{color:var(--muted);align-items:center;gap:6px;font-size:12px;display:flex}.plan-scrub input{inline-size:120px;margin:0}.plan-scrub output{min-inline-size:4ch;color:var(--text);font-variant-numeric:tabular-nums}.plan-target,.plan-properties{pointer-events:auto;position:absolute;inset:0 auto auto 0;transform:translate(-50%,-50%)}.plan-editor .plan-target{font-variant-numeric:tabular-nums;touch-action:none;-webkit-user-select:none;user-select:none;min-block-size:26px;padding:2px 8px;box-shadow:0 2px 10px #0008}.plan-editor .plan-target[aria-pressed=true]{border-color:var(--accent);background:var(--control);color:var(--accent)}.plan-editor .dragging{cursor:grabbing;border-color:#fff}.plan-properties{background:var(--control);border:1px solid var(--accent);border-radius:var(--radius);max-inline-size:calc(100dvw - 24px);color:var(--muted);flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 10px;padding:4px 6px 4px 10px;font-size:12px;display:flex}.plan-properties label{white-space:nowrap;align-items:center;gap:4px;display:inline-flex}.plan-selection{white-space:nowrap;color:var(--accent);font-weight:600}.plan-turns{color:var(--text);flex-wrap:wrap;align-items:center;gap:8px;display:flex}.plan-check{cursor:pointer}.plan-check input{margin:0}.plan-properties input[type=number]{border:0;border-block-end:1px solid var(--line-strong);font-variant-numeric:tabular-nums;background:0 0;inline-size:52px;padding:2px 0}.plan-editor .plan-properties button{min-block-size:26px;padding-block:0}.plan-modes{display:flex}@media (width<1000px){.plan-bar{max-inline-size:calc(100% - 2 * var(--edge));inset-block-end:calc(max(var(--edge), env(safe-area-inset-bottom)) + 44px)}}@media (pointer:coarse),(width<760px),(height<500px){:where(#demo-controls,.plan-editor) :is(button,select),.plan-properties label,#toggle-overlays{min-block-size:44px}.plan-editor button,.plan-editor .plan-target{min-block-size:44px;min-inline-size:44px}.plan-editor .plan-properties button{min-block-size:44px}.plan-editor input[type=number]{min-block-size:44px;font-size:16px}.plan-scrub{min-block-size:44px}.plan-scrub input{block-size:44px}#controls .lil-gui{--widget-height:36px;--spacing:6px;--input-font-size:16px}kbd{display:none}}@media (width<760px),(height<500px){:root{--edge:8px}#hud{grid-template-columns:minmax(0,1fr);gap:8px}#side{grid-area:1/1;inline-size:100%}#demo-controls{grid-template-columns:minmax(0,1fr);inline-size:100%;min-inline-size:0;display:grid}.mode-bar{min-inline-size:0}#demo-controls :is(button,select){min-block-size:44px}.mode-bar .segmented{flex:1;min-inline-size:0}.mode-bar .segmented button{flex:1;min-inline-size:0;padding-inline:5px}#demo-controls .group{overscroll-behavior-inline:contain;pointer-events:auto;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}#demo-controls .group :is(button,select){flex:none}#showcase-stunt{max-inline-size:180px}#info{overscroll-behavior:contain;pointer-events:auto;grid-area:2/1;max-block-size:35dvh;inline-size:min(100%,360px);overflow-y:auto}#info:has(#telemetry:not([open])) #history-panel{display:none}#telemetry{padding:6px 9px}#telemetry>summary{min-block-size:44px}#status{overflow-wrap:anywhere;font-size:11px}#controls{inset-block-start:calc(max(var(--edge), env(safe-area-inset-top)) + 100px);inset-inline:max(var(--edge), env(safe-area-inset-left)) max(var(--edge), env(safe-area-inset-right));inline-size:auto;max-block-size:calc(100dvh - max(var(--edge), env(safe-area-inset-top)) - max(var(--edge), env(safe-area-inset-bottom)) - 110px);position:fixed}.settings-open :is(#info,#credits,.plan-dock){visibility:hidden}#demo-readout{inline-size:calc(100% - 2 * var(--edge));inset-block-end:calc(max(var(--edge), env(safe-area-inset-bottom)) + 54px)}#demo-readout dl{justify-content:center;gap:clamp(6px,2vw,16px)}#demo-readout dt{font-size:9px}#demo-readout dd{font-size:24px}.showcase #telemetry{padding:4px 2px}.showcase h1{font-size:18px}.plan-dock{inset-inline:max(var(--edge), env(safe-area-inset-left)) max(var(--edge), env(safe-area-inset-right));flex-direction:column;gap:6px;display:flex;position:absolute;inset-block-end:calc(max(var(--edge), env(safe-area-inset-bottom)) + 54px)}.plan-bar{align-items:stretch;inline-size:100%;max-inline-size:none;position:static;translate:none}.plan-tools :is(button,select){padding-inline:8px}.plan-tools select{flex:auto;min-inline-size:0}.plan-preview{flex:calc(100% - 110px);order:-2;min-inline-size:0;margin:0}.plan-tools .plan-gas{flex:none;order:-1}.plan-preview .plan-scrub,.plan-scrub input{flex:1;min-inline-size:0}.plan-properties{justify-content:flex-start;gap:4px 12px;max-inline-size:100%;position:static;transform:none}.plan-properties input[type=number]{font-size:16px}.plan-turns{order:1}.plan-selection{flex:calc(100% - 100px);order:-2}.plan-editor [data-action=deselect]{order:-1}}@media (width>=600px) and (height<500px){#credits{align-items:center;gap:16px;display:flex}#hud{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}#side{grid-column:2}#info{grid-row:1;max-block-size:50dvh}.plan-dock{inset-block-end:calc(max(var(--edge), env(safe-area-inset-bottom)) + 34px);inset-inline-end:calc(max(var(--edge), env(safe-area-inset-right)) + 88px)}.plan-preview{flex:180px}.plan-tools{flex-wrap:nowrap}.plan-tools .plan-gas{order:0}}#credits .credit-row{align-items:center;gap:10px;display:flex}#credits button{min-block-size:24px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;padding:0}#credits button:hover{color:var(--text);text-underline-offset:3px;text-decoration:underline}.unsupported :is(#hud,#demo-readout,#toggle-overlays,#view){display:none}#about{border:1px solid var(--line);border-radius:var(--radius);max-block-size:calc(100dvh - 24px);inline-size:min(560px,100dvw - 24px);color:var(--text);background:#0d0e12f5;padding:20px 22px;font-size:13px;overflow:auto}#about::backdrop{background:#0000008c}#about h2{margin:0 0 8px;font-size:18px;font-weight:600}#about h3{margin:16px 0 6px;font-size:13px;font-weight:600}#about p,#about ul{margin:0 0 8px}#about ul{padding-inline-start:18px}#about li{margin-block:3px}#about a{color:var(--accent)}#about .fine{color:var(--muted);font-size:12px}#about kbd{color:var(--text);margin:0;font-size:11px}#about .close{block-size:32px;inline-size:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;font-size:22px;position:absolute;inset:8px 8px auto auto}#about .close:hover{color:var(--text)}#fallback{background:#020306;place-items:end center;display:grid;position:fixed;inset:0}#fallback video{object-fit:cover;block-size:100%;inline-size:100%;position:absolute;inset:0}.fallback-note{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);max-inline-size:min(520px,100% - 24px);margin-block-end:96px;padding:14px 18px;position:relative}.fallback-note h2{margin:0 0 6px;font-size:16px;font-weight:600}.fallback-note p{color:var(--muted);font-size:12px}.fallback-note p+p{margin-block-start:4px}#fallback-reason{color:var(--text)}@media (width<760px),(height<500px){.settings-open #demo-readout{visibility:hidden}#controls .lil-gui{--background-color:#0d0e12f5}}
