@font-face{font-family:"VT323";src:url("/assets/vt323.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{--bg:#1A1A1C;--bg2:#0E0E10;--steel:#2E2E33;--ash:#5A5A60;--txt:#C8C8CC;--dim:#9A9AA0;--hi:#EDEDEF;--y:#FFD400;
--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;--term:"VT323",ui-monospace,monospace;--pad:clamp(20px,5vw,56px)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;background:var(--bg);color:var(--txt);font:15px/1.5 var(--mono)}
a{color:var(--hi);text-underline-offset:3px}
a:hover{color:#fff}
:focus-visible{outline:2px solid var(--hi);outline-offset:3px}
.top{padding:16px var(--pad) 0}
.wordmark{display:inline-block;line-height:0}
/* intrinsic 500x100: fixed height, auto width => exact proportions */
.wordmark img{display:block;height:24px;width:auto;aspect-ratio:5/1}
.wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:8px var(--pad) 12px;width:100%}
.intro{width:100%;max-width:460px}
.logo{position:relative;width:min(200px,56vw);aspect-ratio:1;margin:0 auto 4px}
.logo-sym{width:100%;height:100%;display:block}
.logo-txt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;margin:0;white-space:nowrap;
 font:400 46px/1 var(--term);color:var(--y);letter-spacing:.02em;
 text-shadow:3px 0 0 var(--bg),-3px 0 0 var(--bg),0 3px 0 var(--bg),0 -3px 0 var(--bg),3px 3px 0 var(--bg),-3px -3px 0 var(--bg),3px -3px 0 var(--bg),-3px 3px 0 var(--bg)}
.lead{margin:0 0 20px;color:var(--hi);font-size:15px;text-align:center}
.join{margin:0}
label{display:block}
.field>label{font:19px/1 var(--term);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.row{display:flex;flex-wrap:wrap;gap:8px}
input[type=email]{flex:1 1 200px;min-width:0;height:46px;padding:0 12px;background:var(--bg2);color:var(--hi);border:1px solid var(--ash);border-radius:0;font:16px var(--mono)}
input[type=email]:focus-visible{outline:2px solid var(--hi);outline-offset:0;border-color:var(--hi)}
input[aria-invalid=true]{border-color:#E8E8EA;border-style:dashed}
button{flex:0 0 auto;height:46px;padding:0 18px;border:1px solid var(--hi);border-radius:0;background:var(--hi);color:var(--bg2);font:22px/1 var(--term);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
button:hover{background:#fff}
button:disabled{opacity:.6;cursor:progress}
@media (max-width:480px){button{width:100%}}
.check{display:flex;gap:10px;align-items:flex-start;margin-top:14px}
.check input{flex:0 0 auto;width:20px;height:20px;margin:1px 0 0;accent-color:var(--hi)}
.check label{font-size:12.5px;line-height:1.45;color:var(--txt)}
.err{margin:6px 0 0;font-size:12.5px;color:var(--hi)}
.err:empty{margin:0}
.err:not(:empty)::before{content:"[!] "}
.ok{margin:0;padding:14px;border:1px solid var(--ash);color:var(--hi);font-size:14px}
.ok:focus{outline:none}
.privacy{margin:14px 0 0;font-size:11.5px;line-height:1.45;color:var(--dim)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.foot{padding:8px var(--pad) 14px;font-size:11px;color:var(--dim);text-align:center}
.foot p{margin:0}
@media (min-width:700px){.wordmark img{height:28px}.logo{width:260px}.logo-txt{font-size:60px}.lead{font-size:16px;margin-bottom:28px}.check{margin-top:18px}.privacy{margin-top:18px;font-size:12px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}