:root{--bg:var(--ad-bg);--text:var(--ad-text);--muted:var(--ad-muted);--accent:var(--ad-accent);--border:var(--ad-border)}
h1,h2,p{margin:0}
h1{font-size:38px;font-weight:450;line-height:1.14;letter-spacing:-1.2px}
h1>span{color:var(--accent)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
[hidden]{display:none!important}
.site{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;position:relative;isolation:isolate}
.access .site:before{content:'';position:absolute;inset:0;z-index:-2;background:#111 url('../images/touge-access-retro.png') center 62%/cover;filter:grayscale(.85) brightness(.8) contrast(1.02)}
.access .site:after{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse min(440px,110vw) 410px at 50% 53%,#08090acc 15%,#08090a99 42%,#08090a38 72%,#08090a00 100%),linear-gradient(180deg,#08090a45,#08090a35 45%,#08090ae6),radial-gradient(ellipse at center,#08090a30 15%,#08090a88 100%);pointer-events:none}
header{display:flex;justify-content:center;padding:48px 24px 0}
.brand{display:block;width:380px;max-width:100%}
.brand img{display:block;width:100%;height:auto}
main{flex:1;display:flex;align-items:center;justify-content:center;padding:44px 24px}
footer{display:flex;justify-content:center;gap:12px 28px;flex-wrap:wrap;padding:0 24px 26px;color:#9aa0aa;font:9px/1.5 Consolas,monospace;letter-spacing:1px}
footer a{color:#c1c5ca}
footer a:hover{color:var(--accent)}
.skip{position:fixed;top:-100px;left:20px;z-index:10;background:var(--accent);color:var(--bg);padding:12px}
.skip:focus{top:15px}
.form-content{width:100%;max-width:360px}
.form-content h1,.welcome-content h1{text-align:center}
.heading-mark{display:flex;justify-content:center;margin-bottom:20px}
.racing-mark{display:inline-flex;gap:4px}
.racing-mark i{width:3px;height:14px;background:#4c5158;transform:skewX(-22deg)}
.racing-mark i:nth-child(2){background:#a1a6af}
.racing-mark i:last-child{background:var(--accent)}
.intro{color:var(--muted);font-size:14px;margin-top:12px;line-height:1.65}
.form-content .intro{text-align:center;margin-bottom:32px}
.field+.field{margin-top:22px}
.field label{display:block;font:10px/1.5 Consolas,monospace;letter-spacing:1.1px;text-transform:uppercase;color:#b3b6bc;margin-bottom:9px}
.field input{display:block;width:100%;min-height:49px;background:#101113;border:1px solid var(--border);border-radius:0;padding:12px 14px;color:var(--text);font-size:16px}
.field input::placeholder{color:#979ca6}
.field small,.password-hint{display:block;color:var(--muted);font-size:11px;margin-top:7px}
.password-hint+.field{margin-top:22px}
.code{letter-spacing:1.5px}
.password{position:relative}
.password input{padding-right:66px}
.reveal{position:absolute;right:2px;top:2px;bottom:2px;min-width:58px;background:none;border:0;color:#b6bbc3;font-size:11px}
.reveal:hover{color:var(--accent)}
.button{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px 20px;border:1px solid transparent;border-radius:0;background:var(--text);color:var(--bg);font-weight:500;font-size:13px;transition:background .18s}
.button:hover{background:var(--accent)}
form>.button{margin-top:30px}
.help{margin-top:20px;text-align:center;color:var(--muted);font-size:12px}
.help a{color:var(--text);text-decoration:underline;text-decoration-color:#5a606a;text-underline-offset:4px}
.help a:hover,.text-link:hover{color:var(--accent)}
.form-error{margin-top:16px;color:#ffb5b5;font-size:13px}
.welcome-content{width:100%;max-width:360px;text-align:center}
.welcome-prose{color:#bdc1c7;font-size:15px;line-height:1.75}
.welcome-prose p+p{margin-top:14px}
.welcome-prose strong{color:var(--text);font-weight:500}
.welcome-note{margin:30px 0 8px;color:var(--muted);font-size:13px}
.signature{display:block;width:auto;height:96px;max-width:100%;object-fit:contain;margin:24px auto 28px}
.error-content{width:100%;max-width:920px;display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.error-art{width:100%;height:360px;object-fit:contain}
.error-copy .button{width:max-content;max-width:100%;margin-top:28px;min-width:220px}
.error-copy .text-link{display:block;width:max-content;margin-top:15px}
.text-link{font-size:12px;color:#bec3ca;padding:8px 0;text-decoration:underline;text-decoration-color:#454a52;text-underline-offset:5px}
.support-content{width:100%;max-width:390px;text-align:center}
.support-art{display:block;margin:26px 0 20px;border:1px solid var(--border);background:#101113;padding:8px}
.support-art img{display:block;width:100%;height:auto}

@media(max-width:700px){header{padding-top:32px}
.brand{width:280px}
main{padding:36px 24px}
h1{font-size:33px}
footer{font-size:8px;gap:8px 16px;letter-spacing:.5px;padding-bottom:24px}
.access .site:before{background-position:center 72%}
.error-content{max-width:420px;grid-template-columns:1fr;gap:24px;text-align:center}
.error-art{height:240px}
.error-copy .button{margin:24px auto 0;width:100%}
.error-copy .text-link{margin:12px auto 0}
}

@media(max-width:440px){.error-art{height:220px}
.support-content h1{font-size:31px}
.welcome-prose{font-size:14px}
}

@media(prefers-reduced-motion:reduce){*{transition:none!important}
}


.form-error:focus{outline:none}
.form-error:focus-visible{outline:2px solid var(--accent);outline-offset:4px}