/* The Cosmetic Record — one stylesheet, no framework, no JavaScript, no webfonts.
   Tokens first, then layout, then components. */

:root{
  /* surfaces */
  --paper:       #FAF7F2;
  --paper-sunk:  #F1ECE3;
  --surface:     #FFFFFF;

  /* ink */
  --ink:         #16130F;
  --ink-2:       #4A443B;
  --ink-3:       #7A7266;

  /* structure */
  --rule:        #D9D1C4;
  --rule-strong: #C9C0B2;

  /* the single accent — the domain's equity is copper and red hair colour */
  --copper:      #8C3A12;
  --copper-lite: #A9532B;
  --copper-wash: #F0E4DC;

  /* evidence status — a word always accompanies the colour */
  --settled:     #2E5E5A;
  --contested:   #8A6A12;
  --insufficient:#5A5348;
  --flag:        #8C2F1F;

  /* market chips */
  --br-fg:#6B5312; --br-bg:#F2EAD6;
  --us-fg:#23536E; --us-bg:#E5EEF4;
  --eu-fg:#17563F; --eu-bg:#E5EFEA;

  --r: 2px;

  --font-prose: ui-serif, Charter, "Bitstream Charter", "Iowan Old Style",
                Georgia, "Times New Roman", serif;
  --font-ui:    ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
                "Helvetica Neue", Arial, sans-serif;
  --font-mono:  ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
                "Liberation Mono", monospace;

  --t-xs: 13px; --t-sm: 15px; --t-base: 17px; --t-lead: 21px;
  --t-h3: 24px; --t-h2: 30px; --t-h1: 36px; --t-display: 44px;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px;

  --w-prose: 41rem;
  --w-wide:  56rem;
}

*{box-sizing:border-box}
:where(body,h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote,table){margin:0}

html{-webkit-text-size-adjust:100%}
body{
  background:var(--paper); color:var(--ink);
  font:400 var(--t-base)/1.62 var(--font-prose);
  padding:0 var(--s5) var(--s9);
}
@media (min-width:900px){ body{padding-left:var(--s7);padding-right:var(--s7)} }

/* ── layout ───────────────────────────────────────────────────────────────── */
.page{display:grid;grid-template-columns:1fr min(var(--w-prose),100%) 1fr;}
.page > *{grid-column:2;}
.page > .wide{grid-column:1/-1;width:min(var(--w-wide),100%);margin-inline:auto;}

.page > * + *{margin-top:var(--s5)}
.page > h2{margin-top:var(--s8);margin-bottom:0;padding-top:var(--s4);
           border-top:1px solid var(--rule);position:relative}
.page > h2::before{content:"";position:absolute;top:-1px;left:0;width:56px;height:3px;
                   background:var(--copper)}
.page > h2 + *{margin-top:var(--s4)}
.page > h3{margin-top:var(--s6)}
.page > h3 + *{margin-top:var(--s3)}
.page > .wide, .page > .hero, .page > figure{margin-top:var(--s6);margin-bottom:var(--s6)}
.page > .sources{margin-top:var(--s8)}

/* ── type ─────────────────────────────────────────────────────────────────── */
h1,h2,h3,h4{font-family:var(--font-ui);font-weight:600;color:var(--ink)}
h1{font-size:var(--t-h1);line-height:1.15;letter-spacing:-0.015em}
h2{font-size:var(--t-h2);line-height:1.22;letter-spacing:-0.015em}
h3{font-size:var(--t-h3);line-height:1.30}
h4{font-size:var(--t-base);line-height:1.4}
.display{font-size:var(--t-display);line-height:1.10;letter-spacing:-0.015em}
@media (max-width:40rem){ .display{font-size:var(--t-h1)} }

.lead{font-size:var(--t-lead);line-height:1.40}
small,.xs{font-size:var(--t-xs);line-height:1.45}

code,kbd,samp,.mono,.id{font-family:var(--font-mono);font-variant-numeric:tabular-nums;
      font-size:0.92em}
em,i,cite{font-style:italic}
strong{font-weight:600}

/* ── links ────────────────────────────────────────────────────────────────── */
a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--copper);
  text-decoration-thickness:1px;text-underline-offset:0.18em}
a:hover{color:var(--copper);background:var(--copper-wash);
        text-decoration-thickness:2px}
a:focus-visible{outline:2px solid var(--copper);outline-offset:2px;background:var(--copper-wash)}
a.ext::after{content:" \2197";color:var(--ink-3);font-size:0.85em;text-decoration:none}

.skip{position:absolute;left:-9999px}
.skip:focus{position:static;display:inline-block;margin:var(--s3) 0;padding:var(--s2) var(--s3);
            background:var(--surface);box-shadow:0 2px 8px rgba(22,19,15,.25)}

/* ── masthead / nav / footer ──────────────────────────────────────────────── */
.masthead{padding-top:var(--s6)}
.wordmark{font-family:var(--font-ui);font-size:15px;font-weight:600;text-transform:uppercase;
          letter-spacing:0.14em;color:var(--ink);text-decoration:none;display:inline-block}
.wordmark:hover{background:none;color:var(--copper)}
.tagline{font-family:var(--font-ui);font-size:var(--t-xs);color:var(--ink-2);margin-top:var(--s1)}
.standing{font-family:var(--font-mono);font-size:12px;color:var(--ink-2);margin-top:var(--s1)}
.masthead-rule{height:1px;background:var(--rule);margin-top:var(--s4);position:relative}
.masthead-rule::before{content:"";position:absolute;top:0;left:0;width:96px;height:3px;
                       background:var(--copper)}
.nav{font-family:var(--font-ui);font-size:var(--t-xs);margin-top:var(--s3);
     display:flex;flex-wrap:wrap;gap:var(--s3);color:var(--ink-2)}

.breadcrumb{font-family:var(--font-ui);font-size:var(--t-xs);color:var(--ink-3)}
.kind{font-family:var(--font-ui);font-size:var(--t-xs);font-weight:600;text-transform:uppercase;
      letter-spacing:0.12em;color:var(--copper)}
.byline{font-family:var(--font-ui);font-size:var(--t-xs);color:var(--ink-3)}

.site-footer{margin-top:var(--s9);padding-top:var(--s4);border-top:1px solid var(--rule);
             font-family:var(--font-ui);font-size:var(--t-xs);color:var(--ink-2)}
.site-footer p + p{margin-top:var(--s2)}

/* ── hero ─────────────────────────────────────────────────────────────────── */
.hero{aspect-ratio:3/1;overflow:hidden;background:var(--surface);border:1px solid var(--rule)}
.hero img{width:100%;height:100%;object-fit:cover;object-position:left center;display:block}
@media (max-width:640px){ .hero{aspect-ratio:2/1} }
.hero-home img{object-position:center center}

/* ── the claim panel ──────────────────────────────────────────────────────── */
.claim{background:var(--paper-sunk);border:1px solid var(--rule);padding:var(--s4)}
.claim dt{font-family:var(--font-ui);font-size:var(--t-xs);font-weight:600;text-transform:uppercase;
          letter-spacing:0.12em;color:var(--ink-2)}
.claim dd{margin:var(--s1) 0 0}
.claim dd + dt{margin-top:var(--s4)}
.claim .answer{font-size:var(--t-lead);line-height:1.40;color:var(--ink)}

.status{font-family:var(--font-ui);font-size:var(--t-xs);font-weight:600;text-transform:uppercase;
        letter-spacing:0.12em;text-decoration-color:currentColor}
.status-settled{color:var(--settled)}
.status-contested{color:var(--contested)}
.status-insufficient{color:var(--insufficient)}

/* ── quoted statute ───────────────────────────────────────────────────────── */
.statute{font-family:var(--font-mono);font-size:var(--t-sm);line-height:1.55;
         background:var(--paper-sunk);border-left:3px solid var(--copper);padding:var(--s4)}
.statute + cite, .statute-cite{display:block;font-family:var(--font-ui);font-size:var(--t-xs);
         font-style:normal;color:var(--ink-2);margin-top:var(--s2)}

/* ── tables and the three-market box ──────────────────────────────────────── */
table{border-collapse:collapse;width:100%;font-family:var(--font-ui);font-size:var(--t-sm)}
caption{font-family:var(--font-ui);font-size:var(--t-xs);color:var(--ink-2);text-align:left;
        padding-bottom:var(--s2)}
th{text-align:left;font-weight:600;border-bottom:2px solid var(--rule-strong);padding:var(--s3)}
td{border-bottom:1px solid var(--rule);padding:var(--s3);vertical-align:top}
td.norule{color:var(--ink-3)}

.chip{font-family:var(--font-mono);font-size:11px;letter-spacing:0.06em;padding:2px 6px;
      border-radius:var(--r);font-weight:500}
.chip-br{color:var(--br-fg);background:var(--br-bg)}
.chip-us{color:var(--us-fg);background:var(--us-bg)}
.chip-eu{color:var(--eu-fg);background:var(--eu-bg)}

@media (max-width:640px){
  .stacked thead{position:absolute;left:-9999px}
  .stacked tr{display:block;border-bottom:1px solid var(--rule-strong);padding:var(--s3) 0}
  .stacked td{display:block;border:0;padding:var(--s1) 0}
  .stacked td::before{content:attr(data-label);display:block;font-size:var(--t-xs);
        font-weight:600;color:var(--ink-2)}
}

/* ── uncertainty box ──────────────────────────────────────────────────────── */
.unverified{background:var(--paper-sunk);border:1px solid var(--rule);padding:var(--s4)}
.unverified h2,.unverified h3{margin-top:0}

/* ── the claims list (homepage) ───────────────────────────────────────────── */
.claims{border-top:1px solid var(--rule)}
.claims .row{padding:var(--s5) 0;border-bottom:1px solid var(--rule)}
.claims dt{font-family:var(--font-ui);font-size:var(--t-xs);font-weight:600;text-transform:uppercase;
           letter-spacing:0.12em;color:var(--ink-3)}
.claims dt.says{color:var(--copper)}
.claims dd{margin:var(--s1) 0 0}
.claims dd.belief{font-size:var(--t-lead);line-height:1.4}
.claims dd + dt{margin-top:var(--s3)}
.claims .more{margin-top:var(--s3);font-family:var(--font-ui);font-size:var(--t-sm)}

/* ── article index ────────────────────────────────────────────────────────── */
.index-list{list-style:none;padding:0;border-top:1px solid var(--rule)}
.index-list li{padding:var(--s5) 0;border-bottom:1px solid var(--rule)}
.index-list h3{margin:0}
.index-list p{margin-top:var(--s2)}
.index-list .byline{margin-top:var(--s2)}

/* ── sources and footnotes ────────────────────────────────────────────────── */
.sources{border-top:1px solid var(--rule-strong);padding-top:var(--s4)}
.sources h2{border:0;padding:0;margin-top:0}
.sources h2::before{display:none}
.sources ol{font-family:var(--font-ui);font-size:var(--t-sm);line-height:1.55;
            padding-left:var(--s5)}
.sources li{margin-top:var(--s3)}
.sources li:target{background:var(--copper-wash)}
sup a{font-family:var(--font-mono);color:var(--copper);text-decoration:none}
sup a:hover{background:var(--copper-wash)}
[id^="fn"]{scroll-margin-top:2rem}

.disclose{font-style:italic;color:var(--ink-2)}

/* ── corrections ──────────────────────────────────────────────────────────── */
.correction{border-left:3px solid var(--flag);background:var(--paper-sunk);padding:var(--s4)}
.correction time{font-family:var(--font-mono);font-size:var(--t-xs);color:var(--ink-2)}

hr{border:0;border-top:1px solid var(--rule);margin:var(--s6) 0}
figcaption{font-family:var(--font-ui);font-size:var(--t-xs);color:var(--ink-2);margin-top:var(--s2)}
ul,ol{padding-left:var(--s5)}
li + li{margin-top:var(--s2)}
dl.plain dt{font-weight:600;margin-top:var(--s3)}

/* ── print: a reference work that prints badly is not a reference work ────── */
@media print{
  body{background:#fff;color:#000;font-size:11pt;padding:0}
  .nav,.hero,.skip,.breadcrumb,.masthead-rule{display:none}
  .page{display:block;max-width:none}
  a{color:#000;text-decoration:underline}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all}
  .claim,.statute,.unverified,.correction{border:1px solid #999;background:#fff}
  h2,h3{break-after:avoid}
  table,figure,.claim{break-inside:avoid}
}

/* contact form */
.contact-form label{font-weight:600}
.contact-form input,.contact-form textarea{width:100%;max-width:38rem;padding:.5rem;font:inherit;border:1px solid #999;border-radius:4px;background:#fff;color:#111}
.contact-form textarea{resize:vertical}
.contact-form button{padding:.55rem 1.4rem;font:inherit;cursor:pointer;border:1px solid #333;border-radius:4px}
.cf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}