:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--background:#101316;--panel:#181d22;--panel-strong:#20272d;--text:#f3f6f8;--muted:#a8b3bd;--line:#33404a;--idle:#5fc7a8;--compare:#f4c95d;--write:#f26d5b;--mark:#6da8ff}*{box-sizing:border-box}body{background:var(--background);color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}button,select,input{border:1px solid var(--line);background:var(--panel-strong);color:var(--text);border-radius:6px}button{cursor:pointer;min-height:40px;padding:0 14px}button:hover{border-color:var(--idle)}select,input{width:100%;min-height:40px;padding:0 10px}.shell{grid-template-columns:minmax(0,1fr) 320px;gap:18px;min-height:100vh;padding:18px;display:grid}.workspace,.controls{background:var(--panel);border:1px solid var(--line);border-radius:8px}.workspace{grid-template-rows:auto minmax(360px,1fr) auto;min-width:0;display:grid;overflow:hidden}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;display:flex}h1{margin:0;font-size:clamp(1.4rem,3vw,2.5rem);line-height:1.05}p{color:var(--muted);margin:8px 0 0}.status{border:1px solid var(--line);text-align:center;text-transform:capitalize;border-radius:999px;min-width:82px;padding:7px 12px}.status-running{border-color:var(--idle);color:var(--idle)}.status-error{border-color:var(--write);color:var(--write)}.status-done{border-color:var(--mark);color:var(--mark)}.stage{min-height:360px;padding:20px;overflow:hidden}.bars{align-items:end;gap:3px;height:100%;min-height:330px;display:grid}.bar{background:linear-gradient(180deg, #85dcc6, var(--idle));border-radius:4px 4px 1px 1px;align-self:end;min-width:3px;transition:background 80ms linear,height 80ms linear,transform 80ms linear}.numbers{align-content:center;gap:6px;min-height:330px;display:grid}.tile{aspect-ratio:1;background:#243139;border:1px solid #3b4b56;border-radius:6px;justify-content:center;align-items:center;min-width:0;font-size:clamp(.65rem,1.8vw,.95rem);transition:background 80ms linear,transform 80ms linear,border-color 80ms linear;display:flex;overflow:hidden}.active-compare{background:var(--compare);color:#18140a;transform:translateY(-18px)}.active-write{background:var(--write);color:#fff;transform:translateY(-26px)}.active-mark{background:var(--mark);color:#07111f;transform:translateY(-14px)}.error{color:var(--write);margin:0;padding:0 20px 16px}.stats{border-top:1px solid var(--line);grid-template-columns:repeat(4,1fr);display:grid}.stats div{border-right:1px solid var(--line);padding:14px 18px}.stats div:last-child{border-right:0}.stats span,.controls label,.control-group>span{color:var(--muted);margin-bottom:8px;font-size:.82rem;display:block}.stats strong{font-size:1.35rem;display:block}.controls{align-self:start;gap:16px;padding:16px;display:grid}.control-row,.segmented{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.playback button:first-child,.segmented .selected{background:var(--idle);border-color:var(--idle);color:#062018}.control-group{border-top:1px solid var(--line);padding-top:16px}input[type=range]{padding:0}@media (max-width:980px){.shell{grid-template-columns:1fr}.controls{order:-1}}@media (max-width:640px){.shell{padding:10px}.topbar,.stats{grid-template-columns:repeat(2,1fr)}.topbar{flex-direction:column;align-items:flex-start}.stats div{border-bottom:1px solid var(--line)}.numbers{grid-template-columns:repeat(auto-fit,minmax(30px,1fr))!important}}