@font-face{font-family:'Press Start 2P';src:url(/fonts/press-start-2p.woff2) format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Press Start 2P';src:url(/fonts/press-start-2p-greek.woff2) format('woff2');font-display:swap;unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:Play;src:url(/fonts/play-400.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Play;src:url(/fonts/play-greek-400.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:Play;src:url(/fonts/play-700.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Play;src:url(/fonts/play-greek-700.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
:root{color-scheme:dark;--pixel:'Press Start 2P',ui-monospace,monospace;--term:Play,ui-monospace,monospace;font-family:var(--term);color:#efeaff;background:#0a0b1e;font-synthesis:none;--muted:#9a9cd0;--pink:#ff3ea5;--cyan:#3ff0ff;--orange:#ff9b64;--glow-pink:0 0 6px #ff3ea5aa,0 0 18px #ff3ea566;--glow-cyan:0 0 6px #3ff0ffaa,0 0 18px #3ff0ff55}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 78% 40%,#2a1650 0,transparent 55%),radial-gradient(ellipse at 10% 100%,#0f3350 0,transparent 50%),#0a0b1e}
body::after{content:'';position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 3px,#00000012 3px 4px);z-index:1}
main{max-width:1440px;margin:auto;min-height:100svh;display:grid;grid-template-columns:minmax(380px,.85fr) 1.3fr;align-items:center;padding:clamp(20px,4svh,48px) 5%;gap:5%}
.eyebrow{font:9px/1 var(--pixel);letter-spacing:1px;color:var(--cyan);text-shadow:var(--glow-cyan);display:flex;align-items:center;gap:10px;margin:0}
.eyebrow span,.live i{width:6px;height:6px;background:var(--cyan);box-shadow:var(--glow-cyan);display:inline-block}
h1{font:clamp(28px,min(4vw,6.2svh),56px)/1.12 var(--pixel);text-transform:uppercase;letter-spacing:-1px;margin:clamp(14px,3svh,28px) 0;color:#fff;text-shadow:0 0 4px #fff8,0 0 16px #3ff0ff88,0 0 32px #3ff0ff44}
h1 em{font-style:normal;color:var(--pink);text-shadow:0 0 4px #ffd0ea,var(--glow-pink),0 0 42px #ff3ea566;animation:flicker 6s infinite}
@keyframes flicker{0%,92%,96%,100%{opacity:1}93%,95%{opacity:.55}94%{opacity:.85}}
.lead{font-size:clamp(16px,2.3svh,19px);line-height:1.3;color:#c9c5ee;margin:0;max-width:30ch}
.details{display:flex;flex-wrap:wrap;gap:6px 18px;margin:clamp(12px,2.4svh,22px) 0 clamp(14px,3svh,28px);font-size:16px;color:var(--orange)}
.details b{color:#e6e2ff;margin-left:6px;font-weight:700}
.when{color:var(--pink);text-shadow:var(--glow-pink);flex-basis:100%;font-size:18px}
.tbd{color:var(--muted);border-left:1px solid #ffffff2a;padding-left:18px}
form{max-width:440px;border-top:1px solid #3ff0ff33;padding-top:clamp(12px,2.4svh,22px)}
.form-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:clamp(10px,2svh,18px)}
.step{font:9px var(--pixel);color:var(--cyan);text-shadow:var(--glow-cyan)}
h2{font:700 21px/1.2 var(--term);margin:0;color:#fff}
.name-label,legend{font-size:16px;color:#c9c5ee;margin-bottom:6px;display:block}
input:not([type]){width:100%;border:2px solid #4a4c8a;background:#120f2e;border-radius:0;padding:10px 14px;color:#fff;font:18px var(--term);transition:border-color .15s,box-shadow .15s}
input:not([type]):focus{border-color:var(--cyan);box-shadow:var(--glow-cyan);outline:none}
input::placeholder{color:#6f71a8}
fieldset{border:0;padding:0;margin:clamp(10px,2svh,18px) 0 clamp(12px,2svh,18px);display:grid;grid-template-columns:1fr 1fr;gap:10px}
legend{padding:0 0 6px}
.choice{border:2px solid #3b3d75;display:flex;align-items:center;gap:9px;padding:10px;cursor:pointer;position:relative;transition:border-color .15s,box-shadow .15s}
.choice:hover{border-color:#6d70c0}
.choice:has(input:checked){background:#3ff0ff12;border-color:var(--cyan);box-shadow:var(--glow-cyan),inset 0 0 12px #3ff0ff22}
.choice input{accent-color:var(--cyan);margin:0}
.choice b{font-size:16px;display:block;font-weight:700;line-height:1}
.choice small{font-size:14px;color:var(--muted);display:block;margin-top:3px;line-height:1}
.choice i{margin-left:auto;color:var(--cyan);font-style:normal;font-size:20px}
button{font:inherit;cursor:pointer}
#submit{width:100%;border:0;background:var(--pink);color:#1a0716;text-align:left;padding:16px 18px;font:12px var(--pixel);text-transform:uppercase;box-shadow:0 0 0 2px #ff9fd3,0 0 22px #ff3ea5aa,0 0 50px #ff3ea544;transition:transform .1s,box-shadow .15s}
#submit span{float:right}
#submit:hover{box-shadow:0 0 0 2px #ffd0ea,0 0 28px #ff3ea5,0 0 70px #ff3ea566}
#submit:active{transform:translateY(2px)}
button:hover{filter:brightness(1.1)}
button:disabled{opacity:.55;cursor:wait}
#form-status{font-size:17px;line-height:1.1;color:var(--cyan);text-shadow:var(--glow-cyan);min-height:22px;margin:10px 0 4px}
.hint{font-size:14px;line-height:1.15;color:#8285b8;margin:0}
button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.intro,.world{min-width:0}.world{align-self:start;padding-top:clamp(10px,3svh,40px)}
.scene-heading{display:flex;justify-content:space-between;font:8px var(--pixel);letter-spacing:1px;color:var(--muted)}
.live{color:var(--cyan);white-space:nowrap}
.live i{margin-right:6px;animation:blink 1.4s steps(2) infinite}
@keyframes blink{50%{opacity:.2}}
#city{width:108%;margin:0 -4%;display:block;overflow:visible;max-height:calc(100svh - 190px)}
.crew{border-top:1px solid #3ff0ff33;padding-top:16px}
.crew-title{display:flex;justify-content:space-between;align-items:center}
.crew-title h2{font-size:19px}
.crew-title h2 span{color:var(--pink);text-shadow:var(--glow-pink);margin-left:8px}
#refresh{border:0;color:var(--muted);font-size:16px;background:none;padding:6px}
#list-status{color:var(--muted);font-size:16px;line-height:1.2;margin:8px 0}
ul{list-style:none;padding:0;margin:12px 0;display:flex;flex-wrap:wrap;gap:8px}
li{font-size:17px;border:1px solid #ffffff22;padding:4px 10px;display:flex;gap:8px;align-items:center;line-height:1}
li i{width:9px;height:9px;background:var(--guest-color,#3ff0ff);box-shadow:0 0 8px var(--guest-color,#3ff0ff);display:inline-block}
summary{font-size:16px;color:var(--muted);cursor:pointer;margin-top:12px}
#declined-list li{color:var(--muted)}
.guest-cube{animation:arrive .65s ease both;transform-box:fill-box;transform-origin:center}
@keyframes arrive{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.guest-cube,h1 em,.live i{animation:none}}
@media(max-width:900px){main{gap:30px}.choice i{display:none}}
@media(max-width:760px){main{grid-template-columns:minmax(0,1fr);min-height:0;padding:28px 16px 40px;gap:40px}h1{font-size:clamp(28px,9vw,44px)}form{max-width:none}.world{padding-top:0}#city{max-height:none}.tbd{border:0;padding-left:0}.choice{padding:10px 8px}.choice b{font-size:15px}.choice small{font-size:14px}}
