:root{
  --ink:#0b0b0f; --panel:#12121a; --paper:#f4efe6;
  --gold:#e8b04b; --amber:#c8792e; --muted:#9a97a6; --line:#26232f;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:radial-gradient(120% 90% at 80% -10%,#1a1622 0%,var(--ink) 55%);
  color:var(--paper); font-family:"Inter",system-ui,sans-serif; line-height:1.6;
  min-height:100vh; display:flex; flex-direction:column;
}
.grain{position:fixed; inset:0; pointer-events:none; opacity:.05; z-index:0;
  background-image:radial-gradient(#fff 1px,transparent 1px); background-size:3px 3px}
.skip{position:absolute; left:-999px}
.skip:focus{left:12px; top:12px; background:var(--gold); color:#000; padding:.5rem .8rem; border-radius:6px; z-index:10}
.top{display:flex; justify-content:space-between; align-items:center;
  padding:1.4rem clamp(1.2rem,5vw,4rem); position:relative; z-index:1}
.mark{font-family:"Fraunces",serif; font-weight:700; letter-spacing:.02em; color:var(--gold)}
.status{font-size:.72rem; text-transform:uppercase; letter-spacing:.22em; color:var(--muted);
  border:1px solid var(--line); padding:.35rem .7rem; border-radius:999px}
.stage{flex:1; position:relative; z-index:1; width:min(760px,92vw); margin:0 auto;
  padding:clamp(2rem,7vw,5rem) 0 3rem}
.kicker{font-size:.75rem; text-transform:uppercase; letter-spacing:.32em; color:var(--amber); margin:0 0 1rem}
.content h2{font-family:"Fraunces",serif; font-weight:700;
  font-size:clamp(2.1rem,6vw,3.4rem); line-height:1.05; margin:.2rem 0 1.1rem}
.content h3{font-family:"Fraunces",serif; font-weight:500; font-size:1.15rem;
  margin:2.2rem 0 .6rem; color:var(--gold)}
.content p{color:#d9d4ca; max-width:60ch}
.content strong{color:var(--paper)}
.content ul{list-style:none; padding:0; margin:.4rem 0}
.content li{padding:.5rem 0 .5rem 1.6rem; position:relative; border-bottom:1px solid var(--line); color:#cfcabf}
.content li::before{content:"▸"; position:absolute; left:0; color:var(--amber)}
.reel{display:flex; gap:.5rem; margin-top:2.6rem}
.reel span{width:26px; height:34px; border-radius:4px; background:linear-gradient(180deg,var(--panel),#0d0d13);
  border:1px solid var(--line); position:relative}
.reel span::after{content:""; position:absolute; inset:5px 6px; border-radius:2px;
  background:repeating-linear-gradient(180deg,transparent 0 4px,rgba(232,176,75,.25) 4px 6px)}
.foot{position:relative; z-index:1; padding:1.4rem clamp(1.2rem,5vw,4rem);
  border-top:1px solid var(--line); color:var(--muted); font-size:.82rem}
@media (max-width:520px){ .status{display:none} }
