:root{
  --ink:#191621;
  --ink-2:#221e2c;
  --paper:#efe8d8;
  --paper-dim:#e2d9c4;
  --mustard:#c89b3c;
  --moss:#4f6d5a;
  --rose:#8b5a62;
  --line: rgba(239,232,216,0.14);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:'Newsreader', serif;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}
a{color:inherit;}
.wrap{max-width:920px; margin:0 auto; padding:0 24px;}
.wrap-wide{max-width:1080px; margin:0 auto; padding:0 24px;}

/* ---------- Masthead ---------- */
header.masthead{ border-bottom:1px solid var(--line); padding:20px 0 0; }
.mast-top{
  display:flex; justify-content:space-between; align-items:baseline;
  padding-bottom:14px;
  font-family:'IBM Plex Mono', monospace;
  font-size:12px; letter-spacing:0.06em; color:var(--paper-dim); opacity:0.75;
}
.wordmark{
  font-family:'Fraunces', serif; font-weight:700;
  font-size:clamp(34px, 7vw, 64px);
  letter-spacing:-0.02em; line-height:0.92; margin:0 0 6px;
}
.wordmark a{ text-decoration:none; }
.wordmark em{ font-style:italic; font-weight:500; color:var(--mustard); }
.tagline{
  font-family:'IBM Plex Mono', monospace; font-size:13px;
  letter-spacing:0.08em; text-transform:uppercase; color:var(--mustard);
  margin:0 0 22px;
}
nav.mast-nav{
  display:flex; gap:28px; flex-wrap:wrap; padding:16px 0;
  border-top:1px solid var(--line);
  font-family:'IBM Plex Mono', monospace; font-size:13px;
  text-transform:uppercase; letter-spacing:0.05em;
}
nav.mast-nav a{ text-decoration:none; color:var(--paper-dim); position:relative; }
nav.mast-nav a:hover, nav.mast-nav a:focus-visible{ color:var(--mustard); }
nav.mast-nav a[aria-current="page"]{ color:var(--paper); }

/* ---------- Editorial intro ---------- */
.intro{ padding:56px 0 40px; border-bottom:1px solid var(--line); }
.intro .eyebrow{
  font-family:'IBM Plex Mono', monospace; font-size:12px;
  letter-spacing:0.1em; text-transform:uppercase; color:var(--moss); margin-bottom:14px;
}
.intro p{ font-size:clamp(19px, 2.6vw, 24px); line-height:1.5; max-width:62ch; margin:0 0 16px; color:var(--paper); }
.intro p.dim{ color:var(--paper-dim); font-size:17px; max-width:58ch; }

/* ---------- Feed (issue pages) ---------- */
.feed{ padding:12px 0 60px; }
.entry{
  display:grid; grid-template-columns:110px 1fr; gap:28px;
  padding:36px 0; border-bottom:1px solid var(--line); align-items:start;
}
.entry-index{ font-family:'IBM Plex Mono', monospace; font-size:13px; color:var(--paper-dim); opacity:0.6; padding-top:6px; }
.entry-body{ position:relative; }
.entry-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; }
.entry h2{ font-family:'Fraunces', serif; font-weight:600; font-size:clamp(24px, 3.4vw, 32px); margin:0 0 4px; letter-spacing:-0.01em; }
.entry h2 a{ text-decoration:none; }
.entry h2 a:hover{ color:var(--mustard); }
.entry .byline{ font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--mustard); letter-spacing:0.03em; margin-bottom:14px; display:block; }
.entry p.note{ font-size:16px; line-height:1.6; color:var(--paper-dim); max-width:56ch; margin:0 0 14px; }
.tags{ display:flex; gap:8px; flex-wrap:wrap; margin-top:4px; }
.tag{
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.04em; text-transform:uppercase;
  padding:4px 9px; border:1px solid var(--line); border-radius:2px; color:var(--paper-dim);
}
.tag.tier1{ border-color:var(--moss); color:var(--moss); }

.stamp{
  position:absolute; top:-6px; right:0; width:86px; height:86px;
  border:2px solid var(--mustard); border-radius:50%;
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-family:'IBM Plex Mono', monospace; font-size:9.5px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--mustard); transform:rotate(-9deg); opacity:0.9; line-height:1.25; padding:6px;
}
.stamp::before{ content:""; position:absolute; inset:5px; border:1px solid var(--mustard); border-radius:50%; opacity:0.5; }
@media (max-width: 640px){
  .entry{ grid-template-columns:1fr; gap:8px; }
  .entry-index{ padding-top:0; }
  .stamp{ position:static; margin-bottom:14px; transform:rotate(-4deg); }
}

/* ---------- Issues index ---------- */
.issues-list{ padding:12px 0 60px; }
.issue-row{
  display:grid; grid-template-columns:140px 1fr auto; gap:24px; align-items:center;
  padding:26px 0; border-bottom:1px solid var(--line); text-decoration:none; color:inherit;
}
.issue-row:hover .issue-title{ color:var(--mustard); }
.issue-num{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--paper-dim); opacity:0.7; }
.issue-title{ font-family:'Fraunces', serif; font-size:22px; font-weight:600; }
.issue-meta{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--paper-dim); text-align:right; }
.issue-row.upcoming{ opacity:0.45; pointer-events:none; }
@media (max-width:640px){
  .issue-row{ grid-template-columns:1fr; gap:6px; }
  .issue-meta{ text-align:left; }
}

/* ---------- Archive ---------- */
.archive-layout{
  display:grid; grid-template-columns:220px 1fr; gap:40px;
  padding:40px 0 70px; align-items:start;
}
@media (max-width:800px){ .archive-layout{ grid-template-columns:1fr; } }

.filters{
  position:sticky; top:24px;
  font-family:'IBM Plex Mono', monospace; font-size:12.5px;
}
.filters .fgroup{ margin-bottom:26px; }
.filters .fgroup-label{
  text-transform:uppercase; letter-spacing:0.08em; color:var(--moss); font-size:11px; margin-bottom:10px;
}
.filters label{
  display:flex; align-items:center; gap:8px; padding:5px 0; cursor:pointer; color:var(--paper-dim);
}
.filters label:hover{ color:var(--paper); }
.filters input[type="checkbox"]{ accent-color:var(--mustard); }
.filters select{
  width:100%; background:var(--ink-2); color:var(--paper); border:1px solid var(--line);
  padding:8px 10px; font-family:inherit; font-size:12.5px; border-radius:2px;
}
.filters .reset{
  background:none; border:1px solid var(--line); color:var(--paper-dim);
  padding:7px 12px; font-family:inherit; font-size:11.5px; text-transform:uppercase; letter-spacing:0.05em;
  border-radius:2px; cursor:pointer;
}
.filters .reset:hover{ border-color:var(--mustard); color:var(--mustard); }

.results-bar{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  margin-bottom:22px; font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--paper-dim);
}
.card-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr)); gap:20px; }
.game-card{
  border:1px solid var(--line); border-radius:3px; padding:20px;
  display:flex; flex-direction:column; gap:10px; min-height:100%;
}
.game-card h3{ font-family:'Fraunces', serif; font-size:19px; margin:0; font-weight:600; }
.game-card .byline{ font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--mustard); }
.game-card p{ font-size:14.5px; line-height:1.5; color:var(--paper-dim); margin:0; flex:1; }
.game-card .meta{ display:flex; justify-content:space-between; align-items:center; font-family:'IBM Plex Mono', monospace; font-size:10.5px; color:var(--paper-dim); opacity:0.75; }
.empty-state{ padding:40px 0; color:var(--paper-dim); font-family:'IBM Plex Mono', monospace; font-size:13px; }

/* ---------- Play buttons & inline frame ---------- */
.play-btn{
  display:inline-block;
  font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--ink); background:var(--mustard); border:1px solid var(--mustard);
  padding:8px 16px; border-radius:2px; text-decoration:none; cursor:pointer;
  margin-top:6px;
}
.play-btn:hover{ opacity:0.85; }
.play-btn.disabled{
  background:none; color:var(--paper-dim); border-color:var(--line); opacity:0.6; cursor:default;
}
.play-frame{ display:none; margin-top:18px; border:1px solid var(--line); border-radius:3px; overflow:hidden; background:#000; }
.play-frame.open{ display:block; }
.play-frame iframe{ width:100%; height:560px; border:0; display:block; }
@media (max-width:640px){ .play-frame iframe{ height:420px; } }

/* ---------- Footer ---------- */
footer{
  padding:44px 0 60px; font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--paper-dim);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;
}
footer .fmark{ font-family:'Fraunces', serif; font-style:italic; color:var(--mustard); font-size:14px; }
