/* thegateroom — SGC console aesthetic. dark slate, pale-cyan + amber, Coolvetica display. */
@font-face{
  font-family:'Coolvetica';
  src:url('/coolvetica.otf') format('opentype');
  font-display:swap;
}
:root{
  --bg:#0a0f12;
  --panel:#121a1f;
  --panel-2:#18242b;
  --edge:#23353e;
  --cyan:rgb(209,238,238);
  --cyan-dim:#6f9aaa;
  --amber:rgb(255,200,120);
  --amber-dim:#b8893f;
  --text:#cfe2e6;
  --muted:#7d949b;
  --good:#6fcf8e;
  --bad:#e07a6f;
  --radius:10px;
}
*{box-sizing:border-box}
body{
  margin:0;color:var(--text);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:15px;line-height:1.55;min-height:100vh;
  background:
    radial-gradient(1100px 620px at 80% -12%, rgba(255,200,120,.10), transparent 58%),
    radial-gradient(950px 700px at -10% 8%, rgba(209,238,238,.07), transparent 60%),
    linear-gradient(180deg, rgba(10,15,18,.68) 0%, rgba(10,15,18,.90) 46%, var(--bg) 80%),
    url('/img/space-gate.jpg') center 12%/min(1500px,135%) no-repeat fixed,
    var(--bg);
}
body::before{ /* starfield */
  content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(1.6px 1.6px at 18% 28%, #ffffffaa 0, transparent 60%),
    radial-gradient(1.4px 1.4px at 82% 18%, #ffffff88 0, transparent 60%),
    radial-gradient(1px 1px at 62% 66%, #ffffff99 0, transparent 60%),
    radial-gradient(2px 2px at 40% 82%, #cfe5ff66 0, transparent 60%),
    radial-gradient(1px 1px at 12% 74%, #ffffff77 0, transparent 60%),
    radial-gradient(1px 1px at 91% 56%, #ffffff88 0, transparent 60%),
    radial-gradient(1.5px 1.5px at 50% 38%, #ffffff55 0, transparent 60%),
    radial-gradient(1px 1px at 30% 52%, #ffffff66 0, transparent 60%),
    radial-gradient(1.3px 1.3px at 72% 44%, #ffffff77 0, transparent 60%);
}
body::after{ /* faint console scanlines */
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background:repeating-linear-gradient(0deg, transparent 0 3px, rgba(120,196,225,.02) 3px 4px);
}
h1,h2,h3,.display{font-family:'Coolvetica','Inter',sans-serif;letter-spacing:.02em;font-weight:400}
main>h1{font-size:2.5rem;text-shadow:0 0 32px rgba(209,238,238,.18);margin:0 0 2px}
a{color:var(--cyan);text-decoration:none}
a:hover{color:#fff}
.mono{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:.82em;color:var(--muted)}

header.top{
  display:flex;align-items:center;gap:18px;padding:14px 26px;
  border-bottom:1px solid var(--edge);background:rgba(10,15,18,.85);
  position:sticky;top:0;backdrop-filter:blur(10px);z-index:10;
  box-shadow:0 10px 34px rgba(0,0,0,.5);
}
.brand{display:flex;align-items:center;gap:11px;font-family:'Coolvetica';font-size:22px;color:var(--cyan)}
.brand .glyph{width:26px;height:26px;border:2px solid var(--amber);border-radius:50%;
  display:grid;place-items:center;color:var(--amber);font-size:13px;box-shadow:0 0 14px rgba(255,200,120,.35)}
nav.tabs{display:flex;gap:4px;margin-left:8px}
nav.tabs button{background:none;border:none;color:var(--muted);font:inherit;padding:8px 14px;
  border-radius:8px;cursor:pointer;letter-spacing:.03em}
nav.tabs button.active{color:var(--cyan);background:var(--panel-2)}
nav.tabs button:hover{color:var(--text)}
.spacer{flex:1}
.who{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}

main{max-width:920px;margin:0 auto;padding:30px 22px 80px}
.lede{color:var(--muted);margin:-6px 0 26px;max-width:62ch}

.btn{background:var(--panel-2);color:var(--cyan);border:1px solid var(--edge);
  padding:9px 16px;border-radius:8px;font:inherit;cursor:pointer;transition:.15s}
.btn:hover{border-color:var(--cyan);color:#fff}
.btn.amber{color:var(--amber);border-color:var(--amber-dim)}
.btn.amber:hover{border-color:var(--amber);box-shadow:0 0 14px rgba(255,200,120,.25)}
.btn.ghost{background:none}
.btn:disabled{opacity:.4;cursor:not-allowed}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.card{position:relative;border:1px solid var(--edge);border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(18,26,31,.97), rgba(13,19,26,.97));
  padding:18px 20px 18px 22px;margin-bottom:14px;transition:.18s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.35)}
.card::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,var(--cyan),transparent);opacity:.45;transition:.18s}
.card:hover{border-color:var(--cyan);transform:translateY(-2px);
  box-shadow:0 16px 46px rgba(0,0,0,.5), 0 0 26px rgba(209,238,238,.07)}
.card:hover::before{opacity:1;box-shadow:0 0 14px rgba(209,238,238,.55)}
.card h3{margin:0 0 4px;font-size:20px}
.card .meta{color:var(--muted);font-size:13px;display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}

.chip{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;border:1px solid;font-family:ui-monospace,monospace}
.chip.proposal{color:var(--cyan);border-color:#2f5563}
.chip.open{color:var(--amber);border-color:var(--amber-dim)}
.chip.decided{color:var(--good);border-color:#2f6b46}
.chip.rejected{color:var(--bad);border-color:#73403a}
.chip.withdrawn{color:var(--muted);border-color:var(--edge)}

.tally{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--panel-2);margin-top:12px;border:1px solid var(--edge)}
.tally .for{background:var(--good)}.tally .against{background:var(--bad)}.tally .abstain{background:#46606a}
.tally-legend{display:flex;gap:16px;font-size:12px;color:var(--muted);margin-top:6px}

input,textarea,select{width:100%;background:var(--panel-2);border:1px solid var(--edge);color:var(--text);
  border-radius:8px;padding:10px 12px;font:inherit;margin:6px 0 14px}
input:focus,textarea:focus{outline:none;border-color:var(--cyan)}
label{font-size:13px;color:var(--muted);letter-spacing:.03em}
textarea{min-height:110px;resize:vertical}

.outcome{background:rgba(111,207,142,.07);border:1px solid #2f6b46;border-left:3px solid var(--good);
  border-radius:8px;padding:14px 16px;margin:16px 0}
.outcome .label{color:var(--good);font-size:12px;letter-spacing:.1em;text-transform:uppercase}

.log{border-left:2px solid var(--edge);margin:18px 0;padding-left:16px}
.log .entry{font-size:13px;color:var(--muted);margin-bottom:8px}
.log .entry b{color:var(--text);font-weight:600}

.comment{border-top:1px solid var(--edge);padding:12px 0}
.comment .who{color:var(--cyan);font-size:13px;margin-bottom:3px}

.empty{color:var(--muted);text-align:center;padding:50px 0;border:1px dashed var(--edge);border-radius:var(--radius)}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);display:grid;place-items:center;z-index:50}
.modal{background:var(--panel);border:1px solid var(--edge);border-radius:14px;padding:26px;width:min(520px,92vw)}
.banner{background:var(--panel-2);border:1px solid var(--amber-dim);border-radius:8px;padding:10px 14px;
  font-size:13px;color:var(--amber);margin-bottom:22px}
.soon{opacity:.6}

/* ── supergate dial loader — chevrons lock in sequence, kawoosh on ready ── */
.gate-loader{position:relative;width:136px;height:136px;margin:78px auto 56px}
.gate-loader .ring{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 50% 44%, #16222b, #0c1117 72%);
  border:1px solid #243640;
  box-shadow:inset 0 0 28px rgba(0,0,0,.72), 0 0 32px rgba(209,238,238,.10);}
.gate-loader .eh{position:absolute;inset:21px;border-radius:50%;
  background:radial-gradient(circle, rgba(120,196,225,0), transparent 70%);
  animation:gl-eh 2.7s ease-in-out infinite;}
.gate-loader i{position:absolute;top:50%;left:50%;width:13px;height:8px;margin:-4px 0 0 -6.5px;
  border-radius:2px;background:#23323c;
  transform:rotate(var(--a)) translateY(-55px);
  animation:gl-chev 2.7s ease-in-out infinite;animation-delay:var(--d);}
.gate-loader .lbl{position:absolute;left:50%;transform:translateX(-50%);top:150px;white-space:nowrap;
  font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
@keyframes gl-chev{0%,38%{background:#23323c;box-shadow:none}
  48%,66%{background:var(--amber);box-shadow:0 0 12px rgba(255,200,120,.85)}
  84%,100%{background:#23323c;box-shadow:none}}
@keyframes gl-eh{0%,60%{opacity:0}
  82%,100%{opacity:1;
    background:radial-gradient(circle,rgba(120,196,225,.42),rgba(43,108,255,.22) 55%,transparent 74%);
    box-shadow:0 0 48px rgba(120,196,225,.42)}}

/* ===== atmosphere + theming pass 2 ===== */
body::before{inset:-60px;animation:starDrift 150s ease-in-out infinite alternate}
@keyframes starDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-34px,-22px,0)}}

.vignette{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(130% 100% at 50% 26%, transparent 50%, rgba(0,0,0,.55) 100%)}

/* brand glyph → a slowly dialing gate ring */
.brand .glyph{font-size:0;position:relative;border:2px solid #2c3e48;
  background:radial-gradient(circle at 50% 50%, #11202a, #0a0f12);overflow:visible;
  box-shadow:0 0 16px rgba(255,200,120,.22)}
.brand .glyph::before{content:'';position:absolute;inset:-3px;border-radius:50%;
  background:conic-gradient(from 0deg, transparent 0 66%, rgba(255,200,120,.95) 82%, transparent 92%);
  -webkit-mask:radial-gradient(circle, transparent 10px, #000 11px);
          mask:radial-gradient(circle, transparent 10px, #000 11px);
  animation:dialSpin 7s linear infinite}
.brand .glyph::after{content:'';position:absolute;inset:8px;border-radius:50%;
  background:radial-gradient(circle, rgba(120,196,225,.7), rgba(43,108,255,.22) 60%, transparent);
  box-shadow:0 0 12px rgba(120,196,225,.4)}
@keyframes dialSpin{to{transform:rotate(360deg)}}

/* nav + page titles */
nav.tabs button.active{box-shadow:inset 0 -2px 0 var(--cyan);color:#fff}
main>h1::after{content:'';display:block;width:56px;height:2px;margin-top:12px;border-radius:2px;
  background:linear-gradient(90deg,var(--amber),transparent);box-shadow:0 0 12px rgba(255,200,120,.45)}

/* component glow */
.chip.open{box-shadow:0 0 12px rgba(255,200,120,.16)}
.chip.decided{box-shadow:0 0 12px rgba(111,207,142,.16)}
.chip.proposal{box-shadow:0 0 12px rgba(209,238,238,.12)}
.tally .for{box-shadow:0 0 9px rgba(111,207,142,.55)}
.tally .against{box-shadow:0 0 9px rgba(224,122,111,.5)}
.outcome{box-shadow:0 0 30px rgba(111,207,142,.08)}
.modal{box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 40px rgba(209,238,238,.05)}

/* footer seal */
.seal{max-width:920px;margin:30px auto 0;padding:22px 22px 60px;border-top:1px solid var(--edge);
  display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
  font-family:ui-monospace,monospace;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);opacity:.7}
.seal .chev{color:var(--amber)}

/* ── featured pullquote (homepage) ─────────────────────── */
.quote-hero{position:relative;margin:6px 0 32px;padding:28px 30px 22px;border-radius:14px;
  background:linear-gradient(180deg, rgba(18,26,31,.92), rgba(13,19,26,.92));
  border:1px solid var(--edge);border-left:3px solid var(--amber);
  box-shadow:0 16px 50px rgba(0,0,0,.45), 0 0 44px rgba(255,200,120,.05)}
.quote-hero .qmark{position:absolute;top:2px;left:16px;font-family:'Coolvetica',serif;font-size:62px;
  color:var(--amber);opacity:.32;line-height:1;pointer-events:none}
.quote-hero blockquote{margin:0 0 14px;padding-left:36px;
  font-family:'Coolvetica','Inter',sans-serif;font-size:1.5rem;line-height:1.42;
  color:#eaf4fb;letter-spacing:.01em;text-shadow:0 0 26px rgba(209,238,238,.12)}
.quote-hero .qby{padding-left:36px;font-family:ui-monospace,monospace;font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.quote-hero .qby b{color:var(--cyan)}
.quote-hero .qby a{margin-left:12px;color:var(--amber);border-bottom:1px solid rgba(255,200,120,.3);white-space:nowrap}
@media(max-width:640px){.quote-hero blockquote{font-size:1.2rem;padding-left:28px}.quote-hero .qby{padding-left:28px}}

/* ===== codex design vocabulary (ported, in-palette) ===== */
.term-bar{position:sticky;top:0;z-index:20;height:34px;display:flex;align-items:center;gap:14px;
  padding:0 22px;background:linear-gradient(180deg,rgba(6,10,17,.96),rgba(10,15,18,.72));
  border-bottom:1px solid var(--edge);backdrop-filter:blur(9px);
  font-family:ui-monospace,monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.term-bar .id{display:flex;align-items:center;gap:9px;font-family:'Coolvetica',sans-serif;letter-spacing:.12em;color:var(--text);font-size:12px}
.term-bar .id b{color:var(--amber)}
.term-bar .sep{width:1px;height:16px;background:var(--edge)}
.term-bar .status{display:flex;align-items:center;gap:7px;color:var(--cyan)}
header.top{top:34px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

.glyphs{display:flex;gap:5px;margin-left:auto}
.glyphs span{width:15px;height:20px;border:1px solid var(--edge);background:rgba(9,18,33,.5);
  clip-path:polygon(50% 0,100% 28%,100% 100%,0 100%,0 28%)}
.glyphs span.lock{background:var(--amber);border-color:var(--amber);box-shadow:0 0 12px rgba(255,200,120,.6)}

.kicker{display:flex;align-items:center;gap:13px;margin:2px 0 16px;
  font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--cyan)}
.kicker .ln{height:1px;width:46px;background:var(--cyan);opacity:.6}

.manifest{position:relative;margin:0 0 30px;border:1px solid var(--edge);border-radius:12px;
  background:linear-gradient(180deg,rgba(18,26,31,.7),rgba(10,15,18,.4));
  display:grid;grid-template-columns:repeat(5,1fr);box-shadow:0 12px 36px rgba(0,0,0,.34)}
.manifest .cell{padding:18px 12px;text-align:center;border-right:1px solid var(--edge)}
.manifest .cell:last-child{border-right:0}
.manifest .n{font-family:'Coolvetica',sans-serif;font-size:1.95rem;color:var(--cyan);line-height:1;
  text-shadow:0 0 20px rgba(209,238,238,.28)}
.manifest .k{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:8px;font-family:ui-monospace,monospace}
.manifest .bracket{position:absolute;width:13px;height:13px;border:1px solid var(--amber);opacity:.45}
.manifest .bracket.tl{top:7px;left:7px;border-right:0;border-bottom:0}
.manifest .bracket.tr{top:7px;right:7px;border-left:0;border-bottom:0}
.manifest .bracket.bl{bottom:7px;left:7px;border-right:0;border-top:0}
.manifest .bracket.br{bottom:7px;right:7px;border-left:0;border-top:0}
@media(max-width:640px){.manifest{grid-template-columns:repeat(3,1fr)}.manifest .cell:nth-child(3n){border-right:0}}

.sec-head{display:flex;align-items:baseline;gap:16px;margin:0 0 16px;flex-wrap:wrap}
.sec-head .tag{font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--amber)}
.sec-head h1{margin:0;font-size:2.1rem}
.sec-head .meta{margin-left:auto;font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* ===== codex pass 3: SG-1 glyphs, file-cards, quote brackets ===== */
@font-face{font-family:'StargateSG1';src:url('/fonts/stargate_sg1.ttf') format('truetype');font-display:swap}
.glyphs span{display:grid;place-items:center;font-family:'StargateSG1',monospace;font-size:11px;color:var(--cyan);opacity:.72}
.glyphs span.lock{color:#0a1320;opacity:1}

.quote-hero .bracket{position:absolute;width:14px;height:14px;border:1px solid var(--amber);opacity:.5}
.quote-hero .bracket.tl{top:9px;left:9px;border-right:0;border-bottom:0}
.quote-hero .bracket.tr{top:9px;right:9px;border-left:0;border-bottom:0}
.quote-hero .bracket.bl{bottom:9px;left:9px;border-right:0;border-top:0}
.quote-hero .bracket.br{bottom:9px;right:9px;border-left:0;border-top:0}

.files{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:680px){.files{grid-template-columns:1fr}}
.file{position:relative;border:1px solid var(--edge);border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(180deg,rgba(18,26,31,.97),rgba(13,19,26,.97));transition:.2s ease;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.file:hover{border-color:var(--amber);transform:translateY(-4px);box-shadow:0 20px 52px rgba(0,0,0,.5),0 0 34px rgba(255,200,120,.08)}
.file .thumb{height:130px;background-size:cover;background-position:center;position:relative;filter:saturate(.92) brightness(.82)}
.file .thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,19,26,0) 28%,rgba(18,26,31,.98) 100%)}
.file-body{padding:12px 18px 18px}
.file-top{display:flex;justify-content:space-between;align-items:center;margin-top:-24px;position:relative;z-index:1}
.file .arc{font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.12em;color:var(--amber);text-shadow:0 1px 6px rgba(0,0,0,.8)}
.file .cls{font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan)}
.file h3{margin:9px 0 6px;font-size:1.25rem}
.file .purpose{color:var(--text);font-size:14px;opacity:.86}
.file .meta{color:var(--muted);font-size:12px;margin-top:11px;display:flex;gap:12px;flex-wrap:wrap;font-family:ui-monospace,monospace;letter-spacing:.04em}