:root{--bg:#0d0f0b;--fg:#e8e4d6;--muted:#8b8a7c;--accent:#ffb000;--accent-dim:#6b4c0a;--danger:#ff5a4e;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:var(--bg);color:var(--fg);font-family:ui-monospace,SFMono-Regular,JetBrains Mono,Menlo,Consolas,monospace}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%;margin:0}#lobby{text-align:center;background:radial-gradient(ellipse at 50% 120%, #2a2412 0%, transparent 60%), repeating-linear-gradient(0deg, #ffffff05 0 1px, transparent 1px 4px), var(--bg);flex-direction:column;justify-content:center;align-items:center;gap:1.25rem;min-height:100%;padding:2rem;display:flex}h1{letter-spacing:-.04em;margin:0;font-size:clamp(2.5rem,9vw,5.5rem);font-weight:800}h1 span{color:var(--accent)}.tagline{color:var(--muted);margin:0 0 1rem}#play-form{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}input,select,button{font:inherit;border-radius:4px}#name{width:14rem;color:var(--fg);background:#0006;border:1px solid #fff2;padding:.9rem 1rem}#name:focus{outline:2px solid var(--accent);outline-offset:-1px}#play{background:var(--accent);color:#1b1300;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;border:0;padding:.9rem 2.75rem;font-size:1.1rem;font-weight:800}#play:hover:not(:disabled){filter:brightness(1.1)}#play:disabled{background:var(--accent-dim);color:#0009;cursor:progress}#status{min-height:1.5em;margin:0}#status.error{color:var(--danger)}#lobby.unsupported>:not(h1,.tagline,#status){display:none}#download{width:min(28rem,100%);color:var(--muted);gap:.4rem;font-size:.8rem;display:grid}#download.done{visibility:hidden}.bar{background:#ffffff14;height:4px;overflow:hidden}#bar-fill{background:var(--accent);width:0;height:100%;transition:width .2s}#room-line{color:var(--muted);margin:0;font-size:.85rem}.link{color:var(--accent);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}button.corner{width:2.5rem;height:2.5rem;color:var(--muted);cursor:pointer;background:#0006;border:1px solid #fff2;place-items:center;padding:0;display:grid;position:fixed;top:1rem;right:1rem}button.corner svg{fill:currentColor;width:1.4rem;height:1.4rem;transition:transform .3s}button.corner:hover{color:var(--fg);border-color:#fff4}button.corner:hover svg{transform:rotate(60deg)}#settings{width:min(36rem,100% - 2rem);max-height:calc(100% - 2rem);color:var(--fg);background:#15170f;border:1px solid #fff2;border-radius:6px;padding:0}#settings::backdrop{background:#000000b3}#settings form{flex-direction:column;padding:1rem 1.25rem 1.25rem;display:flex}#settings header,#settings footer{justify-content:space-between;align-items:center;display:flex}#settings header{margin-bottom:.9rem}#settings h2{text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin:0;font-size:1.1rem}#settings .close{color:var(--muted);cursor:pointer;background:0 0;border:0;font-size:1.5rem;line-height:1}#settings .close:hover{color:var(--fg)}#settings .tabs{scrollbar-width:none;gap:2px;display:flex;overflow-x:auto}#settings [role=tab]{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;background:#0d0f0b;border:1px solid #ffffff1a;border-radius:4px 4px 0 0;flex:none;margin-bottom:-1px;padding:.45rem .85rem;font-size:.8rem;position:relative}#settings [role=tab]:hover{color:var(--fg)}#settings [role=tab][aria-selected=true]{z-index:1;color:var(--accent);background:#1d2015;border-color:#ffffff2e #ffffff2e #1d2015}#settings [role=tab]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}#settings [role=tabpanel]{min-height:15rem;background:#1d2015;border:1px solid #ffffff2e;border-radius:0 4px 4px;flex-direction:column;gap:.85rem;min-inline-size:0;margin:0;padding:1.25rem;display:flex}#settings .crosshair{flex-flow:wrap;align-items:flex-start;gap:1.5rem}#settings .crosshair .fields{flex-direction:column;flex:14rem;gap:.85rem;display:flex}#settings .crosshair figure{justify-items:center;gap:.4rem;margin:0;display:grid}#settings [data-crosshair-preview]{cursor:crosshair;touch-action:none;border:1px solid #ffffff2e;border-radius:2px;width:160px;height:160px;display:block}#settings figcaption{color:var(--muted);font-size:.75rem}#settings label{align-items:center;gap:.75rem;font-size:.9rem;display:flex}#settings label span{flex:1}#settings input,#settings select{accent-color:var(--accent)}#settings input[type=range]{width:12rem}#settings input[type=checkbox]{width:1.1rem;height:1.1rem;margin:0}#settings input[type=color]{cursor:pointer;background:#0006;border:1px solid #fff2;width:3rem;height:1.75rem;padding:0 2px}#settings select{color:var(--fg);background:#0006;border:1px solid #fff2;padding:.3rem .5rem}#settings output{text-align:right;width:4ch;color:var(--muted);font-variant-numeric:tabular-nums}#settings footer{margin-top:1rem}#settings .hint{color:var(--muted);margin:0;font-size:.85rem;line-height:1.5}#settings code{color:var(--fg)}#settings .config-row{align-items:center;gap:.75rem;font-size:.85rem;display:flex}#settings [data-config-status]{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}#settings [data-config-status].error{color:var(--danger)}#settings .secondary{color:var(--fg);cursor:pointer;background:0 0;border:1px solid #fff3;padding:.4rem .9rem}#settings .secondary:hover{border-color:#fff6}#settings .primary{background:var(--accent);color:#1b1300;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;border:0;padding:.6rem 1.5rem;font-weight:800}#settings .primary:hover{filter:brightness(1.1)}#game{background:#000;position:fixed;inset:0}#game[hidden]{visibility:hidden;display:block!important}#canvas{outline:none;width:100%;height:100%;display:block}#quality{color:#e8e4d6b3;white-space:nowrap;pointer-events:none;background:#00000080;border-radius:4px;align-items:center;gap:.6em;padding:.2rem .6rem;font-size:.75rem;display:flex;position:absolute;top:.5rem;left:50%;transform:translate(-50%)}#quality i{background:#6fcf5a;border-radius:50%;width:.5em;height:.5em}#quality[data-level=fair] i{background:var(--accent)}#quality[data-level=poor] i{background:var(--danger)}#quality span[data-level=fair]{color:var(--accent)}#quality span[data-level=poor]{color:var(--danger)}#overlay{text-align:center;cursor:pointer;background:#000000b3;flex-direction:column;justify-content:center;align-items:center;gap:1rem;font-size:1.25rem;display:flex;position:absolute;inset:0}#overlay small{color:var(--muted);font-size:.85rem}#overlay.choice{cursor:default}#overlay .actions{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:.5rem;display:flex}#overlay .actions button{background:var(--accent);color:#1b1300;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;border:0;padding:.8rem 1.75rem;font-weight:800}#overlay .actions button.secondary{color:var(--fg);background:0 0;border:1px solid #fff3}#overlay .actions button:hover:not(:disabled){filter:brightness(1.1)}#overlay .actions button:disabled{background:var(--accent-dim);color:#0009;cursor:default}#overlay.loading{background:var(--bg);cursor:progress}#overlay .loader{background:#ffffff14;width:min(16rem,60vw);height:4px;overflow:hidden}#overlay .loader:after{content:"";background:var(--accent);width:40%;height:100%;animation:1.1s ease-in-out infinite loader;display:block}@keyframes loader{0%{transform:translate(-100%)}to{transform:translate(250%)}}