:root{
  --paper: #ece5d3;
  --paper-dark: #e2d9c2;
  --ink: #211d16;
  --ink-soft: #4a4436;
  --rule: #b3a986;
  --stamp-red: #9c3b2e;
  --stamp-red-dim: #b6604f;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background: var(--paper);
  background-image:
    radial-gradient(circle at 20% 30%, rgba(0,0,0,0.025) 0, transparent 45%),
    radial-gradient(circle at 80% 70%, rgba(0,0,0,0.03) 0, transparent 50%),
    repeating-linear-gradient(0deg, rgba(0,0,0,0.012) 0px, transparent 1px, transparent 2px);
  color: var(--ink);
  font-family:'PT Serif', serif;
  -webkit-font-smoothing: antialiased;
}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}

/* ===== TOP UTILITY BAR ===== */
.topbar{
  border-bottom:1px solid var(--rule);
  font-family:'Special Elite', monospace;
  font-size:11px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color: var(--ink-soft);
  padding:8px 0;
}
.topbar .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;}

/* ===== MASTHEAD ===== */
.masthead{ padding:28px 0 10px; text-align:center; }
.masthead .kicker{
  font-family:'Special Elite', monospace;
  font-size:11px;
  letter-spacing:0.25em;
  text-transform:uppercase;
  color: var(--stamp-red);
}
.masthead h1{
  font-family:'Playfair Display', serif;
  font-weight:900;
  font-size:clamp(48px, 8vw, 96px);
  margin:6px 0 4px;
  letter-spacing:-0.01em;
  line-height:0.95;
}
.masthead .tagline{
  font-style:italic;
  font-size:15px;
  color:var(--ink-soft);
  margin-bottom:14px;
}
.rule-thick{ border:none; border-top:3px solid var(--ink); margin:0; }
.rule-thin{ border:none; border-top:1px solid var(--rule); margin:0; }
.masthead-meta{
  display:flex; justify-content:space-between; align-items:center;
  font-family:'Special Elite', monospace;
  font-size:11px; text-transform:uppercase; letter-spacing:0.08em;
  color:var(--ink-soft);
  padding:8px 0;
}
.masthead-meta a{ text-decoration:underline; }

.frontpage-empty{ text-align:center; padding:60px 0; }
.frontpage-empty .dek{ margin-bottom:0; }

.archive-title{
  font-family:'Playfair Display', serif;
  font-weight:800;
  font-size:36px;
  margin:20px 0;
}
.archive-list{ padding-bottom:30px; }
.archive-list .story-mini{ padding:16px 0; }
.archive-list .byline{ margin-bottom:6px; }

.back-link{ margin-top:24px; }
.back-link a{ text-decoration:underline; }

/* ===== FRONT PAGE GRID ===== */
.frontpage{
  display:grid;
  grid-template-columns: 2.1fr 1px 1fr;
  gap:32px;
  padding:36px 0;
}
.divider{ background:var(--rule); }

.eyebrow{
  font-family:'Special Elite', monospace;
  font-size:11px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--stamp-red);
  margin-bottom:8px;
}
.lead h2{
  font-family:'Playfair Display', serif;
  font-weight:800;
  font-size:44px;
  line-height:1.05;
  margin:0 0 10px;
}
.dek{
  font-style:italic;
  font-size:18px;
  color:var(--ink-soft);
  margin-bottom:14px;
  line-height:1.4;
}
.byline{
  font-family:'Special Elite', monospace;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.05em;
  color:var(--ink-soft);
  margin-bottom:18px;
}
.halftone{
  width:100%;
  aspect-ratio: 16/9;
  background:
    radial-gradient(circle at center, var(--ink) 0.9px, transparent 1px) 0 0/6px 6px,
    linear-gradient(135deg, #8c7f5f, #3a3428);
  filter: grayscale(1) contrast(1.15);
  margin-bottom:16px;
  position:relative;
}
.halftone::after{
  content:"FIG. 1 — FIELD VIEW, FOURTH QUARTER";
  position:absolute; bottom:8px; left:8px;
  font-family:'Special Elite', monospace;
  font-size:10px;
  color:#efe9d8;
  background:rgba(0,0,0,0.55);
  padding:2px 6px;
}
.lead-body{ column-count:2; column-gap:28px; font-size:16px; line-height:1.65; }
.lead-body p{ margin:0 0 14px; }
.drop-cap::first-letter{
  font-family:'Playfair Display', serif;
  font-weight:900;
  font-size:58px;
  float:left;
  line-height:0.8;
  padding:4px 8px 0 0;
  color:var(--stamp-red);
}

/* ===== SIDEBAR ===== */
.side-block{ margin-bottom:30px; }
.side-block h3{
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:0.06em;
  border-bottom:2px solid var(--ink);
  padding-bottom:6px;
  margin:0 0 12px;
}
.story-mini{ padding:12px 0; border-bottom:1px dotted var(--rule); }
.story-mini:last-child{border-bottom:none;}
.story-mini h4{
  font-family:'Playfair Display', serif;
  font-size:19px;
  font-weight:700;
  margin:0 0 4px;
  line-height:1.2;
}
.story-mini p{ font-size:14px; color:var(--ink-soft); margin:0; line-height:1.4; }

/* BOX SCORE */
.boxscore{ font-family:'Special Elite', monospace; font-size:12px; }
.boxscore table{ width:100%; border-collapse:collapse; }
.boxscore th, .boxscore td{
  text-align:left; padding:5px 4px;
  border-bottom:1px solid var(--rule);
}
.boxscore th{ text-transform:uppercase; font-size:10px; letter-spacing:0.05em; color:var(--ink-soft);}
.boxscore td.num, .boxscore th.num{ text-align:right; }
.boxscore caption{
  text-align:left; font-family:'Special Elite', monospace;
  font-size:11px; text-transform:uppercase; letter-spacing:0.08em;
  color:var(--stamp-red); margin-bottom:8px; caption-side:top;
}

/* ===== SECOND ROW STORIES ===== */
.below-fold{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:0;
  border-top:3px double var(--ink);
  padding-top:26px;
  margin-bottom:40px;
}
.col-story{ padding:0 24px; border-left:1px solid var(--rule); }
.col-story:first-child{ border-left:none; padding-left:0; }
.col-story:last-child{ padding-right:0; }
.col-story h4{
  font-family:'Playfair Display', serif;
  font-size:22px;
  font-weight:700;
  line-height:1.15;
  margin:0 0 8px;
}
.col-story p{ font-size:14.5px; color:var(--ink-soft); line-height:1.55; margin:0 0 10px;}
.tag{
  display:inline-block;
  font-family:'Special Elite', monospace;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:0.06em;
  background:var(--ink);
  color:var(--paper);
  padding:2px 7px;
  margin-bottom:10px;
}

footer{
  border-top:3px solid var(--ink);
  padding:20px 0 40px;
  font-family:'Special Elite', monospace;
  font-size:11px;
  color:var(--ink-soft);
  text-align:center;
  letter-spacing:0.05em;
}

@media (max-width: 860px){
  .frontpage{ grid-template-columns:1fr; }
  .divider{ display:none; }
  .lead-body{ column-count:1; }
  .below-fold{ grid-template-columns:1fr; }
  .col-story{ border-left:none; border-top:1px solid var(--rule); padding:20px 0 0; margin-top:20px;}
  .col-story:first-child{ border-top:none; margin-top:0; padding-top:0; }
}
