@font-face{font-family:"IT";src:url(fonts/inter-tight-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:block}
@font-face{font-family:"IT";src:url(fonts/inter-tight-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:block}
@font-face{font-family:"GM";src:url(fonts/geist-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"GM";src:url(fonts/geist-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:block}
:root{--or:#EE4104;--ink:#0A0A0A;--paper:#F9F9F9;--line:#E6E4E1;--mute:#9A9A9A}
html,body{margin:0;height:100%;background:#000;overflow:hidden}
#stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden;background:var(--paper);
  font-family:"IT",system-ui,sans-serif;font-weight:500;color:var(--ink);-webkit-font-smoothing:antialiased;font-kerning:normal}
#bg,#grid,#ascii,#gfx,#fx{position:absolute;left:0;top:0;width:1920px;height:1080px}
#grid{--gl:var(--line);display:none}
#grid line{stroke:var(--gl);stroke-width:1}
#grid path{fill:var(--gl)}
#fx{pointer-events:none}
.scene{position:absolute;inset:0;display:none;overflow:hidden}
#gfx.measuring .scene{display:block!important}
.card{position:absolute;inset:0;overflow:hidden}
.abs{position:absolute}
.h{visibility:hidden}
.d{display:none}
.disp{font-family:"IT";font-weight:500;letter-spacing:-.045em;line-height:.95;white-space:pre}
.mono{font-family:"GM";font-weight:400;text-transform:uppercase;letter-spacing:.12em;font-size:22px;line-height:1;white-space:pre}
.or{color:var(--or)} .wh{color:#fff} .ink{color:var(--ink)}
.center{left:0;right:0;text-align:center}
.ch{white-space:pre}
.blk{color:transparent!important;background:linear-gradient(var(--blk,#0A0A0A),var(--blk,#0A0A0A)) 0 58%/100% 64% no-repeat}
.caret{display:inline-block;width:.06em;min-width:3px;height:.78em;background:var(--or);vertical-align:-.04em;margin-left:.04em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.badge{position:absolute;border-radius:50%;background:var(--or);display:flex;align-items:center;justify-content:center}
.badge svg{width:56%;height:56%;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.photo{position:absolute;left:1076px;top:-190px;width:844px;height:1500px;transform-origin:100% 80%}
.photo img,.photo canvas{position:absolute;left:0;top:0;width:844px;height:1500px}
/* who bands */
.slot{position:absolute;left:0;width:1920px;height:360px;overflow:hidden}
.band{position:absolute;inset:0}
/* clips */
.clip{position:absolute;height:74px;box-sizing:border-box;border:1.5px solid var(--ink);background:#fff;border-radius:6px;overflow:hidden}
.clip .mono{position:absolute;left:12px;top:12px;font-size:15px;letter-spacing:.08em}
/* type cards */
.tcard{position:absolute;width:480px;height:300px;box-sizing:border-box;background:#fff;border:1px solid var(--line);border-radius:16px}
.tcard .mono{position:absolute;font-size:17px;color:var(--mute)}
.tcard .lab{position:absolute;left:32px;bottom:30px;font-size:50px;line-height:1;letter-spacing:-.04em;white-space:pre}
.tick{position:absolute;width:10px;height:10px;border-color:var(--line);border-style:solid}
/* pill */
.pill{position:absolute;left:310px;top:465px;height:150px;width:1300px;border-radius:75px;background:#fff;box-sizing:border-box;overflow:hidden}
#hud{position:fixed;z-index:10;left:12px;top:10px;display:flex;gap:14px;align-items:center;font:500 13px/1 "GM",monospace;
  color:#fff;background:rgba(0,0,0,.72);padding:8px 12px;border-radius:6px;opacity:0;transition:opacity .25s}
#hud.on{opacity:1}
#hud a{color:#fff}
#hud .hint{opacity:.75}