/* ============================================================
   Print has no dark mode. This is a paper document by identity,
   so the page commits to one world and paints it explicitly.
   ============================================================ */
:root{
  /* the world: journal paper, iron ink, one editor's pencil */
  --paper:        #FAF6EE;
  --paper-inset:  #F3EDE1;   /* below-the-line blocks, gated passages */
  --ink:          #211D15;
  --ink-muted:    #57503F;   /* supporting text */
  --ink-faint:    #8A8170;   /* metadata, folios */
  --rule:         #D9D0BE;   /* hairline pencil rules */
  --rule-strong:  #B5A98F;
  --stamp-pass:   #4C7A57;   /* dry sage, the quiet pass stamp */
  --stamp-pass-bg:#E9F0E6;
  --pencil-red:   #B23A2E;   /* the ONLY loud color: fail, and nothing else */
  --pencil-red-bg:#F7E8E4;
  --doi-blue:     #2E5A8A;   /* archival catalogue blue, links out */
  --serif: "Source Serif 4", Charter, Georgia, serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:17px/1.62 var(--serif);
  -webkit-font-smoothing:antialiased;
}
a{color:var(--doi-blue); text-decoration-thickness:1px; text-underline-offset:2px}
a:focus-visible,button:focus-visible{outline:2px solid var(--doi-blue); outline-offset:2px}

/* ---- masthead: a journal header, not an app bar ---- */
.masthead{
  max-width:760px; margin:0 auto; padding:34px 24px 0;
}
.mast-top{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  border-bottom:2px solid var(--ink); padding-bottom:10px;}
.wordmark{font-weight:700; font-size:21px; letter-spacing:-.01em}
.wordmark sup{color:var(--pencil-red); font-size:.7em}
.mast-motto{color:var(--ink-faint); font-style:italic; font-size:14.5px}
.mast-nav{margin-left:auto; display:flex; gap:18px; font:13px var(--mono)}
.mast-nav a{color:var(--ink-muted); text-decoration:none}
.mast-nav a.here{color:var(--ink); border-bottom:2px solid var(--ink); padding-bottom:11px; margin-bottom:-13px}
.tierline{font:11.5px var(--mono); color:var(--ink-faint); padding:7px 0 0; display:flex; gap:8px; align-items:center}
.tierline b{color:var(--ink-muted); font-weight:500}
.tier-chip{border:1px solid var(--rule-strong); border-radius:2px; padding:1px 7px; letter-spacing:.05em}

main{max-width:760px; margin:0 auto; padding:30px 24px 90px}

/* ---- type scale ---- */
h1{font-size:31px; line-height:1.22; font-weight:700; letter-spacing:-.015em; margin:6px 0 10px; text-wrap:balance}
h2{font-size:13px; font-family:var(--mono); font-weight:600; letter-spacing:.13em;
   text-transform:uppercase; color:var(--ink-faint); margin:44px 0 14px}
.kicker{font:12px var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint)}
p{margin:0 0 14px; max-width:66ch}
.lede{font-size:19px; color:var(--ink-muted)}

/* ---- footnote markers: the signature ---- */
sup.fn{font:600 12px var(--mono); color:var(--doi-blue); cursor:pointer; padding:0 1px}
sup.fn:hover{background:var(--paper-inset)}

/* ---- claims with marginalia ---- */
.claim{position:relative; padding:14px 0 14px 0; border-top:1px solid var(--rule)}
.claim:first-of-type{border-top:none}
.claim-text{max-width:60ch; margin:0}
.claim-meta{display:flex; gap:10px; align-items:baseline; margin-top:8px; flex-wrap:wrap}
.stamp{
  font:600 10.5px var(--mono); letter-spacing:.14em; text-transform:uppercase;
  border:1.5px solid; border-radius:2px; padding:2px 8px;
}
.stamp.pass{color:var(--stamp-pass); border-color:var(--stamp-pass); background:var(--stamp-pass-bg)}
.stamp.fail{color:var(--pencil-red); border-color:var(--pencil-red); background:var(--pencil-red-bg)}
.stamp.open{color:var(--ink-faint); border-color:var(--rule-strong); background:none; border-style:dashed}
.marginnote{font-size:14px; font-style:italic; color:var(--ink-muted); max-width:58ch}
.marginnote.red{color:var(--pencil-red)}
.marginnote::before{content:"— "; }

/* ---- below the line: evidence as real footnotes ---- */
.the-line{border:none; border-top:1px solid var(--ink); width:88px; margin:40px 0 6px}
.fnhead{font:11px var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 16px}
.foot{display:grid; grid-template-columns:30px 1fr; gap:0 10px; padding:13px 0; border-top:1px dotted var(--rule)}
.foot:first-of-type{border-top:none}
.foot-n{font:600 13px var(--mono); color:var(--doi-blue)}
.foot-claim{font-size:15.5px; margin:0 0 6px; max-width:62ch}
.pico{font:12.5px var(--mono); color:var(--ink-muted); line-height:1.75; margin:0 0 6px}
.pico b{font-weight:600; color:var(--ink-faint)}
.passage{
  background:var(--paper-inset); border-left:2px solid var(--rule-strong);
  padding:9px 13px; font-size:14px; font-style:italic; color:var(--ink-muted);
  max-width:60ch; margin:6px 0;
}
.gated{
  border-left:2px solid var(--rule-strong); border-style:none none none dashed;
  padding:9px 13px; font-size:13.5px; color:var(--ink-faint); max-width:60ch; margin:6px 0;
}
.src{font-size:13.5px; color:var(--ink-muted)}
.src .doi{font-family:var(--mono); font-size:12px}
.ev-badge{font:10.5px var(--mono); letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--rule-strong); border-radius:2px; padding:1px 6px; color:var(--ink-muted)}

/* ---- tables set like a paper's Table 2 ---- */
.tablewrap{overflow-x:auto; margin:0 0 8px}
table{border-collapse:collapse; min-width:430px; font-variant-numeric:tabular-nums}
caption{caption-side:top; text-align:left; font-size:14.5px; font-style:italic;
  color:var(--ink-muted); padding-bottom:8px; max-width:66ch}
caption b{font-style:normal; color:var(--ink); font-weight:600}
th{font:600 11.5px var(--mono); letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink-faint); text-align:left; padding:7px 22px 7px 0;
  border-top:2px solid var(--ink); border-bottom:1px solid var(--rule-strong)}
td{font:14px var(--mono); padding:8px 22px 8px 0; border-bottom:1px solid var(--rule); vertical-align:top}
tr:last-child td{border-bottom:2px solid var(--ink)}
td.best{font-weight:600}
td .ci{color:var(--ink-faint); font-size:12px}
.tnote{font-size:13px; color:var(--ink-muted); font-style:italic; max-width:66ch; margin:6px 0 0}
.tnote.warn{color:var(--pencil-red)}
.tnote-list{margin:6px 0 0;padding-left:18px}

/* ---- questions index: a table of contents with leaders ---- */
.toc{list-style:none; margin:0; padding:0}
.toc li{display:flex; align-items:baseline; gap:8px; padding:7px 0; border-bottom:1px dotted var(--rule)}
.toc a{text-decoration:none; color:var(--ink)}
.toc a:hover{color:var(--doi-blue)}
.leader{flex:1; border-bottom:1px dotted var(--rule-strong); transform:translateY(-4px); min-width:24px}
.toc .grade{font:12px var(--mono); white-space:nowrap}
.toc .grade .p{color:var(--stamp-pass)} .toc .grade .f{color:var(--pencil-red)} .toc .grade .o{color:var(--ink-faint)}

.colophon{border-top:1px solid var(--rule); margin-top:60px; padding-top:14px;
  font:12.5px var(--mono); color:var(--ink-faint); display:flex; gap:22px; flex-wrap:wrap}
.colophon a{color:var(--ink-faint)}

/* ---- the ask, front and centre ---- */
.askhome{max-width:640px; margin:0 auto; padding-top:34px; text-align:center}
.askhome h1{font-size:27px; margin-bottom:4px}
.askhome .sub{font-size:15.5px; color:var(--ink-muted); font-style:italic; margin:0 auto 24px; max-width:52ch}
.bigask{border:1.5px solid var(--rule-strong); background:#fff; border-radius:3px;
  display:flex; margin:0 0 10px; text-align:left;
  box-shadow:0 1px 0 var(--rule);}
.bigask input{flex:1; border:none; background:none; padding:16px 18px; font:17px var(--serif); color:var(--ink); min-width:0}
.bigask input::placeholder{color:var(--ink-faint); font-style:italic}
.bigask input:disabled{cursor:not-allowed}
.bigask button{font:600 12px var(--mono); letter-spacing:.1em; text-transform:uppercase;
  background:var(--ink); color:var(--paper); border:none; padding:0 22px; cursor:pointer}
.bigask.locked{background:var(--paper-inset)}
.bigask.locked button{background:var(--rule-strong); cursor:not-allowed}
.locknote{font:12.5px var(--mono); color:var(--ink-faint)}
.locknote a{color:var(--doi-blue)}
.examples{text-align:left; margin-top:44px}
.ungraded-note{border-left:3px solid var(--rule-strong); background:var(--paper-inset);
  padding:10px 15px; font-size:14px; color:var(--ink-muted); max-width:60ch; margin:0 0 22px}
.ungraded-note a{white-space:nowrap}

@media (max-width:640px){ .mast-nav{width:100%; order:3} }
