:root{color-scheme:dark;--bg: #0d0f14;--panel: #151922;--line: #262c3a;--text: #d6dbe6;--dim: #8792a8;--accent: #6cb6ff;--good: #5fd08a;--bad: #ff6b6b;font:13px/1.4 system-ui,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text)}a{color:var(--accent)}button,select,input{font:inherit;color:var(--text);background:#1d2330;border:1px solid var(--line);border-radius:4px;padding:3px 8px}button{cursor:pointer}button:hover{border-color:var(--accent)}input[type=number]{width:100%}input[type=range]{width:100%;padding:0}input[type=checkbox]{margin:0 6px 0 0}#app{display:grid;grid-template-columns:292px 1fr;height:100%}#side{background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;padding:10px 12px 14px;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-gutter:stable}#side select,#side input[type=number]{width:100%;height:24px;padding:0 6px;min-width:0}#side input[type=range]{height:24px;margin:0}#side :disabled{opacity:.4}.brand{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.brand h1{font-size:14px;margin:0;letter-spacing:.1em}.brand span{color:var(--dim);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#side section{display:flex;flex-direction:column;gap:6px}#problem{font-weight:600;height:28px!important}.blurb{color:var(--dim);margin:0;font-size:12px;line-height:16px;height:32px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.g2,.g3{display:grid;gap:6px 8px}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:.8fr 1fr 1fr}.f{display:flex;flex-direction:column;gap:2px;min-width:0}.f>span{color:var(--dim);font-size:10.5px;line-height:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.buttons button{height:26px;padding:0}#run{border-color:#3a4a66;background:#223049}.io button{height:24px;padding:0;font-size:12px}.jeans{grid-template-columns:1fr 1.4fr;align-items:end;margin-top:6px}.jeans .check{height:24px}#pparams{display:contents}.checks{display:flex;gap:12px;margin-top:6px}.check{display:flex;align-items:center;white-space:nowrap;font-size:12px}details{border-top:1px solid var(--line);padding-top:8px}summary{cursor:pointer;list-style:none;display:flex;align-items:baseline;gap:8px;user-select:none;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin-bottom:0}summary::-webkit-details-marker{display:none}summary:before{content:"▸";font-size:9px;width:8px}details[open]>summary:before{content:"▾"}details[open]>summary{margin-bottom:8px}summary:hover{color:var(--text)}.sum{margin-left:auto;text-transform:none;letter-spacing:0;font-size:11px;color:#5f6b82;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}details[open]>summary .sum{display:none}#side footer{color:var(--dim);font-size:11px;border-top:1px solid var(--line);padding-top:8px}#sheet-bar{display:none}#stage{position:relative;min-width:0;min-height:0}#view{width:100%;height:100%;display:block;touch-action:none}#rail{position:absolute;right:12px;top:12px;width:58px;display:flex;flex-direction:column;gap:8px}#colorbar{display:flex;flex-direction:column;gap:2px;pointer-events:none}#colorbar canvas{width:100%;height:200px;border:1px solid var(--line);border-radius:3px}#colorbar span{display:block;width:100%;height:15px;line-height:15px;font-size:11px;text-align:center;white-space:nowrap;overflow:hidden;contain:strict;font-variant-numeric:tabular-nums;background:#0d0f14b3;border-radius:3px}#tools{display:flex;flex-direction:column;gap:4px}#tools button{height:26px;padding:0;display:grid;place-items:center;color:var(--dim);background:#1d2330d9}#tools button svg{width:16px;height:16px;display:block}#tools button:hover{color:var(--text)}#tools button[aria-pressed=true]{border-color:var(--accent);background:#223049;color:#fff}#tools button:disabled{opacity:.4;cursor:default;border-color:var(--line)}#tool-params{display:flex;flex-direction:column;gap:3px;margin-top:2px}#tool-params[hidden],#tool-params label[hidden]{display:none}.scrub{position:relative;display:block;height:18px}.scrub input{-webkit-appearance:none;appearance:none;display:block;width:100%;height:100%;margin:0;padding:0;border:1px solid var(--line);border-radius:3px;cursor:ew-resize;background:linear-gradient(to right,#2c4466 var(--p, 0%),rgba(29,35,48,.85) var(--p, 0%))}.scrub input:hover{border-color:var(--accent)}.scrub input::-webkit-slider-thumb{-webkit-appearance:none;width:2px;height:18px;background:var(--accent)}.scrub input::-moz-range-thumb{width:2px;height:18px;border:0;border-radius:0;background:var(--accent)}.scrub span{position:absolute;inset:0;padding:0 4px;display:flex;justify-content:space-between;font-size:10px;line-height:18px;color:#aab3c5;pointer-events:none;white-space:nowrap}#tools #tool-rest,#tools #tool-erase,#tools #tool-clear{height:18px;font-size:10px;color:#aab3c5}#tools #tool-rest[hidden],#tools #tool-erase[hidden],#tools #tool-clear[hidden],#tool-shapes[hidden]{display:none}#tools #tool-rest[aria-pressed=true],#tools #tool-erase[aria-pressed=true]{color:#fff}#tool-shapes{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}#tools #tool-shapes button{height:20px}#tools #tool-shapes svg{width:13px;height:13px}.scrub output{color:var(--text);font-variant-numeric:tabular-nums}#view.tool{cursor:crosshair}#marks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}#marks circle{fill:none;stroke:#7fe3a0;stroke-width:1.5;stroke-opacity:.9}#marks line{stroke:#7fe3a0;stroke-width:2;stroke-linecap:round}#marks path{fill:#7fe3a0}#marks .sink circle{stroke:#ff9d5c;stroke-dasharray:3 3}#brush{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;display:none}#brush{--tint: #fff}#brush.active{--tint: var(--accent)}#brush.active.minus{--tint: #ff9d5c}#brush circle{fill:none;stroke:var(--tint);stroke-opacity:.75;stroke-width:1;stroke-dasharray:4 3}#brush ellipse{fill:none;stroke:var(--tint);stroke-opacity:.45;stroke-width:1;display:none}#brush stop{stop-color:var(--tint)}#brush.outline{--tint: var(--accent)}#brush.outline.minus{--tint: #ff9d5c}#brush.outline circle,#brush.outline ellipse,#brush.outline line{display:none!important}#brush path.shape{display:none;fill:color-mix(in srgb,var(--tint) 20%,transparent);stroke:var(--tint);stroke-width:1.5;stroke-dasharray:5 3;stroke-linejoin:round}#brush.outline path.shape{display:block}#brush.ball circle{fill:url(#brush-ball)}#brush.ball ellipse{display:block}#brush.active circle{stroke-opacity:1;stroke-width:2;stroke-dasharray:none;fill:color-mix(in srgb,var(--tint) 22%,transparent);animation:brush-pulse .7s ease-in-out infinite alternate}#brush.active.ball circle{fill:url(#brush-ball)}#brush.active ellipse{stroke-opacity:.9}@keyframes brush-pulse{0%{fill-opacity:.45}to{fill-opacity:1;stroke-opacity:.7}}#brush line{stroke:#fff;stroke-width:2;display:none}#brush marker path{fill:#fff}#hud{position:absolute;left:12px;top:10px;width:720px;height:18px;line-height:18px;white-space:nowrap;overflow:hidden;contain:strict;color:var(--dim);text-shadow:0 0 3px #000;pointer-events:none;font-variant-numeric:tabular-nums}#error{position:absolute;inset:0;z-index:5;display:none;flex-direction:column;gap:10px;padding:16px;background:var(--bg);overflow:hidden}@media (max-width: 700px){#error{position:fixed;z-index:20;box-sizing:border-box}}#error .err-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}#error .err-title{color:var(--bad);font-weight:600;font-size:14px}#error .err-sub{color:var(--dim);font-size:12px;margin-top:2px;overflow-wrap:anywhere}#error .err-actions{display:flex;gap:8px;flex:none}#error .err-actions button{padding:6px 12px}#error .err-body{flex:1;min-height:0;margin:0;overflow:auto;padding:10px;border:1px solid var(--line);border-radius:4px;font:11.5px/1.45 ui-monospace,Consolas,monospace;color:var(--bad);white-space:pre;tab-size:2;user-select:text;-webkit-user-select:text;-webkit-overflow-scrolling:touch}#tf{width:100%;height:48px;margin-top:8px;border:1px solid var(--line);border-radius:4px;cursor:crosshair;display:block}#diag{display:grid;grid-template-columns:1fr 1fr;column-gap:12px;height:119px;contain:strict}#diag dl{display:grid;grid-template-columns:38px minmax(0,1fr);grid-auto-rows:17px;column-gap:4px;margin:0;font-variant-numeric:tabular-nums}#diag dt,#diag dd{height:17px;line-height:17px;white-space:nowrap;overflow:hidden}#diag dt{color:var(--dim);font-size:11px}#diag dd{margin:0;text-align:right;font-family:ui-monospace,Consolas,monospace;font-size:11.5px;contain:strict}#diag dd.warn{color:#ffb454}body.validate{padding:20px 28px;height:auto}body.validate h1{font-size:18px;margin:0 0 6px}body.validate table{border-collapse:collapse;width:100%;margin-top:12px}body.validate th,body.validate td{border-bottom:1px solid var(--line);padding:6px 10px;text-align:left;vertical-align:top}body.validate th{color:var(--dim);font-weight:500}.status.pass{color:var(--good);font-weight:600}.status.fail{color:var(--bad);font-weight:600}.status.running{color:var(--accent)}.detail dl{display:grid;grid-template-columns:auto 1fr;gap:0 12px;margin:4px 0 0;font-family:ui-monospace,Consolas,monospace;font-size:12px}.detail dt{color:var(--dim)}.detail dd{margin:0;overflow-wrap:anywhere}@media (max-width: 700px){:root{--bar: 48px;--safe: env(safe-area-inset-bottom, 0px)}#app{display:block}#stage{position:fixed;inset:0 0 calc(var(--bar) + var(--safe)) 0}#side{position:fixed;left:0;right:0;bottom:0;z-index:10;height:calc(var(--bar) + var(--safe));max-height:80dvh;overflow:hidden;border-right:0;border-top:1px solid var(--line);border-radius:12px 12px 0 0;padding:0 14px calc(14px + var(--safe));gap:12px;scrollbar-gutter:auto;box-shadow:0 -6px 24px #00000073}#side.open{height:auto;overflow-y:auto;overscroll-behavior:contain}#sheet-bar{display:flex;align-items:center;gap:10px;flex:none;height:var(--bar);position:sticky;top:0;z-index:2;background:var(--panel);margin:0 -14px;padding:0 14px}#sheet-toggle{flex:1;min-width:0;height:100%;display:flex;align-items:center;gap:10px;background:none;border:0;padding:0;text-align:left;font-weight:600;font-size:14px}#sheet-toggle .grip{flex:none;width:28px;height:4px;border-radius:2px;background:#3a4358}#sheet-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#sheet-toggle:after{content:"▴";color:var(--dim);margin-left:auto;font-size:12px}#side.open #sheet-toggle:after{content:"▾"}#sheet-run{flex:none;height:34px;min-width:72px;border-color:#3a4a66;background:#223049;font-size:14px}#side select,#side input[type=number]{height:36px;font-size:16px}#problem{height:40px!important}#side input[type=range]{height:36px}.buttons button{height:40px;font-size:15px}.io button{height:36px;font-size:14px}.check{font-size:14px;min-height:32px}summary{font-size:12px;min-height:28px;align-items:center}.f>span{font-size:11.5px;line-height:15px}.blurb{font-size:13px;line-height:18px;height:36px}#tf{height:64px}#hud{left:10px;top:8px;width:calc(100% - 84px);height:34px;line-height:17px;white-space:normal;font-size:12px}#rail{right:8px;top:8px}#colorbar canvas{height:120px}#tools button{height:34px}.scrub,#tools #tool-rest,#tools #tool-erase,#tools #tool-clear,#tools #tool-shapes button{height:26px}.scrub span{line-height:26px}.scrub input::-webkit-slider-thumb{height:26px}.scrub input::-moz-range-thumb{height:26px}}