/* ===== TOKENS ===== */
:root {
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
  --text-hero: clamp(3.4rem, 0.5rem + 9vw, 9.5rem);

  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem;
  --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem; --space-32: 8rem;

  /* Cursed-official palette: ink black, bone, toner grey, certified gold, hazmat */
  --ink: #08080a;
  --ink-2: #0d0d10;
  --surface: #121215;
  --surface-2: #17171b;
  --border: #26262c;
  --border-bright: #3a3a42;
  --bone: #e8e4da;
  --bone-muted: #9a978f;
  --bone-faint: #5e5c57;
  --gold: #c8a24a;
  --gold-dim: #9a7d3a;
  --hazard: #d6402c;
  --hazard-dim: #9c3324;
  /* Real-brand accent: REALM CERTIFIED hot pink */
  --pink: #ec1a8d;
  --pink-dim: #a8186a;

  --radius-sm: 2px;
  --radius-md: 3px;
  --content-wide: 1240px;
  --content-default: 1040px;

  --font-display: 'Clash Display', 'Arial Narrow', sans-serif;
  --font-heavy: 'Cabinet Grotesk', 'Clash Display', sans-serif;
  --font-body: 'Satoshi', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --font-stamp: 'Special Elite', 'Courier New', monospace;
}

/* ===== BASE ===== */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html {
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; scroll-behavior:smooth; scroll-padding-top:5rem;
  overflow-x:hidden;
}
body {
  min-height:100dvh; line-height:1.6; font-family:var(--font-body);
  font-size:var(--text-base); color:var(--bone); background:var(--ink);
  overflow-x:hidden; position:relative;
}
img,svg,picture,video { display:block; max-width:100%; height:auto; }
ul[role='list'] { list-style:none; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; background:none; border:none; color:inherit; font:inherit; }
h1,h2,h3,h4 { line-height:1.02; text-wrap:balance; }
p { text-wrap:pretty; }
::selection { background:var(--gold); color:var(--ink); }
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
a,button { transition:color .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease, transform .2s ease; }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ===== TEXTURE / GRAIN / SCANLINES ===== */
.grain {
  position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.scanlines {
  position:fixed; inset:0; z-index:9997; pointer-events:none; opacity:.4;
  background:repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,0,0,.18) 3px 4px);
}
body::before {
  content:''; position:fixed; inset:0; z-index:-1;
  background:
    radial-gradient(ellipse 80% 60% at 50% -10%, rgba(200,162,74,.05), transparent 60%),
    url('assets/texture.png');
  background-size:cover; background-attachment:fixed; opacity:.5;
}

/* ===== HEADER ===== */
.site-header {
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-4);
  padding:var(--space-4) clamp(var(--space-4), 4vw, var(--space-12));
  background:linear-gradient(to bottom, rgba(8,8,10,.92), rgba(8,8,10,.55) 70%, transparent);
  backdrop-filter:blur(8px); transition:transform .35s cubic-bezier(.16,1,.3,1), background .3s;
  border-bottom:1px solid transparent;
}
.site-header.scrolled { background:rgba(8,8,10,.96); border-bottom-color:var(--border); backdrop-filter:blur(14px); }
.site-header.hidden { transform:translateY(-105%); }
.brand { display:flex; align-items:center; gap:var(--space-3); color:var(--bone); flex:none; }
.brand-mark { color:var(--gold); }
.brand-logo { height:62px; width:auto; display:block; filter:drop-shadow(0 1px 5px rgba(0,0,0,.65)); transition:transform .25s ease; }
.brand:hover .brand-logo { transform:scale(1.05) rotate(-1deg); }
.brand-name { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-sm); letter-spacing:.14em; white-space:nowrap; }
/* the crown logo reads 'REALM CERTIFIED' — show the wordmark only when there's room */
@media (max-width:1180px){ .brand-name{ display:none; } }
@media (max-width:560px){ .brand-logo{ height:42px; } }
.site-nav { display:flex; gap:clamp(var(--space-3), 1.6vw, var(--space-6)); flex-wrap:nowrap; }
.site-nav a {
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase;
  color:var(--bone-muted); position:relative; padding-block:var(--space-1);
}
.site-nav a::after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold); transition:width .25s ease; }
.site-nav a:hover { color:var(--bone); }
.site-nav a:hover::after { width:100%; }
.cert-chip {
  display:inline-flex; align-items:center; gap:var(--space-2);
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em;
  color:var(--gold); border:1px solid var(--gold-dim); padding:var(--space-1) var(--space-3); border-radius:var(--radius-sm);
  user-select:none;
}
.cert-chip:hover { background:var(--gold); color:var(--ink); }
.cert-chip.armed { border-color:var(--hazard); color:var(--hazard); animation:certpulse .4s ease; }
@keyframes certpulse { 50%{ transform:scale(1.08); } }
@media (max-width:860px){ .site-nav{display:none;} }
@media (max-width:560px){ .cert-chip{ font-size:10px; } }
/* icon-only certified badge on small mobile so the header never overflows */
@media (max-width:480px){ .cert-chip-label{ display:none; } .cert-chip{ padding:var(--space-2); } }

/* ===== HERO ===== */
.hero { position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.hero-video {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 35%;
  filter:contrast(1.05) brightness(.82) saturate(.9); z-index:0;
}
.hero-bg {
  position:absolute; inset:0; background-size:cover; background-position:center 35%;
  filter:contrast(1.05) brightness(.82) saturate(.9); transform:scale(1.04); z-index:-1;
}
.vhs-overlay {
  position:absolute; inset:0; z-index:2; pointer-events:none; mix-blend-mode:overlay; opacity:.5;
  background:
    repeating-linear-gradient(0deg, transparent 0 2px, rgba(0,0,0,.25) 2px 3px),
    linear-gradient(90deg, rgba(255,0,80,.04), transparent 8%, transparent 92%, rgba(0,180,255,.04));
  animation:vhsflicker 5s steps(60) infinite;
}
@keyframes vhsflicker { 0%,96%,100%{opacity:.5;} 97%{opacity:.32;} 98%{opacity:.6;} }
.hero-vignette {
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(to top, var(--ink) 2%, rgba(8,8,10,.35) 38%, rgba(8,8,10,.55) 100%),
    radial-gradient(ellipse 90% 70% at 50% 60%, transparent 30%, rgba(8,8,10,.7) 100%);
}
.hero-stamp {
  position:absolute; top:clamp(5rem,12vh,9rem); right:clamp(1rem,5vw,5rem); z-index:4;
  color:var(--gold); opacity:.55; mix-blend-mode:screen;
  animation:slowspin 60s linear infinite;
}
@keyframes slowspin { to { transform:rotate(360deg); } }
.hero-inner { position:relative; z-index:5; padding:clamp(var(--space-8),6vw,var(--space-24)) clamp(var(--space-4),5vw,var(--space-16)); max-width:var(--content-wide); width:100%; }
.kicker {
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold); margin-bottom:var(--space-5); padding-left:var(--space-3); border-left:2px solid var(--hazard);
}
.hero-title {
  font-family:var(--font-heavy); font-weight:800; font-size:var(--text-hero); line-height:.86;
  letter-spacing:-.01em; text-transform:uppercase; color:var(--bone);
  text-shadow:0 6px 40px rgba(0,0,0,.7);
}
.hero-tag { font-family:var(--font-display); font-size:var(--text-lg); color:var(--bone-muted); margin-top:var(--space-6); max-width:34ch; line-height:1.4; }
.hero-meta { display:flex; align-items:center; gap:var(--space-4); margin-top:var(--space-6); font-family:var(--font-mono); font-size:var(--text-sm); color:var(--bone-faint); flex-wrap:wrap; }
.hot-mutt {
  color:var(--ink); background:var(--gold); padding:var(--space-1) var(--space-3); border-radius:var(--radius-sm);
  font-weight:700; letter-spacing:.16em; font-size:var(--text-xs);
}
.divider { color:var(--gold-dim); }
.scroll-hint {
  display:inline-flex; align-items:center; gap:var(--space-3); margin-top:var(--space-10);
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.18em; color:var(--bone);
  border:1px solid var(--border-bright); padding:var(--space-3) var(--space-5); border-radius:var(--radius-sm);
}
.scroll-hint svg { animation:bob 1.8s ease-in-out infinite; }
.scroll-hint:hover { background:var(--gold); color:var(--ink); border-color:var(--gold); }
.scroll-hint:hover svg { animation:none; }
@keyframes bob { 0%,100%{transform:translateY(0);} 50%{transform:translateY(4px);} }

/* ===== MARQUEE ===== */
.marquee { overflow:hidden; border-block:1px solid var(--border); background:var(--ink-2); padding-block:var(--space-3); white-space:nowrap; }
.marquee-track { display:inline-flex; animation:scroll 32s linear infinite; }
.marquee-track span { font-family:var(--font-mono); font-size:var(--text-sm); letter-spacing:.18em; color:var(--gold-dim); padding-right:var(--space-4); }
@keyframes scroll { to { transform:translateX(-50%); } }

/* ===== SECTIONS ===== */
.section { padding:clamp(var(--space-12),7vw,var(--space-24)) clamp(var(--space-4),5vw,var(--space-16)); max-width:var(--content-wide); margin-inline:auto; }
.section-head { max-width:60ch; margin-bottom:clamp(var(--space-10),6vw,var(--space-16)); }
.section-no { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.24em; color:var(--hazard); margin-bottom:var(--space-4); }
.section-title { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-2xl); text-transform:uppercase; letter-spacing:-.01em; }
.section-lede { font-family:var(--font-display); font-size:var(--text-base); color:var(--bone-muted); margin-top:var(--space-5); line-height:1.55; }

/* ===== CODEX ===== */
.codex-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:var(--space-5); }
.term {
  position:relative; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:var(--space-6); display:flex; flex-direction:column; gap:var(--space-3);
  overflow:hidden;
}
.term::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--gold-dim); opacity:.5; transition:opacity .25s, width .25s; }
.term:hover { border-color:var(--border-bright); background:var(--surface-2); }
.term:hover::before { opacity:1; width:4px; }
.term-head { display:flex; align-items:baseline; gap:var(--space-3); }
.term-tag { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--gold); flex-shrink:0; }
.term h3 { font-family:var(--font-display); font-weight:600; font-size:var(--text-lg); color:var(--bone); }
.term p { font-size:var(--text-sm); color:var(--bone-muted); line-height:1.55; }
.term-status { font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; margin-top:auto; padding-top:var(--space-2); }
.status-active { color:var(--gold); }
.status-sealed { color:var(--bone-faint); }
.status-redacted { color:var(--hazard); }
.crew-list { list-style:none; display:flex; flex-direction:column; gap:var(--space-2); margin-top:var(--space-1); }
.crew-list li { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--bone-muted); }
.crew-list span { color:var(--bone); font-weight:700; }

/* ===== TRANSMISSIONS ===== */
.transmissions { background:var(--ink-2); max-width:none; position:relative; overflow:hidden; }
.transmissions > * { max-width:var(--content-wide); margin-inline:auto; position:relative; z-index:2; }
/* muted background video loops */
.trans-vfx { position:absolute; inset:0; z-index:0; display:grid; grid-template-columns:repeat(3,1fr); gap:0; pointer-events:none; }
.trans-vfx video { width:100%; height:100%; object-fit:cover; opacity:.10; filter:grayscale(.4) contrast(1.05); mix-blend-mode:luminosity; }
.transmissions::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(8,8,10,.55) 0%, rgba(8,8,10,.86) 70%, var(--ink-2) 100%); }
@media (max-width:560px){ .trans-vfx{ grid-template-columns:1fr 1fr; } .trans-vfx video:nth-child(3){ display:none; } }
.trans-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:var(--space-5); }
.trans-card {
  border:1px solid var(--border); border-radius:var(--radius-md); padding:var(--space-6);
  background:var(--surface); display:flex; flex-direction:column; gap:var(--space-3); min-height:200px;
  position:relative; transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.trans-card:hover { border-color:var(--border-bright); }
.trans-card.feature { grid-column:span 2; background:linear-gradient(135deg,var(--surface-2),var(--surface)); border-color:var(--gold-dim); }
@media (max-width:520px){ .trans-card.feature{ grid-column:auto; } }
.trans-card.playing { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold), 0 6px 30px rgba(200,162,74,.18); }
/* featured video transmission */
.trans-card.video-feature { grid-column:1 / -1; background:linear-gradient(135deg,var(--surface-2),var(--surface)); border-color:var(--gold-dim); gap:var(--space-3); }
.trans-card.video-feature .trans-meta { color:var(--pink); }
.trans-card.video-feature h3 { font-size:var(--text-xl); }
.vid-wrap { position:relative; margin-top:var(--space-3); border-radius:var(--radius-sm); overflow:hidden; background:#000; border:1px solid var(--border); }
.vid-wrap video { display:block; width:100%; height:auto; max-height:520px; background:#000; }
.vid-play {
  position:absolute; inset:0; margin:auto; width:auto; height:auto;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  background:linear-gradient(180deg, rgba(8,8,10,.15), rgba(8,8,10,.55));
  border:none; cursor:pointer; color:var(--bone); transition:opacity .25s ease, background .25s ease;
}
.vid-play > svg { background:var(--gold); color:var(--ink); border-radius:50%; padding:14px; box-shadow:0 6px 24px rgba(0,0,0,.5); transition:transform .15s ease, background .2s ease; }
.vid-play:hover > svg { transform:scale(1.06); background:var(--bone); }
.vid-play-label { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.18em; color:var(--bone); text-shadow:0 1px 6px rgba(0,0,0,.8); }
.vid-wrap.playing .vid-play { opacity:0; pointer-events:none; }
@media (max-width:560px){ .vid-wrap video { max-height:340px; } }
.trans-meta { display:flex; align-items:center; gap:var(--space-2); font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.16em; color:var(--hazard); }
.rec-dot { width:8px; height:8px; border-radius:50%; background:var(--hazard); animation:pulse 1.4s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:.25;} }
.trans-no,.trans-len { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--gold-dim); letter-spacing:.1em; }
.trans-card h3 { font-family:var(--font-display); font-weight:600; font-size:var(--text-lg); }
.trans-card.feature h3 { font-size:var(--text-xl); }
.trans-card p { font-size:var(--text-sm); color:var(--bone-muted); }
.trans-len { margin-top:auto; }
/* play buttons (feature = wide labelled, .small = compact circle) */
.play-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); align-self:flex-start; margin-top:auto;
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em; color:var(--ink);
  background:var(--gold); padding:var(--space-3) var(--space-5); border-radius:var(--radius-sm); font-weight:700;
  border:none; cursor:pointer; transition:background .2s ease, transform .15s ease, box-shadow .2s ease;
}
.play-btn:hover { background:var(--bone); transform:translateY(-1px); }
.play-btn.small { padding:0; width:40px; height:40px; border-radius:50%; align-self:flex-start; box-shadow:0 2px 10px rgba(0,0,0,.35); }
.play-btn .ic-pause { display:none; }
.trans-card.playing .play-btn .ic-play { display:none; }
.trans-card.playing .play-btn .ic-pause { display:inline-block; }
.trans-card.playing .play-btn { background:var(--bone); box-shadow:0 0 14px rgba(200,162,74,.4); }
.play-label { white-space:nowrap; }

/* ===== BONEYARD ===== */
.boneyard { max-width:none; padding-inline:0; }
.boneyard-split { display:grid; grid-template-columns:1.1fr 1fr; align-items:stretch; min-height:80vh; }
.boneyard-img { position:relative; overflow:hidden; }
.boneyard-img img { width:100%; height:100%; object-fit:cover; filter:contrast(1.1) brightness(.85); }
.evidence-tag {
  position:absolute; bottom:var(--space-5); left:var(--space-5); font-family:var(--font-stamp);
  font-size:var(--text-xs); letter-spacing:.1em; color:var(--bone); background:rgba(8,8,10,.8);
  padding:var(--space-2) var(--space-3); border:1px solid var(--border-bright);
}
.boneyard-text { padding:clamp(var(--space-10),7vw,var(--space-24)) clamp(var(--space-6),5vw,var(--space-16)); display:flex; flex-direction:column; justify-content:center; gap:var(--space-5); background:var(--surface); border-left:1px solid var(--border); }
.boneyard-text p { color:var(--bone-muted); font-size:var(--text-base); }
.notice { border:1px dashed var(--hazard-dim); padding:var(--space-5); border-radius:var(--radius-sm); background:rgba(214,64,44,.05); margin-top:var(--space-3); }
.notice-head { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.16em; color:var(--hazard); display:block; margin-bottom:var(--space-2); }
.notice p { font-size:var(--text-sm); color:var(--bone); }
.notice strong { color:var(--gold); }
@media (max-width:820px){ .boneyard-split{grid-template-columns:1fr;} .boneyard-img{min-height:54vh;} .boneyard-text{border-left:none; border-top:1px solid var(--border);} }

/* ===== SUPPLY ===== */
.supply-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:var(--space-6); align-items:start; }
.hero-card { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; background:var(--surface); }
.supply-img { overflow:hidden; }
.supply-img img { width:100%; height:100%; object-fit:cover; min-height:340px; filter:brightness(.92); transition:transform .6s cubic-bezier(.16,1,.3,1); }
.hero-card:hover .supply-img img { transform:scale(1.04); }
.supply-info { padding:var(--space-8) var(--space-6); display:flex; flex-direction:column; justify-content:center; gap:var(--space-3); }
.drop-tag { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em; color:var(--hazard); }
.supply-info h3 { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-xl); text-transform:uppercase; }
.supply-info p { font-size:var(--text-sm); color:var(--bone-muted); }
.price { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--gold); letter-spacing:.12em; margin-top:var(--space-2); }
.supply-list { display:flex; flex-direction:column; gap:var(--space-3); }
.supply-item { border:1px solid var(--border); border-radius:var(--radius-sm); padding:var(--space-5); background:var(--surface); transition:border-color .25s, transform .25s; }
.supply-item:hover { border-color:var(--gold-dim); transform:translateX(4px); }
.supply-item h4 { font-family:var(--font-display); font-weight:600; font-size:var(--text-base); }
.supply-item p { font-size:var(--text-sm); color:var(--bone-muted); margin-top:var(--space-1); }
@media (max-width:900px){ .supply-grid{grid-template-columns:1fr;} }
@media (max-width:560px){ .hero-card{grid-template-columns:1fr;} .supply-img img{min-height:280px;} }

/* ===== ENTER / CTA ===== */
.enter { text-align:center; }
.enter-inner { max-width:46ch; margin-inline:auto; display:flex; flex-direction:column; align-items:center; gap:var(--space-5); }
.enter-mark { color:var(--gold); animation:slowspin 50s linear infinite; }
.enter h2 { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-2xl); text-transform:uppercase; }
.enter p { color:var(--bone-muted); font-size:var(--text-base); }
.enter-mutt { font-family:var(--font-mono); letter-spacing:.3em; color:var(--gold) !important; font-size:var(--text-lg) !important; margin-top:var(--space-3); }

/* ===== FOOTER ===== */
.site-footer { border-top:1px solid var(--border); padding:clamp(var(--space-10),6vw,var(--space-16)) clamp(var(--space-4),5vw,var(--space-16)); background:var(--ink-2); }
.footer-grid { display:flex; justify-content:space-between; gap:var(--space-8); flex-wrap:wrap; max-width:var(--content-wide); margin-inline:auto; }
.footer-grid .brand-name { font-family:var(--font-heavy); font-weight:800; letter-spacing:.18em; font-size:var(--text-lg); color:var(--bone); }
.foot-fine { font-size:var(--text-sm); color:var(--bone-faint); max-width:36ch; margin-top:var(--space-2); }
.foot-stamps { display:flex; flex-direction:column; gap:var(--space-2); text-align:right; }
.foot-stamps span { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em; color:var(--gold-dim); }
.footer-base { display:flex; justify-content:space-between; gap:var(--space-4); flex-wrap:wrap; max-width:var(--content-wide); margin:var(--space-10) auto 0; padding-top:var(--space-5); border-top:1px solid var(--border); font-family:var(--font-mono); font-size:var(--text-xs); color:var(--bone-faint); letter-spacing:.08em; }
.redacted-foot { color:var(--bone-faint); }

/* ===== REVEAL ANIMATION ===== */
[data-reveal] { opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
[data-reveal].in { opacity:1; transform:none; }

/* ===== QUIZ ===== */
.quiz { max-width:var(--content-default); }
.quiz-shell { border:1px solid var(--border); border-radius:var(--radius-md); background:linear-gradient(160deg,var(--surface-2),var(--surface)); padding:clamp(var(--space-6),4vw,var(--space-12)); position:relative; overflow:hidden; }
.quiz-shell::before { content:'CONFIDENTIAL'; position:absolute; bottom:34px; right:-52px; transform:rotate(-34deg); font-family:var(--font-stamp); font-size:var(--text-xs); letter-spacing:.2em; color:var(--hazard-dim); opacity:.28; border:2px solid var(--hazard-dim); padding:2px 60px; pointer-events:none; z-index:0; }
.quiz-progress, .quiz-stage { position:relative; z-index:1; }
.quiz-progress { display:flex; align-items:center; gap:var(--space-4); margin-bottom:var(--space-8); }
.qp-bar { flex:1; height:4px; background:var(--ink); border:1px solid var(--border); border-radius:var(--radius-full); overflow:hidden; }
.qp-fill { display:block; height:100%; width:0%; background:var(--gold); transition:width .5s cubic-bezier(.16,1,.3,1); }
.qp-label { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em; color:var(--gold-dim); flex-shrink:0; }
.quiz-stage { position:relative; min-height:300px; }
.quiz-card { position:absolute; inset:0; opacity:0; transform:translateY(16px); pointer-events:none; transition:opacity .45s ease, transform .45s ease; display:flex; flex-direction:column; gap:var(--space-4); }
.quiz-card.active { opacity:1; transform:none; pointer-events:auto; position:relative; }
.q-no { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.18em; color:var(--hazard); }
.quiz-card h3 { font-family:var(--font-display); font-weight:600; font-size:var(--text-xl); color:var(--bone); max-width:24ch; }
.q-options { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3); margin-top:var(--space-2); }
.q-opt {
  text-align:left; font-family:var(--font-mono); font-size:var(--text-sm); letter-spacing:.04em; color:var(--bone);
  border:1px solid var(--border-bright); border-radius:var(--radius-sm); padding:var(--space-4) var(--space-5);
  background:var(--ink-2); position:relative;
}
.q-opt::before { content:'\203A'; color:var(--gold-dim); margin-right:var(--space-3); transition:margin .2s; }
.q-opt:hover { border-color:var(--gold); color:var(--gold); background:rgba(200,162,74,.06); }
.q-opt:hover::before { margin-right:var(--space-4); }
@media (max-width:560px){ .q-options{grid-template-columns:1fr;} }

.quiz-result { text-align:center; align-items:center; }
.result-stamp { color:var(--gold); animation:stampin .6s cubic-bezier(.16,1,.3,1); }
@keyframes stampin { 0%{ transform:scale(2) rotate(-12deg); opacity:0; } 60%{ transform:scale(.92) rotate(3deg); opacity:1; } 100%{ transform:none; } }
.quiz-result h3 { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-2xl); text-transform:uppercase; color:var(--gold); max-width:none; }
.quiz-result p { color:var(--bone-muted); max-width:46ch; }
.result-actions { display:flex; align-items:center; gap:var(--space-5); margin-top:var(--space-4); flex-wrap:wrap; justify-content:center; }
#quizRestart { flex:none; }
.result-id { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.12em; color:var(--bone-faint); }

/* ===== SECRET HINT (footer) ===== */
.redacted-foot { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.08em; color:var(--bone-faint); cursor:pointer; transition:color .2s, letter-spacing .2s; }
.redacted-foot:hover { color:var(--hazard); letter-spacing:.14em; }

/* ===== HIDDEN PAGE / SUB-LEVEL ===== */
.sublevel { position:fixed; inset:0; z-index:9999; background:#040405; display:flex; align-items:center; justify-content:center; overflow-y:auto; padding:clamp(var(--space-12),8vw,var(--space-24)) clamp(var(--space-4),5vw,var(--space-16)); animation:subfade .6s ease; }
.sublevel[hidden] { display:none; }
@keyframes subfade { from{opacity:0;} to{opacity:1;} }
.sublevel-grain { position:absolute; inset:0; pointer-events:none; opacity:.06; mix-blend-mode:overlay; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.sublevel::after { content:''; position:absolute; inset:0; pointer-events:none; background:repeating-linear-gradient(0deg, transparent 0 2px, rgba(0,0,0,.4) 2px 3px); opacity:.5; }
.sublevel-close { position:fixed; top:var(--space-5); right:var(--space-5); z-index:2; font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em; color:var(--hazard); border:1px solid var(--hazard-dim); padding:var(--space-2) var(--space-4); border-radius:var(--radius-sm); }
.sublevel-close:hover { background:var(--hazard); color:var(--ink); border-color:var(--hazard); }
.sublevel-inner { position:relative; z-index:1; max-width:640px; width:100%; }
.sub-kicker { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.18em; color:var(--hazard); margin-bottom:var(--space-5); }
.sublevel h2 { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-3xl); line-height:.9; text-transform:uppercase; color:var(--bone); text-shadow:2px 0 var(--hazard-dim), -2px 0 rgba(0,180,255,.4); }
.sub-body { color:var(--bone-muted); margin-top:var(--space-6); font-size:var(--text-base); max-width:52ch; }
.sub-files { display:flex; flex-direction:column; gap:var(--space-3); margin-top:var(--space-10); }
.sub-file { display:flex; gap:var(--space-4); align-items:baseline; border:1px solid var(--border); border-radius:var(--radius-sm); padding:var(--space-4) var(--space-5); background:var(--ink-2); }
.sub-file span { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--hazard); flex-shrink:0; letter-spacing:.1em; }
.sub-file p { font-size:var(--text-sm); color:var(--bone-muted); }
.sub-file em { color:var(--bone-faint); font-style:italic; }
.sub-file.revealed { border-color:var(--gold-dim); background:rgba(200,162,74,.05); }
.sub-file.revealed span { color:var(--gold); }
.sub-file.revealed p { color:var(--bone); }
.sub-file.revealed strong { color:var(--gold); }
.sub-mutt { font-family:var(--font-mono); letter-spacing:.28em; color:var(--gold); margin-top:var(--space-10); font-size:var(--text-base); }
.sub-foot { display:block; font-family:var(--font-mono); font-size:var(--text-xs); color:var(--bone-faint); margin-top:var(--space-4); letter-spacing:.06em; }

/* ===== AUDIO TOGGLE (header) ===== */
.audio-toggle {
  display:inline-flex; align-items:center; gap:var(--space-2);
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em;
  color:var(--bone-muted); border:1px solid var(--border-bright); padding:var(--space-1) var(--space-3); border-radius:var(--radius-sm);
  transition:color .2s, border-color .2s;
}
.audio-toggle:hover { color:var(--bone); border-color:var(--bone-faint); }
.audio-toggle .audio-on { display:none; }
.audio-toggle[aria-pressed="true"] { color:var(--gold); border-color:var(--gold-dim); }
.audio-toggle[aria-pressed="true"] .audio-on { display:block; }
.audio-toggle[aria-pressed="true"] .audio-off { display:none; }
.audio-toggle[aria-pressed="true"] .audio-on path { animation:audiopulse 2.4s ease-in-out infinite; }
@keyframes audiopulse { 0%,100%{ opacity:.55; } 50%{ opacity:1; } }
@media (max-width:680px){ .audio-toggle .audio-label{ display:none; } }

/* ===== OPERATIVES ===== */
.ops-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-5); }
.op-card {
  display:flex; gap:var(--space-5); align-items:stretch;
  border:1px solid var(--border); border-radius:var(--radius-md);
  background:linear-gradient(150deg,var(--surface-2),var(--surface)); padding:var(--space-5);
  transition:border-color .3s, transform .3s;
}
.op-card:hover { border-color:var(--border-bright); transform:translateY(-3px); }
/* ===== DOSSIER PHOTO PANEL (works with or without a real photo) ===== */
.op-photo {
  flex:none; width:128px; border-radius:var(--radius-sm); overflow:hidden; position:relative;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(200,162,74,.07), transparent 60%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.018) 0 1px, transparent 1px 3px),
    linear-gradient(160deg,#141417,#0b0b0d);
  border:1px solid var(--border);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:var(--space-3) var(--space-2);
}
/* corner ticks for the evidence-panel feel */
.op-photo::after {
  content:''; position:absolute; inset:6px; border:1px solid rgba(200,162,74,.16); border-radius:3px; pointer-events:none;
}
.op-redact { display:none; }
/* placeholder = stylized case-file glyph instead of a broken/blank box */
.op-photo:not(.has-img) .op-glyph {
  font-size:34px; line-height:1; color:var(--gold); opacity:.5; margin-bottom:var(--space-2);
}
.op-photo:not(.has-img) .op-casefile {
  font-family:var(--font-mono); font-size:8px; letter-spacing:.18em; color:var(--bone-faint); line-height:1.5;
}
.op-photo:not(.has-img) .op-casefile b { color:var(--gold-dim); font-weight:500; }
.op-photo:not(.has-img) .op-noimg {
  font-family:var(--font-mono); font-size:7px; letter-spacing:.2em; color:var(--hazard-dim);
  margin-top:var(--space-2); padding-top:6px; border-top:1px dashed rgba(214,64,44,.3); display:block; width:80%;
}
/* recovered evidence photo — visible, lightly graded, with a corner caption */
.op-photo.has-img { position:relative; overflow:hidden; background:#0c0c0e; }
.op-photo.has-img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 28%; filter:contrast(1.06) saturate(.9) brightness(1.02); transition:filter .35s ease, transform .45s cubic-bezier(.16,1,.3,1); }
.op-card:hover .op-photo.has-img img { filter:contrast(1.04) saturate(1) brightness(1.06); transform:scale(1.04); }
.op-photo.has-img::before { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,8,10,0) 45%, rgba(8,8,10,.82) 100%); z-index:1; pointer-events:none; }
.op-photo.has-img .op-redact { display:block; position:absolute; left:0; right:0; bottom:6px; z-index:3; transform:none; font-size:8px; letter-spacing:.18em; color:var(--gold); opacity:.92; text-align:center; }
.op-photo.has-img::after { opacity:.5; z-index:2; }
.op-body { display:flex; flex-direction:column; gap:var(--space-2); position:relative; }
.op-new {
  position:absolute; top:0; right:0;
  font-family:var(--font-mono); font-size:8px; letter-spacing:.18em; color:var(--ink);
  background:var(--gold); padding:3px 7px; border-radius:3px; line-height:1;
  box-shadow:0 0 0 1px rgba(200,162,74,.4), 0 0 14px rgba(200,162,74,.25);
  animation:newpulse 2.6s ease-in-out infinite;
}
@keyframes newpulse { 0%,100%{ box-shadow:0 0 0 1px rgba(200,162,74,.4), 0 0 14px rgba(200,162,74,.18);} 50%{ box-shadow:0 0 0 1px rgba(200,162,74,.6), 0 0 18px rgba(200,162,74,.4);} }
.op-id { font-family:var(--font-mono); font-size:11px; letter-spacing:.16em; color:var(--hazard); }
.op-card h3 { font-family:var(--font-heavy); font-weight:800; font-size:var(--text-lg); color:var(--bone); letter-spacing:.01em; }
.op-role { font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; color:var(--gold-dim); }
.op-note { font-size:var(--text-sm); color:var(--bone-muted); line-height:1.55; }
.op-status { font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; margin-top:auto; padding-top:var(--space-2); }
@media (max-width:760px){ .ops-grid{ grid-template-columns:1fr; } }
@media (max-width:440px){ .op-card{ flex-direction:column; } .op-photo{ width:100%; min-height:200px; } }

/* ===== REALM HQ ACCESS CARD ===== */
.idcard-wrap { margin-top:var(--space-12); display:flex; flex-direction:column; align-items:center; gap:var(--space-4); }
.idcard-kicker { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.24em; color:var(--hazard); text-transform:uppercase; }
.idcard {
  width:min(440px,100%); border-radius:16px; overflow:hidden;
  background:linear-gradient(158deg,#1a1a1f 0%,#101013 60%,#0c0c0e 100%);
  border:1px solid var(--border-bright);
  box-shadow:0 24px 60px -20px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.05);
  position:relative;
}
.idcard::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0 1px,transparent 1px 3px); pointer-events:none; z-index:4; }
.idcard::after { content:''; position:absolute; top:-60%; left:-30%; width:60%; height:220%; transform:rotate(18deg); background:linear-gradient(90deg,transparent,rgba(236,26,141,.06),rgba(200,162,74,.08),transparent); pointer-events:none; z-index:3; }
.idcard-strip {
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3);
  padding:12px var(--space-5); background:linear-gradient(90deg,var(--pink-dim),var(--pink) 60%,#c8156f);
  position:relative; z-index:2;
}
.idcard-org { font-family:var(--font-display); font-weight:800; font-size:1.15rem; letter-spacing:.06em; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.5); }
.idcard-cls { font-family:var(--font-mono); font-size:9px; letter-spacing:.14em; color:rgba(255,255,255,.92); text-align:right; }
.idcard-body { display:flex; gap:var(--space-4); padding:var(--space-5); position:relative; z-index:2; }
.idcard-photo { flex:none; width:120px; aspect-ratio:6/7; border-radius:8px; overflow:hidden; border:1px solid var(--border-bright); position:relative; background:#0c0c0e; }
.idcard-photo img { width:100%; height:100%; object-fit:cover; object-position:center 18%; filter:contrast(1.05) saturate(.95); }
.idcard-photo-tag { position:absolute; left:0; right:0; bottom:0; font-family:var(--font-mono); font-size:7px; letter-spacing:.12em; text-align:center; color:var(--ink); background:var(--gold); padding:2px 0; }
.idcard-fields { flex:1; min-width:0; display:flex; flex-direction:column; gap:7px; }
.idc-row { display:flex; flex-direction:column; gap:1px; }
.idc-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.idc-k { font-family:var(--font-mono); font-size:8px; letter-spacing:.18em; color:var(--bone-faint); text-transform:uppercase; }
.idc-v { font-family:var(--font-mono); font-size:13px; letter-spacing:.04em; color:var(--bone); line-height:1.2; }
.idc-name { font-family:var(--font-display); font-weight:800; font-size:1.4rem; letter-spacing:.04em; color:#fff; }
.idc-pink { color:var(--pink); font-weight:700; }
.idc-active { color:var(--gold); }
.idcard-barcode { display:flex; align-items:flex-end; gap:2px; height:34px; margin-top:4px; position:relative; }
.idcard-barcode span { flex:1; background:var(--bone); height:100%; opacity:.9; }
.idcard-barcode span:nth-child(2n){ height:78%; } .idcard-barcode span:nth-child(3n){ height:60%; opacity:.7; } .idcard-barcode span:nth-child(5n){ height:90%; } .idcard-barcode span:nth-child(7n){ height:50%; }
.idcard-barcode em { position:absolute; right:0; bottom:-14px; font-family:var(--font-mono); font-size:8px; letter-spacing:.1em; color:var(--bone-faint); font-style:normal; }
.idcard-foot {
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3);
  padding:10px var(--space-5); border-top:1px solid var(--border);
  background:rgba(0,0,0,.35); position:relative; z-index:2;
  font-family:var(--font-mono); font-size:8px; letter-spacing:.1em; color:var(--bone-faint);
}
.idcard-foot-mark { color:var(--gold); letter-spacing:.14em; white-space:nowrap; }
.idcard-note { max-width:440px; text-align:center; font-family:var(--font-mono); font-size:var(--text-xs); color:var(--bone-faint); line-height:1.6; letter-spacing:.02em; }
@media (max-width:440px){
  .idcard-body{ flex-direction:column; align-items:center; text-align:center; }
  .idcard-photo{ width:150px; }
  .idcard-fields{ width:100%; }
  .idc-row{ align-items:center; } .idc-grid2{ justify-items:center; }
  .idcard-barcode em{ position:static; display:block; text-align:center; margin-top:4px; }
}

/* ===== CERTIFICATE GENERATOR ===== */
.certgen { max-width:var(--content-wide); }
.certgen-shell {
  display:grid; grid-template-columns:340px 1fr; gap:var(--space-8); align-items:start;
  border:1px solid var(--border); border-radius:var(--radius-md);
  background:linear-gradient(160deg,var(--surface-2),var(--surface)); padding:clamp(var(--space-6),4vw,var(--space-10));
}
.certgen-controls { display:flex; flex-direction:column; gap:var(--space-5); }
.cg-field { display:flex; flex-direction:column; gap:var(--space-2); }
.cg-label { font-family:var(--font-mono); font-size:11px; letter-spacing:.16em; color:var(--gold-dim); }
.cg-field input, .cg-field select {
  font-family:var(--font-mono); font-size:var(--text-sm); letter-spacing:.04em; color:var(--bone);
  background:var(--ink); border:1px solid var(--border-bright); border-radius:var(--radius-sm);
  padding:var(--space-3) var(--space-4); width:100%; transition:border-color .2s;
}
.cg-field input:focus, .cg-field select:focus { outline:none; border-color:var(--gold); }
.cg-field input::placeholder { color:var(--bone-faint); }
.cg-field select { appearance:none; cursor:pointer; background-image:linear-gradient(45deg,transparent 50%,var(--gold-dim) 50%),linear-gradient(135deg,var(--gold-dim) 50%,transparent 50%); background-position:calc(100% - 18px) center,calc(100% - 13px) center; background-size:5px 5px,5px 5px; background-repeat:no-repeat; }
.cg-actions { display:flex; gap:var(--space-3); flex-wrap:wrap; }
.cg-btn {
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em;
  color:var(--bone); border:1px solid var(--border-bright); border-radius:var(--radius-sm);
  padding:var(--space-3) var(--space-5); transition:all .2s;
}
.cg-btn:hover:not(:disabled) { border-color:var(--bone-faint); }
.cg-btn.primary { color:var(--ink); background:var(--gold); border-color:var(--gold); }
.cg-btn.primary:hover { background:var(--bone); border-color:var(--bone); }
.cg-btn:disabled { opacity:.4; cursor:not-allowed; }
.cg-fine { font-family:var(--font-mono); font-size:11px; letter-spacing:.04em; color:var(--bone-faint); line-height:1.5; }
.certgen-preview { display:flex; align-items:center; justify-content:center; }
#certCanvas { width:100%; max-width:560px; height:auto; border:1px solid var(--border-bright); border-radius:var(--radius-sm); box-shadow:0 20px 60px rgba(0,0,0,.5); }
@media (max-width:820px){ .certgen-shell{ grid-template-columns:1fr; } .certgen-preview{ order:-1; } }

/* ===== STATS BAR ===== */
.statsbar {
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  background:linear-gradient(to bottom, var(--ink-2), var(--ink));
}
.stat { display:flex; flex-direction:column; align-items:center; gap:var(--space-1); padding:var(--space-6) var(--space-3); border-right:1px solid var(--border); }
.stat:last-child { border-right:none; }
.stat-num { font-family:var(--font-mono); font-weight:700; font-size:var(--text-xl); color:var(--gold); letter-spacing:.04em; font-variant-numeric:tabular-nums; }
.stat-lab { font-family:var(--font-mono); font-size:10px; letter-spacing:.16em; color:var(--bone-faint); text-align:center; }
@media (max-width:680px){ .statsbar{ grid-template-columns:1fr 1fr; } .stat:nth-child(2n){ border-right:none; } .stat:nth-child(-n+2){ border-bottom:1px solid var(--border); } }

/* ===== REALM HUNTING MAP ===== */
.huntmap { max-width:var(--content-wide); }
.map-shell { display:flex; flex-direction:column; gap:var(--space-4); }
.map-frame {
  position:relative; width:100%; aspect-ratio:8/5; border:1px solid var(--border-bright); border-radius:var(--radius-md);
  overflow:hidden; background:var(--ink);
}
.map-svg { position:absolute; inset:0; width:100%; height:100%; }
.map-nodes { position:absolute; inset:0; }
.map-node {
  position:absolute; width:16px; height:16px; transform:translate(-50%,-50%); cursor:pointer; z-index:2;
  background:none; border:none; padding:0;
}
.map-node::before {
  content:''; position:absolute; inset:0; border-radius:50%; background:var(--node-c, var(--gold));
  box-shadow:0 0 0 2px rgba(8,8,10,.9), 0 0 10px var(--node-c, var(--gold)); transition:transform .15s ease;
}
.map-node::after {
  content:''; position:absolute; inset:0; border-radius:50%; border:1px solid var(--node-c, var(--gold));
  animation:ping 2.4s cubic-bezier(0,0,.2,1) infinite;
}
.map-node.confirmed { --node-c:var(--gold); }
.map-node.unconfirmed { --node-c:var(--bone-muted); }
.map-node.sealed { --node-c:var(--hazard); }
.map-node:hover::before, .map-node.is-active::before { transform:scale(1.35); box-shadow:0 0 0 4px rgba(200,162,74,.2), 0 0 16px var(--node-c, var(--gold)); }
.map-node:focus-visible { outline:2px solid var(--gold); outline-offset:4px; border-radius:50%; }
@keyframes ping { 0%{ transform:scale(1); opacity:.7; } 80%,100%{ transform:scale(3); opacity:0; } }
/* persistent label that hangs off each node so they read as interactive pins */
.map-node-label {
  position:absolute; left:50%; top:calc(100% + 6px); transform:translateX(-50%);
  font-family:var(--font-mono); font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap;
  color:var(--bone-muted); background:rgba(8,8,10,.7); padding:1px 5px; border-radius:3px;
  border:1px solid var(--border); pointer-events:none; opacity:.78; transition:opacity .15s ease, color .15s ease;
}
.map-node:hover .map-node-label, .map-node.is-active .map-node-label { opacity:1; color:var(--bone); border-color:var(--node-c, var(--gold)); }
/* live radar sweep to make the map feel alive */
.map-radar {
  position:absolute; inset:0; z-index:1; pointer-events:none; border-radius:inherit; overflow:hidden;
  -webkit-mask:radial-gradient(circle at center, #000 60%, transparent 100%); mask:radial-gradient(circle at center, #000 60%, transparent 100%);
}
.map-radar::before {
  content:''; position:absolute; top:50%; left:50%; width:150%; height:150%; transform-origin:top left;
  background:conic-gradient(from 0deg, rgba(200,162,74,.16), rgba(200,162,74,0) 38%);
  animation:radarSweep 7s linear infinite;
}
@keyframes radarSweep { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ .map-radar::before{ animation:none; } .map-node::after{ animation:none; } }
.map-hint { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; color:var(--bone-muted); text-transform:uppercase; opacity:.7; }
.map-tooltip {
  position:absolute; z-index:5; pointer-events:none; max-width:240px;
  background:rgba(10,10,12,.96); border:1px solid var(--gold-dim); border-radius:var(--radius-sm);
  padding:var(--space-3) var(--space-4); transform:translate(-50%,-118%);
  opacity:0; transition:opacity .18s; backdrop-filter:blur(4px);
}
.map-tooltip.below { transform:translate(-50%,18%); }
.map-tooltip.show { opacity:1; }
.map-tooltip .tt-id { font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; color:var(--hazard); display:block; margin-bottom:2px; }
.map-tooltip .tt-name { font-family:var(--font-display); font-weight:600; font-size:var(--text-sm); color:var(--bone); display:block; }
.map-tooltip .tt-note { font-family:var(--font-mono); font-size:11px; color:var(--bone-muted); display:block; margin-top:2px; line-height:1.4; }
.map-legend { display:flex; gap:var(--space-6); flex-wrap:wrap; font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.08em; color:var(--bone-muted); }
.map-legend span { display:inline-flex; align-items:center; gap:var(--space-2); }
.map-legend .dot { width:9px; height:9px; border-radius:50%; display:inline-block; }
.dot-confirmed { background:var(--gold); }
.dot-unconfirmed { background:var(--bone-muted); }
.dot-sealed { background:var(--hazard); }

/* ===== CERT TOAST ===== */
.cg-toast { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.06em; color:var(--gold); min-height:1.2em; opacity:0; transform:translateY(2px); transition:opacity .25s, transform .25s; }
.cg-toast.show { opacity:1; transform:translateY(0); }

/* ===== REALM RADIO ===== */
.radio {
  margin-top:var(--space-10); display:flex; align-items:center; gap:var(--space-6);
  flex-wrap:wrap; padding:var(--space-5) var(--space-6);
  background:linear-gradient(180deg, var(--surface-2), var(--surface));
  border:1px solid var(--border); border-radius:var(--radius-md);
}
.radio-led { display:flex; align-items:center; gap:var(--space-2); font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.16em; color:var(--bone-muted); white-space:nowrap; }
.radio-dot { width:8px; height:8px; border-radius:50%; background:var(--bone-faint); }
.radio.live .radio-dot { background:var(--hazard); box-shadow:0 0 0 0 rgba(214,64,44,.5); animation:radioPulse 1.6s infinite; }
@keyframes radioPulse { 0%{ box-shadow:0 0 0 0 rgba(214,64,44,.5);} 70%{ box-shadow:0 0 0 7px rgba(214,64,44,0);} 100%{ box-shadow:0 0 0 0 rgba(214,64,44,0);} }
.radio-now { display:flex; align-items:center; gap:var(--space-4); flex:1; min-width:0; }
.radio-eq { display:flex; align-items:flex-end; gap:3px; height:22px; }
.radio-eq span { width:3px; height:4px; background:var(--gold-dim); border-radius:1px; }
.radio.live .radio-eq span { animation:eq 900ms ease-in-out infinite; }
.radio.live .radio-eq span:nth-child(2){ animation-delay:.15s; } .radio.live .radio-eq span:nth-child(3){ animation-delay:.3s; }
.radio.live .radio-eq span:nth-child(4){ animation-delay:.45s; } .radio.live .radio-eq span:nth-child(5){ animation-delay:.6s; }
@keyframes eq { 0%,100%{ height:4px; } 50%{ height:22px; background:var(--gold); } }
.radio-track { display:flex; flex-direction:column; min-width:0; }
.radio-label { font-family:var(--font-mono); font-size:10px; letter-spacing:.18em; color:var(--bone-faint); }
.radio-title { font-family:var(--font-display); font-weight:500; font-size:var(--text-base); color:var(--bone); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.radio-btn { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; color:var(--bone); background:transparent; border:1px solid var(--border-bright); border-radius:var(--radius-sm); padding:var(--space-3) var(--space-5); cursor:pointer; transition:.2s; white-space:nowrap; }
.radio-btn:hover { border-color:var(--gold-dim); color:var(--gold); }
.radio.live .radio-btn { color:var(--ink); background:var(--gold); border-color:var(--gold); }
@media (max-width:680px){ .radio{ gap:var(--space-4); } .radio-btn{ width:100%; } }

/* ===== CURSED TRANSMISSIONS TERMINAL ===== */
.terminal-shell { max-width:880px; margin:0 auto; border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; background:var(--ink-2); box-shadow:0 30px 80px rgba(0,0,0,.5); }
.terminal-bar { display:flex; align-items:center; gap:var(--space-2); padding:var(--space-3) var(--space-4); background:var(--surface-2); border-bottom:1px solid var(--border); }
.term-dot { width:9px; height:9px; border-radius:50%; background:var(--border-bright); }
.term-dot:nth-child(1){ background:var(--hazard-dim); } .term-dot:nth-child(2){ background:var(--gold-dim); }
.terminal-name { margin-left:var(--space-3); font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; color:var(--bone-faint); }
.terminal-log { padding:var(--space-5) var(--space-6); min-height:200px; max-height:340px; overflow-y:auto; font-family:var(--font-mono); font-size:var(--text-sm); line-height:1.6; }
.term-line { margin-bottom:var(--space-4); }
.term-q { color:var(--bone-muted); } .term-q::before { content:"> "; color:var(--gold-dim); }
.term-a { color:var(--bone); white-space:pre-wrap; }
.term-a::before { content:"REALM // "; color:var(--hazard); letter-spacing:.06em; }
.term-cursor::after { content:"\2588"; color:var(--gold); animation:blink 1s steps(1) infinite; }
@keyframes blink { 50%{ opacity:0; } }
.terminal-input { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-4) var(--space-6); border-top:1px solid var(--border); background:var(--ink); }
.term-prompt { font-family:var(--font-mono); color:var(--gold); }
.terminal-input input { flex:1; background:transparent; border:none; outline:none; color:var(--bone); font-family:var(--font-mono); font-size:var(--text-sm); }
.terminal-input input::placeholder { color:var(--bone-faint); }
.term-send { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; color:var(--ink); background:var(--gold); border:none; border-radius:var(--radius-sm); padding:var(--space-2) var(--space-4); cursor:pointer; transition:.2s; }
.term-send:hover { background:var(--bone); }
.terminal-suggest { display:flex; flex-wrap:wrap; gap:var(--space-2); padding:var(--space-4) var(--space-6) var(--space-5); border-top:1px solid var(--border); }
.term-chip { font-family:var(--font-mono); font-size:11px; letter-spacing:.04em; color:var(--bone-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:99px; padding:var(--space-2) var(--space-4); cursor:pointer; transition:.2s; }
.term-chip:hover { border-color:var(--gold-dim); color:var(--gold); }

/* ===== DROP COUNTDOWN ===== */
.dropclock { margin-bottom:var(--space-10); padding:var(--space-6); border:1px solid var(--border); border-radius:var(--radius-md); background:linear-gradient(180deg, var(--surface-2), var(--ink-2)); position:relative; overflow:hidden; }
.dropclock::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, transparent 0 38px, rgba(200,162,74,.03) 38px 39px); pointer-events:none; }
.dropclock-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--space-3); margin-bottom:var(--space-5); position:relative; }
.dropclock-tag { font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.12em; color:var(--gold); }
.dropclock-status { font-family:var(--font-stamp); font-size:var(--text-xs); letter-spacing:.06em; color:var(--hazard); }
.dropclock-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-4); position:relative; }
.dc-unit { text-align:center; padding:var(--space-4) var(--space-2); background:var(--ink); border:1px solid var(--border); border-radius:var(--radius-sm); }
.dc-num { display:block; font-family:var(--font-display); font-weight:600; font-size:var(--text-2xl); color:var(--bone); font-variant-numeric:tabular-nums; }
.dc-lab { display:block; margin-top:var(--space-1); font-family:var(--font-mono); font-size:10px; letter-spacing:.18em; color:var(--bone-faint); }
.dropclock-note { margin-top:var(--space-5); font-family:var(--font-mono); font-size:11px; color:var(--bone-faint); line-height:1.5; position:relative; }

/* ===== CLEARANCE UPGRADE (easter egg) ===== */
body.cleared { --gold:#e8c04a; }
.clearance-banner { position:fixed; left:50%; top:18px; transform:translateX(-50%) translateY(-160%); z-index:200; display:flex; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-5); background:var(--gold); color:var(--ink); border-radius:var(--radius-sm); font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.08em; box-shadow:0 18px 50px rgba(0,0,0,.5); transition:transform .5s cubic-bezier(.2,.9,.2,1); }
.clearance-banner.show { transform:translateX(-50%) translateY(0); }
body.cleared .cert-chip { border-color:var(--gold); color:var(--gold); }
body.cleared .statsbar { box-shadow:inset 0 0 0 1px var(--gold-dim); }

/* ===== LIVE REALM FEED ===== */
.feed { max-width: 760px; margin: 0 auto; }
.feed-screen {
  position: relative; aspect-ratio: 9 / 16; max-height: 78vh; margin: 0 auto;
  background: #000; border: 1px solid var(--gold-dim);
  border-radius: var(--radius-md); overflow: hidden;
  box-shadow: 0 0 0 1px rgba(0,0,0,.6), 0 30px 80px -30px rgba(0,0,0,.9), inset 0 0 120px rgba(0,0,0,.7);
}
@media (min-width: 720px) { .feed-screen { aspect-ratio: 16 / 10; max-height: none; } }
.feed-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; display: block; }

.feed-scan {
  position: absolute; inset: 0; pointer-events: none; z-index: 3; opacity: .35;
  background: repeating-linear-gradient(to bottom, rgba(255,255,255,.04) 0 1px, transparent 1px 3px);
  mix-blend-mode: overlay;
}
.feed-grain {
  position: absolute; inset: -50%; pointer-events: none; z-index: 2; opacity: .06;
  background-image: radial-gradient(rgba(255,255,255,.9) 0.5px, transparent 0.5px);
  background-size: 3px 3px; animation: feedGrain 0.6s steps(4) infinite;
}
@keyframes feedGrain {
  0%{transform:translate(0,0)} 25%{transform:translate(-2%,1%)}
  50%{transform:translate(1%,-2%)} 75%{transform:translate(-1%,2%)} 100%{transform:translate(2%,-1%)}
}

.feed-overlay {
  position: absolute; inset: 0; z-index: 4; pointer-events: none;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: var(--space-4);
  background: linear-gradient(to bottom, rgba(0,0,0,.55), transparent 22%, transparent 70%, rgba(0,0,0,.7));
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .14em; text-transform: uppercase;
}
.feed-top, .feed-bottom { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.feed-live { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--hazard); font-weight: 700; }
.feed-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--hazard); box-shadow: 0 0 10px var(--hazard); animation: feedBlink 1.2s steps(2) infinite; }
@keyframes feedBlink { 0%,49%{opacity:1} 50%,100%{opacity:.2} }
.feed-ch { color: var(--gold); }
.feed-title-txt { color: var(--bone); text-shadow: 0 1px 4px rgba(0,0,0,.9); max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feed-rec { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--bone-muted); }
.feed-rec-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--hazard); animation: feedBlink 1s steps(2) infinite; }

/* placeholder */
.feed-empty { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; text-align: center; padding: var(--space-8);
  background: radial-gradient(ellipse at center, var(--ink-2), var(--ink)); }
.feed.has-clips .feed-empty { display: none; }
.feed-empty-inner { max-width: 32ch; }
.feed-empty-title { font-family: var(--font-mono); letter-spacing: .2em; color: var(--gold); margin: var(--space-5) 0 var(--space-2); font-size: var(--text-sm); }
.feed-empty-sub { color: var(--bone-muted); font-size: var(--text-sm); line-height: 1.5; }
.feed-empty-eq { display: inline-flex; align-items: flex-end; gap: 4px; height: 28px; }
.feed-empty-eq span { width: 4px; background: var(--pink); border-radius: 1px; animation: feedEq 1s ease-in-out infinite; }
.feed-empty-eq span:nth-child(2){animation-delay:.15s} .feed-empty-eq span:nth-child(3){animation-delay:.3s}
.feed-empty-eq span:nth-child(4){animation-delay:.45s} .feed-empty-eq span:nth-child(5){animation-delay:.6s}
@keyframes feedEq { 0%,100%{height:8px} 50%{height:28px} }

/* signal-interrupt (shown ~1s between clips) */
.feed-interrupt {
  position: absolute; inset: 0; z-index: 6; pointer-events: none;
  opacity: 0; visibility: hidden; transition: opacity .12s ease;
  background: #000; overflow: hidden;
  display: grid; place-items: center;
}
.feed.is-interrupt .feed-interrupt { opacity: 1; visibility: visible; }
.feed-interrupt-bars {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(180deg,
    #0a0a0a 0 8%, #1b1b1f 8% 14%, #000 14% 20%, #232327 20% 26%,
    #0a0a0a 26% 34%, #15151a 34% 40%, #000 40% 48%, #1f1f24 48% 54%,
    #0a0a0a 54% 62%, #18181d 62% 70%, #000 70% 78%, #202025 78% 86%, #0c0c10 86% 100%);
  opacity: .9; animation: feedTear .18s steps(3) infinite;
}
.feed-interrupt-noise {
  position: absolute; inset: -40%; opacity: .22; mix-blend-mode: screen;
  background-image: radial-gradient(rgba(255,255,255,.9) .6px, transparent .6px);
  background-size: 3px 3px; animation: feedGrain .25s steps(4) infinite;
}
@keyframes feedTear {
  0%{transform:translateY(0)} 33%{transform:translateY(-2%)}
  66%{transform:translateY(1.5%)} 100%{transform:translateY(0)}
}
.feed-interrupt-msg {
  position: relative; z-index: 1; display: inline-flex; align-items: center; gap: var(--space-2);
  padding: .55em 1em; background: rgba(0,0,0,.6); border: 1px solid var(--hazard);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .26em; text-transform: uppercase;
  color: var(--hazard); text-shadow: 0 0 12px rgba(214,64,44,.6);
  animation: feedInterruptBlink .4s steps(2) infinite;
}
.feed-interrupt-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--hazard); box-shadow: 0 0 10px var(--hazard); }
@keyframes feedInterruptBlink { 0%,60%{opacity:1} 61%,100%{opacity:.45} }

/* tap-for-sound chip */
.feed-tap {
  position: absolute; left: 50%; bottom: var(--space-12); transform: translateX(-50%); z-index: 6;
  display: none; align-items: center; gap: var(--space-2);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .16em; text-transform: uppercase;
  color: var(--ink); background: var(--gold); border: none; padding: var(--space-2) var(--space-4);
  border-radius: 999px; cursor: pointer; box-shadow: 0 8px 24px -8px rgba(0,0,0,.8);
  animation: feedPulse 2s ease-in-out infinite;
}
.feed.has-clips.is-muted .feed-tap { display: inline-flex; }
@keyframes feedPulse { 0%,100%{transform:translateX(-50%) scale(1)} 50%{transform:translateX(-50%) scale(1.05)} }
.feed-tap:hover { background: var(--bone); }

/* control bar */
.feed-bar {
  display: flex; align-items: center; gap: var(--space-3); justify-content: center;
  margin-top: var(--space-5); flex-wrap: wrap;
}
.feed-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  width: 44px; height: 44px; color: var(--bone); background: var(--ink-2);
  border: 1px solid var(--gold-dim); border-radius: var(--radius-sm); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.feed-btn:hover { color: var(--gold); border-color: var(--gold); }
.feed-btn-pp { width: 52px; height: 52px; background: var(--gold); color: var(--ink); border-color: var(--gold); }
.feed-btn-pp:hover { background: var(--bone); color: var(--ink); }
.feed-btn-pp .ic-pause { display: inline; } .feed-btn-pp .ic-play { display: none; }
.feed.is-paused .feed-btn-pp .ic-pause { display: none; } .feed.is-paused .feed-btn-pp .ic-play { display: inline; }
.feed-btn-sound { width: auto; padding: 0 var(--space-4); font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .14em; }
.feed-sound-on { display: none; } .feed-sound-off { display: inline; }
.feed:not(.is-muted) .feed-sound-on { display: inline; } .feed:not(.is-muted) .feed-sound-off { display: none; }
.feed:not(.is-muted) .feed-btn-sound { color: var(--pink); border-color: var(--pink-dim); }
.feed-counter { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .14em; color: var(--bone-muted); margin-left: var(--space-2); }

/* ===== THE DROP — MERCH / CLOTHING (flagship) ===== */
.nav-shop { color: var(--gold) !important; }
.nav-shop::after { background: var(--gold) !important; }

.section.merch { position: relative; overflow: hidden; }
.merch-glow {
  position: absolute; top: -10%; left: 50%; transform: translateX(-50%);
  width: 80vw; max-width: 1100px; aspect-ratio: 2/1; pointer-events: none; z-index: 0;
  background: radial-gradient(ellipse at center, rgba(200,162,74,.10), transparent 60%);
}
.section.merch .section-head, .section.merch .merch-hero,
.section.merch .merch-grid, .section.merch .merch-foot { position: relative; z-index: 1; }
.section.merch .section-no { color: var(--gold); }

/* hero product */
.merch-hero {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(var(--space-6), 4vw, var(--space-16));
  align-items: stretch; margin-bottom: var(--space-16);
  border: 1px solid var(--border); border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--ink-2), var(--ink));
  overflow: hidden;
}
.merch-hero-media { position: relative; min-height: 420px; background: #000; }
.merch-hero-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.merch-flag {
  position: absolute; top: var(--space-4); left: var(--space-4);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .2em;
  color: var(--ink); background: var(--gold); padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-sm); font-weight: 700;
}
.merch-hero-body { display: flex; flex-direction: column; justify-content: center; padding: clamp(var(--space-6), 3vw, var(--space-12)); }
.merch-kicker { display: inline-flex; align-items: center; gap: var(--space-2);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .18em; text-transform: uppercase;
  color: var(--pink); margin-bottom: var(--space-4); }
.merch-hero-body h3 { font-family: var(--font-heavy); font-weight: 800; font-size: clamp(1.8rem, 3.5vw, 2.8rem); line-height: 1; margin-bottom: var(--space-4); color: var(--bone); }
.merch-desc { color: var(--bone-muted); line-height: 1.6; margin-bottom: var(--space-5); max-width: 46ch; }
.merch-spec { list-style: none; padding: 0; margin: 0 0 var(--space-6); display: grid; gap: var(--space-2); }
.merch-spec li { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .06em; color: var(--bone-faint); padding-left: var(--space-4); position: relative; }
.merch-spec li::before { content: '✦'; position: absolute; left: 0; color: var(--gold-dim); }

.merch-buy { display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.merch-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .16em; text-transform: uppercase;
  color: var(--bone); background: transparent; border: 1px solid var(--gold-dim);
  padding: var(--space-3) var(--space-5); border-radius: var(--radius-sm); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s, transform .15s; text-decoration: none;
}
.merch-btn:hover { color: var(--gold); border-color: var(--gold); transform: translateY(-1px); }
.merch-btn.primary { background: var(--gold); color: var(--ink); border-color: var(--gold); font-weight: 700; }
.merch-btn.primary:hover { background: var(--bone); color: var(--ink); border-color: var(--bone); }
.merch-price { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .14em; color: var(--bone-faint); }

/* grid of the rest */
.merch-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(var(--space-4), 2vw, var(--space-6)); }
.merch-card {
  display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: var(--radius-md);
  background: var(--ink-2); overflow: hidden; transition: border-color .2s, transform .2s;
}
.merch-card:hover { border-color: var(--gold-dim); transform: translateY(-3px); }
.merch-card-media { position: relative; aspect-ratio: 3/4; background: #000; overflow: hidden; }
.merch-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.merch-card:hover .merch-card-media img { transform: scale(1.04); }
.merch-card-body { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); flex: 1; }
.merch-card-body h3 { font-family: var(--font-heavy); font-weight: 800; font-size: var(--text-lg); color: var(--bone); line-height: 1.05; }
.merch-card-body p { color: var(--bone-muted); font-size: var(--text-sm); line-height: 1.5; flex: 1; }
.merch-card-body .merch-buy { justify-content: space-between; margin-top: var(--space-2); }
.merch-card-body .merch-btn { align-self: flex-start; }
.merch-card-body .merch-price { color: var(--gold); }

.merch-foot { text-align: center; margin-top: var(--space-12); color: var(--bone-faint);
  font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .06em; line-height: 1.8; max-width: 60ch; margin-left: auto; margin-right: auto; }
.merch-foot a { color: var(--gold); }

@media (max-width: 1080px) {
  .merch-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .merch-hero { grid-template-columns: 1fr; }
  .merch-hero-media { min-height: 0; aspect-ratio: 4/5; }
}
@media (max-width: 560px) {
  .merch-grid { grid-template-columns: 1fr; max-width: 440px; margin-inline: auto; }
}