:root{--bg:#000;--fg:#fff;--dim:#8a8a8a;--faint:#4a4a4a;--line:#1c1c1c;--line-hi:#333;--red:red;--green:#0f0;--yellow:#ffd23f;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:13px}*{box-sizing:border-box}body{flex-direction:column;height:100dvh;margin:0;display:flex;overflow:hidden}header{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 24px;padding:16px;display:flex}h1{letter-spacing:-.01em;margin:0;font-size:22px;font-weight:700}.title p{color:var(--dim);margin:4px 0 0}.controls{flex-wrap:wrap;align-items:center;gap:8px 14px;display:flex}label{color:var(--dim);align-items:center;gap:6px;display:inline-flex}button,select{font:inherit;color:var(--fg);border:1px solid var(--line-hi);cursor:pointer;background:0 0;border-radius:4px;padding:4px 9px}button:hover,select:hover{border-color:var(--fg)}select option{background:#111}button.primary{color:var(--bg);background:var(--fg);border-color:var(--fg);min-width:96px;font-weight:700}input[type=range]{width:110px;accent-color:var(--fg)}input[type=checkbox]{accent-color:var(--fg)}output{min-width:64px;color:var(--fg);font-variant-numeric:tabular-nums}main{flex:1;grid-template-columns:minmax(0,1fr) 420px;min-height:0;display:grid}#grid{--cols:7;--rows:3;--gap:1px;align-content:stretch;gap:var(--gap);border-right:1px solid var(--line);flex-wrap:wrap;min-height:0;display:flex;overflow:hidden}.panel{flex:1 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols) - .5px);height:calc((100% - (var(--rows) - 1) * var(--gap)) / var(--rows) - .5px);background:var(--bg);cursor:pointer;-webkit-user-select:none;user-select:none;min-width:0;box-shadow:0 0 0 1px var(--line);outline-offset:-1px;outline:1px solid #0000;flex-direction:column;padding:8px 0 0;display:flex}.panel:hover{outline-color:var(--line-hi)}.panel.solo{outline-color:var(--fg)}.panel.flash{animation:.6s flash}@keyframes flash{0%,50%{background:#222}}.panel .head{white-space:nowrap;align-items:baseline;gap:6px;margin-bottom:6px;padding:0 8px;display:flex}.panel .name{text-overflow:ellipsis;flex:1;font-weight:700;overflow:hidden}.panel.solo .name:after{content:" ♪";font-weight:400}.panel .steps{color:var(--dim);font-variant-numeric:tabular-nums}.rank{font-variant-numeric:tabular-nums;min-width:2ch;color:var(--fg);font-weight:700}.rank.r1{color:var(--green)}.rank.dnf{color:var(--red)}.panel canvas{flex:1;width:100%;min-height:0;display:block}body.zoomed .panel:not(.zoomed){display:none}body.zoomed .panel.zoomed{flex-basis:100%;height:100%}aside{min-height:0;padding:12px 16px;overflow-y:auto}.tabs{gap:4px;margin-bottom:8px;display:flex}.tabs button{color:var(--dim);border-color:#0000}.tabs button.active{border-color:var(--line-hi);color:var(--fg)}table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}th{text-align:right;color:var(--dim);border-bottom:1px solid var(--line-hi);padding:4px;font-weight:400}td{text-align:right;border-bottom:1px solid var(--line);white-space:nowrap;padding:3px 4px}th:nth-child(-n+2),td:nth-child(-n+2){text-align:left}tbody tr{cursor:pointer}tbody tr:hover{background:#111}tr.solo td:nth-child(2){text-underline-offset:3px;text-decoration:underline}tr.running td{color:var(--dim)}.big-o{color:var(--dim);font-size:11px}td.cell{text-align:center;color:#000;border-left:1px solid var(--bg);min-width:26px;padding:4px 2px;font-size:11px}.progress{background:var(--line);height:2px;margin:12px 0 6px}.progress div{background:var(--fg);width:0;height:100%}.meta{color:var(--dim);margin-top:8px;font-size:11px;line-height:1.5}.rules{color:var(--dim);margin:14px 0 0;font-size:11px;line-height:1.5}#note{border-top:1px solid var(--line);margin-top:12px;padding-top:12px;font-size:12px;line-height:1.5}#note b{font-weight:700}#note .o{color:var(--dim)}footer{border-top:1px solid var(--line);color:var(--dim);flex-wrap:wrap;gap:6px 16px;padding:8px 16px;font-size:11px;display:flex}footer a{color:var(--fg);margin-left:auto}kbd{font:inherit;color:var(--fg);border:1px solid var(--line-hi);border-radius:3px;padding:0 4px}dialog{width:min(1240px,100vw - 32px);max-height:calc(100vh - 32px);color:var(--fg);background:var(--bg);border:1px solid var(--line-hi);border-radius:6px;padding:16px}dialog::backdrop{background:#000000bf}.dialog-head{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}h2{margin:0;font-size:18px;font-weight:700}.video-body{grid-template-columns:300px minmax(0,1fr);gap:16px;display:grid}.video-opts{flex-direction:column;gap:10px;display:flex}.video-opts label{flex-direction:column;align-items:stretch;gap:4px}.video-opts input[type=number]{font:inherit;color:var(--fg);border:1px solid var(--line-hi);background:0 0;border-radius:4px;padding:4px 8px}.video-opts p{margin:0}#video-duration.warn{color:var(--yellow)}.video-actions,#video-done{flex-wrap:wrap;gap:8px;display:flex}a.button{font:inherit;border-radius:4px;padding:4px 9px;text-decoration:none}a.button.primary{color:var(--bg);background:var(--fg);font-weight:700}button:disabled{opacity:.4;cursor:default}.video-stage{border:1px solid var(--line);justify-content:center;align-items:flex-start;min-height:200px;display:flex}.video-stage canvas,.video-stage video{background:#000;max-width:100%;max-height:calc(100vh - 140px);display:block}.video-stage canvas:fullscreen{max-height:none}@media (width<=900px){body{height:auto;overflow:visible}main{grid-template-columns:minmax(0,1fr)}#grid{border-right:0}.panel{height:150px}body.zoomed .panel.zoomed{height:70vh}.video-body{grid-template-columns:minmax(0,1fr)}}