@import url('/assets/fonts/local-fonts.css');
:root {
  color-scheme: light;
  --bg:#faf8f4; --bg-alt:#f3efe6; --surface:#fff; --surface-sunken:#f6f3ec;
  --border:#e6e0d2; --border-strong:#d8cfba; --ink:#2a251d; --ink-muted:#726a5b; --ink-faint:#a89d87;
  --pastel-clay-bg:#f4e6da; --pastel-clay-ink:#8a4a25; --pastel-sage-bg:#e7edde; --pastel-sage-ink:#3f5f3a;
  --font-sans:'Instrument Sans','Helvetica Neue',Arial,sans-serif;
  --font-serif:'Newsreader','Iowan Old Style',Georgia,serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --radius-sm:4px; --radius-lg:12px;
}
* { box-sizing:border-box; }
body { margin:0; min-height:100svh; display:flex; flex-direction:column; color:var(--ink); background:var(--bg); font:400 16px/1.6 var(--font-sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
:focus-visible { outline:2px solid var(--pastel-clay-ink); outline-offset:4px; }
.gate-field { position:fixed; inset:0; pointer-events:none; opacity:.38; z-index:-1; }
.gate-field canvas { width:100%; height:100%; display:block; }
.gate-header,.gate-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 clamp(24px,6vw,100px); }
.gate-header { min-height:108px; border-bottom:1px solid var(--border); }
.wordmark { font-size:26px; font-weight:600; letter-spacing:-1.2px; }
.wordmark span { color:var(--pastel-clay-ink); }
.edition,.eyebrow { font:400 10px/1.5 var(--font-mono); letter-spacing:.12em; }
.edition { color:var(--ink-muted); }
.gate-main { flex:1; width:100%; max-width:1480px; margin:0 auto; padding:clamp(60px,10vh,132px) clamp(24px,9vw,144px) 90px; }
.gate-copy { max-width:740px; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 30px; color:var(--pastel-sage-ink); }
.status-dot { width:6px; height:6px; border-radius:50%; background:var(--pastel-sage-ink); }
h1 { font:400 clamp(46px,5.5vw,80px)/1.02 var(--font-serif); letter-spacing:-.04em; margin:0 0 26px; }
h1 span { color:var(--ink-muted); }
.intro { color:var(--ink-muted); font-size:17px; line-height:1.75; margin:0 0 40px; }
.gate-form { max-width:430px; }
.gate-form label { display:block; font-size:13px; font-weight:500; margin:0 0 10px; }
.code-row { display:flex; border:1px solid var(--border-strong); border-radius:7px; background:var(--surface); padding:5px; gap:5px; }
.code-row:focus-within { border-color:var(--ink-muted); }
.code-row input { width:0; min-width:0; flex:1; border:0; border-radius:3px; background:var(--surface); color:var(--ink); padding:9px 10px; font-size:14px; }
.code-row input:focus { outline:none; }
.code-row input::placeholder { color:var(--ink-muted); }
.code-row button { flex-shrink:0; padding:10px 16px; border:1px solid var(--ink); border-radius:4px; background:var(--ink); color:var(--surface); font-size:13px; cursor:pointer; }
.code-row button span { margin-left:12px; }
.code-row button:disabled { opacity:.65; cursor:wait; }
.feedback { min-height:24px; margin:7px 0 0; font-size:12px; color:var(--ink-muted); }
.feedback[data-error='true'] { color:#963a29; }
.character-note { font-size:12px; line-height:1.7; color:var(--ink-muted); margin:28px 0 0; }
.gate-footer { min-height:76px; border-top:1px solid var(--border); color:var(--ink-muted); font-size:11px; }
.gate-footer a { color:var(--ink); }
.gate-footer a:hover { text-decoration:underline; }
@media(max-width:600px) {
  .gate-header { min-height:82px; } .edition { font-size:8px; letter-spacing:.07em; }
  .gate-main { padding-top:68px; padding-bottom:130px; }
  h1 { font-size:clamp(38px,9vw,54px); } .intro { font-size:15px; } .wide-only { display:none; }
  .gate-footer { font-size:10px; gap:12px; flex-wrap:wrap; padding:18px 0; min-height:72px; }
}

.gate-header { flex-wrap:wrap; gap:12px; }
#gate-language:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
