:root{--room:#0b0d0f;--felt:#182025;--lane:#1f2a30;--rail:#7d745f;--railHi:#b3a782;--brass:#d9a441;--ivory:#efe9da;--void:#000;--laser:#ff5b4a;--grid:#cdd4d8;--ink:#e6e2d6;--dim:#7f8a86;--line:#2a3439;--display:"Big Shoulders Display", Impact, "Arial Narrow", sans-serif;--body:"IBM Plex Serif", Georgia, "Times New Roman", serif;--aspect:.387;--board-h:clamp(380px, calc(100dvh - 40px), 1500px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--room);color:var(--ink);font:14px/1.5 var(--body);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;padding-block:20px;padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));margin:0}.wrap{gap:14px;margin:0 auto;display:grid}h1{writing-mode:vertical-rl;font:900 96px / 1 var(--display);letter-spacing:.08em;text-transform:uppercase;align-self:center;margin:0 0 auto}.stage{flex:none;position:relative}.stats{pointer-events:none;margin:0;position:absolute;inset:0}.stats div{text-align:center;background:var(--ivory);color:#000;border:1px solid var(--ivory);justify-items:center;gap:4px;padding:10px 14px;display:grid;position:absolute;box-shadow:0 0 10px #efe9da33}.stats .round{min-width:84px;top:12px;left:11%;transform:translate(-50%)}.stats .level{min-width:84px;top:104px;left:11%;transform:translate(-50%)}.stats .best{min-width:84px;top:12px;right:11%;transform:translate(50%)}dt{letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-size:10px}dd{font:700 26px / 1 var(--display);font-variant-numeric:tabular-nums;margin:0}.stats dt{color:#444}#sRound{color:var(--brass);text-shadow:1px 2px #000;font-size:38px}#table{width:auto;aspect-ratio:var(--aspect);height:min(var(--board-h), calc((100vw - 32px - 560px) / var(--aspect)));background:var(--void);border:1px solid var(--line);flex:none;overflow:hidden}#table canvas{touch-action:none;cursor:crosshair;display:block}.board{justify-content:center;align-items:stretch;gap:12px;display:flex}.spin{flex-direction:column;flex:none;gap:12px;width:108px;display:flex}.spin .gap{height:12px}.spin button{justify-content:center;width:100%;padding-inline:8px}.daynight{display:flex}.spin .daynight button{flex:1;width:auto;padding-inline:0}.daynight button:first-child{border-radius:3px 0 0 3px}.daynight button:last-child{border-left:none;border-radius:0 3px 3px 0}button{font:inherit;letter-spacing:.06em;color:var(--ink);border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:#14191c;border-radius:3px;align-items:center;gap:8px;padding:10px 14px;font-size:13px;display:inline-flex}button.on{background:var(--brass);border-color:var(--brass);color:#16110a}button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}.copy{writing-mode:vertical-rl;letter-spacing:.06em;color:var(--dim);opacity:.7;background:#111518;align-self:flex-end;margin:0;padding:10px 6px;font-size:11px}button[hidden]{display:none}.levels{background:#111518;flex:none;align-self:flex-start;margin-right:24px;padding:28px 40px}.levels table{border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:12px}.levels h2{font:900 28px / 1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--brass);text-align:center;margin:0 0 14px}.levels tbody tr{cursor:pointer}.levels:not(.off) tbody tr:not(.on):not(.maxed):hover td{background:#1c2428}.levels tbody tr.maxed{cursor:default}.levels tr.maxed:not(.on) td:first-child,.levels tr.maxed:not(.on) td:last-child{color:var(--dim)}.levels.off tbody tr{cursor:default}.levels.off table{opacity:.45}.levels th{letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-size:10px;font-weight:400}.levels th,.levels td{border:1px solid var(--line);text-align:center;white-space:nowrap;padding:4px 8px}.levels td:nth-last-child(2){text-align:left}.levels tr.on td{background:var(--brass);color:#16110a}.discs{grid-template-columns:repeat(5,12px);gap:4px;display:grid}.disc{border:2px solid;border-radius:50%;width:12px;height:12px;display:block}.disc.plain{background:#efe9da;border-color:#a9a291}.disc.hot{background:#ff5b4a;border-color:#9c2f24}.disc.scope{background:#9fd8f2;border-color:#5a93ad}.disc.radar{background:#f2cf3a;border-color:#a8891c}.disc.drone{background:#5cc96b;border-color:#2f7a3a}.disc.jump{background:#a77be0;border-color:#5f3d8f}.intro{z-index:10;background:#0009;position:fixed;inset:0}.intro[hidden]{display:none}.panel{background:var(--felt);border:1px solid var(--rail);border-radius:4px;gap:14px;width:min(860px,100vw - 32px);max-height:calc(100dvh - 32px);padding:20px;display:grid;position:absolute;overflow-y:auto}.panel .pairs{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 24px;display:grid}.panel h2{font:900 24px / 1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--brass);margin:0}.panel .steps{grid-template-columns:auto 1fr;align-items:baseline;gap:8px 14px;margin:12px 0 0;display:grid}.panel .steps dt{font:700 20px / 1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}.panel .steps dd{font:inherit;margin:0}.panel p{margin:0}.panel .card{border-top:1px solid var(--line);gap:6px;padding-top:14px;display:grid}.panel .views{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px;display:grid}.panel figure{border:1px solid var(--line);background:#000;border-radius:3px;gap:4px;margin:0;padding:8px;display:grid}.panel figure svg{width:100%;height:72px;display:block}.panel figcaption{letter-spacing:.12em;text-transform:uppercase;color:var(--dim);text-align:center;font-size:10px}.panel .play{color:var(--brass)}.panel .buttons{justify-content:flex-end;gap:12px;display:flex}.panel.scores{width:min(440px,100vw - 32px)}.scores .mine{gap:8px;display:grid}.scores input{font:inherit;color:var(--ink);border:1px solid var(--line);background:#000;border-radius:3px;padding:8px 10px}.scores input:focus-visible{outline:2px solid var(--brass);outline-offset:2px}.scores .note{color:var(--dim)}.scores ol{gap:4px;margin:0 0 8px;padding-left:28px;display:grid}.scores li span{display:inline-block}.scores .who{width:55%}.scores .won{width:20%;color:var(--dim);font-size:12px}.scores .pts{text-align:right;font-variant-numeric:tabular-nums;width:25%;color:var(--brass)}.cover{--cover-gap:clamp(24px, 6vw, 96px);z-index:20;justify-content:center;align-items:stretch;gap:var(--cover-gap);background:var(--room) url(/stars.png) 0 0 / 73vmin repeat;transition:opacity .6s;display:flex;position:fixed;inset:0}.cover .copy{margin-left:calc(-1 * var(--cover-gap))}.cover.gone{opacity:0;pointer-events:none}.cover-title{writing-mode:vertical-rl;font:900 clamp(96px, 22dvh, 240px) / 1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--ivory);align-self:center}.cover-grid{--rail-w:clamp(8px, 1.8vh, 20px);aspect-ratio:1/2;border-inline:var(--rail-w) solid transparent;background:linear-gradient(90deg, #4a4436, var(--railHi) 45%, var(--rail)) left / var(--rail-w) 100% no-repeat border-box, linear-gradient(90deg, var(--rail), var(--railHi) 55%, #4a4436) right / var(--rail-w) 100% no-repeat border-box, var(--felt);max-width:55vw;height:100dvh;position:relative;overflow:hidden;box-shadow:inset 1.6vh 0 1.4vh -.6vh #0009,inset -1.6vh 0 1.4vh -.6vh #0009}.cover-grid svg{width:100%;height:100%;position:absolute;inset:0}.cover-grid line{stroke:var(--grid);stroke-opacity:.28;stroke-width:1.25px;vector-effect:non-scaling-stroke}.cover-grid line.q{stroke-opacity:.5;stroke-width:2.25px}.cover-grid line.h{stroke-opacity:.72;stroke-width:3.5px}.cover-discs .disc{left:calc((var(--col) + .5) * 12.5%);aspect-ratio:1;width:7%;height:auto;animation:drift var(--dur) linear var(--delay) infinite;border-width:.6vh;position:absolute;top:100%;transform:translate(-50%);box-shadow:0 .6vh .9vh #0009,0 .2vh .3vh #00000073}.cover-discs .disc:after{content:"";border:.3vh solid #0000004d;border-radius:50%;position:absolute;inset:14%}.cover-discs .disc.hot{box-shadow:0 0 1.6vh #ff5b4a99,0 .6vh .9vh #0009}@keyframes drift{to{transform:translate(-50%,calc(-100dvh - 100%))}}
