@import url('https://fonts.googleapis.com/css2?family=Parkinsans:wght@500..800&display=swap');
/* Theme 1, Catalogue. Its tokens are the defaults in app.css (:root), so this file carries only the arrangement and
   the decoration, scoped to "no data-theme" and data-theme="c1". Material: a flat Prussian-blue field; each
   endpoint a drawer label in a pale cyanotype frame; each answer a ruled index card with rounded corners, as
   library cards have; the state is a rubber stamp whose form (filled box, double rule, dashed, thin pencil, bare
   tick) carries it as much as its ink. Red is kept for Not true alone; the primary button is card stock. Entries
   and marks are set in Parkinsans. No grid or texture, no glow, no tilt. */
:root[data-theme="c1"]{color-scheme:light}

:is(:root:not([data-theme]),:root[data-theme="c1"]){
  --display:'Parkinsans','Archivo','Arial',system-ui,sans-serif;
  --r:14px;
  --r-sm:8px;
  --r-tile:0;
  --r-card:20px;
  --card-pad:22px;
  --stock-back:#E9E2D6;
  --on-field-line:rgba(255,255,255,.22);
  --link-quiet:rgba(255,255,255,.55);
  --link-signal:#F4B6AE;
  --hit:#F1EADC;
  background:var(--field);

  ::selection{background:#BFD9EA;color:#1E1A16}
  body{background:var(--field);color:var(--on-field);font-size:15.5px;line-height:1.55;letter-spacing:0;scrollbar-color:var(--frame) var(--field)}
  a{text-underline-offset:4px;text-decoration-thickness:1px}

  /* Field context: anything set straight on the field reads the field tokens */
  .top,.catch,.ph,.tabs,.legends,.foot,.jg > section > h2,.story,.jg .also{
    --ink:var(--on-field);--muted:var(--on-field-muted);--cite:var(--on-field-muted);--edge:var(--on-field-muted);--line:var(--on-field-line);--focus:#FFFFFF;
    color:var(--ink);
  }
  /* Card context: everything filed on a card reads the card tokens again */
  .ans,.ep-row,.pages,.menu,.summary,.judge-page .catchline,.judge-page .ev,.judge-page .paths{color:var(--ink)}

  /* Header: the wordmark as a label card in a cyanotype frame */
  .top{border-bottom:var(--hair) solid var(--on-field-line);padding-block:14px;font-size:13.5px}
  .word{display:inline-block;font:800 19px/1 var(--display);letter-spacing:-.01em;color:#1E1A16;background:var(--bg);padding:6px 11px 6px;border-radius:10px;box-shadow:0 0 0 2px var(--frame);text-decoration:none}
  .top .judge,.top .replay.judge{font-weight:600}
  .theme-switch label > span:not(.sr){font-family:var(--display);font-stretch:75%;font-weight:700}
  .theme-switch input:checked + span{color:#0E2138;background:var(--frame);box-shadow:none}
  .theme-switch label:hover input:checked + span{background:var(--frame)}
  .theme-switch label:hover > span:not(.sr){background:rgba(255,255,255,.12)}
  .theme-select{background:var(--bg);color:#1E1A16;border:2px solid var(--frame);border-radius:999px;font-family:var(--sans)}
  .catch .bar{background:rgba(255,255,255,.16)}

  /* The finding: a main entry set straight on the field */
  .catch > h1{order:-1;margin-top:0}
  .kicker{order:0;margin-top:16px;font:500 15px/1.4 var(--sans);color:var(--on-field)}
  .kicker b{font-weight:800;color:#FFFFFF}
  .kicker svg{color:var(--link-signal)}
  .kicker.calm svg{color:var(--on-field-muted)}
  h1{font-family:var(--display);font-weight:700;font-stretch:112%;letter-spacing:-.012em;font-size:44px;line-height:1.08;margin-top:14px}
  h1 .ep{font-family:var(--mono);font-weight:800;font-size:.84em;letter-spacing:-.02em;box-shadow:inset 0 -.12em 0 rgba(244,182,174,.55)}
  .lede.delta{color:var(--on-field);margin-top:12px;font-size:15.5px}
  .todo{margin-top:28px}
  /* Secondary actions are outlined pills, never underlined text: the primary's shape, drawn in line */
  .todo .link,.top a.judge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--on-field-muted);color:var(--on-field);text-decoration:none;font-family:var(--display);font-weight:700;letter-spacing:.01em}
  .todo .link{min-height:46px;padding:0 20px}
  .top a.judge{min-height:32px;padding:0 14px}
  .todo .link:hover,.top a.judge:hover{background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1.5px var(--on-field)}
  .status{color:var(--on-field-muted)}
  .catch > .rule-draw{height:2px;background:var(--frame);opacity:.65}

  /* Buttons: square, set in the label face */
  .btn{font-family:var(--display);font-weight:700;letter-spacing:.01em;border-radius:999px}
  .btn.primary{background:var(--bg);color:#1E1A16;box-shadow:0 1px 0 rgba(0,0,0,.25)}
  .btn.primary:hover{background:var(--surface)}
  .judge-page .catchline .btn.primary{background:var(--field);color:var(--on-field);box-shadow:none}
  .judge-page .catchline .btn.primary:hover{background:var(--board)}
  .btn.ghost{border-color:var(--edge);color:var(--ink)}
  .btn.ghost:hover{background:var(--raise)}
  .ph .btn.ghost{border-color:var(--on-field);color:var(--on-field)}
  .ph .btn.ghost:hover{background:rgba(255,255,255,.12)}
  .ph .btn:disabled{border-color:var(--on-field-line);color:var(--on-field-muted)}
  .btn:disabled{color:var(--muted)}

  /* The tally: a filed card in the top right, one line per state */
  .summary{--ink:#1E1A16;--muted:#5E5A55;--cite:#3A3631;--line:#C9DCE4;position:relative;background:var(--bg);color:var(--ink);padding:16px var(--card-pad) 18px;border-radius:18px;box-shadow:0 0 0 2px var(--frame)}
  .summary h2{font:700 11.5px/1.3 var(--display);text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding-bottom:10px;margin-bottom:0;border-bottom:2px solid var(--rule-cyan)}
  .summary dl{border-top:0}
  .summary .sm{padding:8px 0;border-bottom:var(--hair) solid var(--line)}
  .summary dt{font-size:14.5px}
  .summary .sm.bad:not(.zero) dt{font-weight:700}
  .summary .sm.bad dt svg{color:var(--act)}
  .summary .num-tile{min-width:0;font:800 22px/1 var(--display);font-stretch:75%;color:var(--ink)}
  .summary .sm.bad:not(.zero) dd{background:var(--act);padding:3px 8px 2px;border-radius:7px}
  .summary .sm.bad:not(.zero) .num-tile{color:#FFFFFF}
  .summary .sm.zero .num-tile{color:var(--muted)}
  .summary p{color:var(--muted);font-size:13px}

  /* Pane heads and mobile tabs on the field */
  .ph h2{font:700 13px/1.3 var(--display);font-stretch:75%;text-transform:uppercase;letter-spacing:.08em;color:var(--on-field)}
  .tabs{border-bottom-color:var(--on-field-line)}
  .tabs button{color:var(--on-field-muted);font-family:var(--display);font-weight:700}
  .tabs button[aria-selected=true]{color:var(--on-field);border-bottom-color:var(--frame);border-bottom-width:3px}
  .tabs .ct{color:var(--on-field-muted);font-family:var(--mono)}

  /* Endpoints: drawer labels, a white card in a cyanotype frame */
  #endpoints{gap:14px}
  .ep-row{background:var(--bg);border:0;box-shadow:0 0 0 1px rgba(164,198,222,.6);padding:14px 16px 16px}
  .ep-row:hover{background:var(--surface)}
  .ep-row.sel{background:var(--surface);box-shadow:0 0 0 2px var(--act)}
  .ep-row .path{font:700 15px/1.3 var(--mono);color:var(--ink)}
  .ep-row .via{color:var(--muted);text-decoration:underline dotted var(--edge);text-underline-offset:4px}
  .ep-row .finding{color:var(--ink)}
  .ep-row.changed .path::after{font:700 11px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--stamp-stale);border:1px solid currentColor;border-radius:5px;padding:2px 5px 1px;vertical-align:2px}
  .recheck .rc{color:var(--muted)}
  .recheck .btn.ghost{border-color:transparent;background:var(--raise);color:var(--stamp-confirm)}
  .recheck .btn.ghost:hover{background:var(--ruled)}
  /* Pushed back, not faded: a related-away or recomputing card keeps opaque stock in a darker shade */
  .dimmed,.recomputing .ep-row,.recomputing .ans{opacity:1}
  .ans.dimmed,.recomputing .ans{background:var(--stock-back)}
  .ep-row.dimmed,.recomputing .ep-row{background:var(--stock-back);box-shadow:0 0 0 2px rgba(164,198,222,.45)}

  /* Stamps: badges and chips share one grammar; the state is in the frame as much as the ink */
  .badge,.chip{font:700 12px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;background:none;padding:5px 8px 4px;border:2px solid currentColor;border-radius:8px;color:var(--ink);gap:5px}
  .chip{font-size:11px;padding:3px 6px 2px;border-width:1.5px;border-radius:6px}
  .chip .mono{font-family:var(--display);font-weight:800;letter-spacing:.04em}
  .badge.bad,.chip.bad{background:var(--act);border-color:var(--act);color:#FFFFFF}
  .badge.stale,.chip.stale{color:var(--stamp-stale);background:color-mix(in srgb, var(--stamp-stale) 9%, transparent);border-style:double;border-width:4px;padding:3px 6px 2px}
  .chip.stale{border-width:3px;padding:2px 4px 1px}
  .badge.confirm,.chip.confirm{color:var(--stamp-confirm);background:color-mix(in srgb, var(--stamp-confirm) 7%, transparent);border-style:dashed}
  .badge.held,.chip.held{color:var(--stamp-held);background:color-mix(in srgb, var(--stamp-held) 7%, transparent);border-width:1px;padding:6px 8px 5px}
  .chip.held{padding:4px 6px 3px}
  .badge.ok{border-color:transparent;padding-inline:0;color:var(--ink)}

  /* Answers: ruled index cards, the head line red only on the card that is not true */
  #answers{display:grid;gap:18px}
  .ans{position:relative;background:var(--bg);border:0;border-radius:var(--r-card);padding:20px var(--card-pad) 24px;box-shadow:0 1px 0 rgba(0,0,0,.25)}
  #answers .ans:last-child{border-bottom:0}
  .ans .body{margin:16px calc(var(--card-pad) * -1) 0 calc((var(--card-pad) + 44px) * -1);padding:14px var(--card-pad) 0 calc(var(--card-pad) + 44px);border-top:2px solid var(--rule-cyan)}
  .ans.sel,.ans.stale{border:0;border-radius:var(--r-card);background:var(--surface)}
  .ans.sel .body{border-top-color:var(--act)}
  .ans.sel{box-shadow:0 0 0 2px var(--act)}
  .ans.sel + .ans,.ans.stale + .ans{border-top-color:transparent}
  .ans.sel + .ans.stale{margin-top:0}
  .ans .n{font:800 15px/1.9 var(--display);letter-spacing:.02em;color:var(--muted)}
  .ans h3{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.005em;line-height:1.3}
  .ans .body p{font-size:15.5px;max-width:68ch}
  .ans.changed h3::after{font:700 11px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--stamp-stale);border:1px solid currentColor;border-radius:5px;padding:2px 5px 1px}
  blockquote{border-left:0;padding-left:0;margin-top:12px;font-size:15px;color:var(--cite);max-width:70ch}
  .ans .body p.src{color:var(--muted)}
  .src a{color:var(--stamp-confirm);text-decoration-color:var(--rule-cyan)}
  .src a:hover{color:var(--ink);text-decoration-color:var(--ink)}
  .per{border-top:var(--hair) solid var(--line);padding-top:14px;margin-top:16px}
  .per dt{font-family:var(--mono);color:var(--muted)}
  .per .x dt,.per .x dd{color:var(--act)}
  table.kv{border-color:var(--line)}
  .kv th,.kv td{border-top-color:var(--line)}
  .kv tr.hit th,.kv tr.hit td{background:var(--hit);font-weight:600}
  .kv tr.hit th{box-shadow:none}
  figure.ev figcaption{color:var(--muted)}
  details.more summary{color:var(--stamp-confirm);font-weight:600}
  .confirm-box{border:1px dashed var(--stamp-confirm);background:var(--surface)}
  .confirm-box li{border-top-color:var(--line)}

  /* Fix panel: the strike and the insertion, as on a corrected card */
  .panel{border-top:2px solid var(--rule-cyan)}
  .panel h4,.panel label{font:700 12px/1.3 var(--display);font-stretch:75%;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
  .panel .was{text-decoration-color:var(--act);text-decoration-thickness:2px}
  .panel textarea{background:var(--surface);border:1px solid var(--edge);font-family:var(--sans);font-size:15px}

  /* Vendor pages: a shelf-list card under the drawers */
  .pages{background:var(--bg);color:var(--ink);padding:16px 18px 6px;margin-top:24px;border-radius:18px}
  .pages h3{color:var(--ink);font:700 12px/1.3 var(--display);font-stretch:75%;text-transform:uppercase;letter-spacing:.08em;padding-bottom:10px;border-bottom:2px solid var(--rule-cyan)}
  .pages h3 span{color:var(--muted);text-transform:none;letter-spacing:0;font-family:var(--sans);font-stretch:100%;font-weight:400;font-size:12.5px}
  .pages li{color:var(--cite);border-top-color:var(--line)}
  .pages li:first-child{border-top:0}
  .pages li:last-child{border-bottom:0}
  .pages li a{color:var(--ink);font-weight:600}
  .pages .reset{color:var(--muted);border-top:var(--hair) solid var(--line);padding:6px 0 10px;margin-top:0}
  .legends{margin-top:16px}
  .legend{color:#DCE7F2;font-size:13px}
  .legend .lh{color:var(--on-field);font-family:var(--display);font-stretch:75%;text-transform:uppercase;letter-spacing:.06em}
  .legend i{color:var(--on-field)}

  /* Connectors run over the field: pale red for Not true, chalk for Stale */
  #link path{stroke:var(--link-signal);stroke-width:2}
  #link circle{fill:var(--link-signal);stroke:var(--field)}
  #link .quiet{stroke:var(--link-quiet);stroke-dasharray:4 3}
  #link circle.quiet{fill:var(--link-quiet)}

  /* Menu and toast */
  .menu{background:var(--bg);border:0;box-shadow:0 0 0 2px var(--frame),0 10px 24px -8px rgba(0,0,0,.45)}
  .menu button:hover,.menu button:focus-visible{background:var(--raise)}
  .menu b{font-family:var(--display)}
  .toast{background:#1E1A16;color:#FFFFFF;border:0;border-radius:12px;box-shadow:0 0 0 2px var(--frame)}
  .foot{color:#DCE7F2;font-size:13.5px;max-width:96ch}

  /* Start page: the opening line on the field, the catch on a filed card, the numbers on drawer fronts */
  .judge-page .story .kick{display:none}
  .judge-page .story h1{font-stretch:108%;font-size:clamp(30px,3.3vw,48px);line-height:1.1;grid-column:1/span 11;margin-top:0}
  .judge-page .lede{margin-top:44px;padding-top:0;align-items:start}
  .judge-page .lede > .rule-draw{display:none}
  .judge-page .story .what{color:#DCE7F2;font-size:17px;line-height:1.6;grid-column:1/span 5}
  .judge-page .catchline{--ink:#1E1A16;--muted:#5E5A55;--cite:#3A3631;--line:#C9DCE4;--edge:#6A645C;--focus:#2D3E66;grid-column:7/-1;position:relative;background:var(--bg);color:var(--ink);padding:24px var(--card-pad) 26px;border-radius:22px;grid-template-columns:minmax(0,1fr);gap:16px;font-size:17px}
  .judge-page .catchline::before{content:"";position:absolute;left:0;right:0;top:74px;height:2px;background:var(--act)}
  .judge-page .badge.catch-mark{justify-self:start;height:auto;padding:0;margin:0 0 6px;font:800 14px/1 var(--display);letter-spacing:.07em;border-radius:9px;overflow:hidden}
  .judge-page .badge.catch-mark .lbl{padding:9px 14px 8px;gap:8px}
  .catch-phrase{box-shadow:inset 0 -.38em 0 #F6D7D3}
  .catch-text{color:var(--ink)}
  .judge-page .catchline .act{margin-top:18px}

  /* Drawer fronts: the board band in deeper Prussian blue, each number on a label card held by a cyanotype frame, a pull below */
  .judge-page .stat-board{--ink:#FFFFFF;--muted:var(--on-field-muted);--cite:var(--on-field-muted);--line:rgba(0,0,0,.35);margin-top:80px;padding:34px 0 40px}
  .judge-page .jg .big{color:var(--on-field);font:500 16px/1.45 var(--sans);margin-bottom:28px;max-width:none}
  .judge-page .stats{gap:var(--col)}
  .judge-page .stat,.judge-page .stat + .stat{padding:36px 20px 30px;border:0;border-radius:24px;display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--field);box-shadow:inset 0 0 0 1px rgba(0,0,0,.35),inset 0 2px 0 rgba(255,255,255,.07)}
  .judge-page .stat{--d:clamp(64px,7.4vw,112px)}
  .judge-page .stat .v{position:relative;background:var(--bg);color:#1E1A16;padding:.1em .26em .04em;border-radius:16px;box-shadow:0 0 0 4px var(--frame),inset 0 0 0 1px rgba(0,0,0,.08);line-height:1}
  .judge-page .stat .v::after{content:none}
  .judge-page .num-row{gap:0}
  .judge-page .num-tile,.judge-page .num-sep{width:.62em;height:1.04em;background:none;border-radius:0;perspective:none}
  .judge-page .num-sep{width:.4em}
  .judge-page .num-tile .h{background:none}
  .judge-page .num-tile .h::after,.judge-page .num-sep::after{color:#1E1A16;font-weight:800;font-stretch:75%}
  .judge-page .num-sep::after{color:#5E5A55}
  .judge-page .stat .c{margin-top:22px;color:var(--on-field);font:600 16px/1.45 var(--sans);max-width:24ch}
  .judge-page .stat.skel .v{min-width:3.4em;min-height:1.1em}
  .judge-page .stat.skel .c .bar{background:rgba(255,255,255,.16)}

  /* Method, paths and evidence: shelf-list cards, rows ruled in cyan */
  .judge-page .ev{--ink:#1E1A16;--muted:#5E5A55;--cite:#3A3631;--line:#C9DCE4;--edge:#6A645C;--focus:#2D3E66;background:var(--bg);color:var(--ink);padding:4px var(--card-pad);border-radius:18px}
  .judge-page .ev li{border-top-color:var(--line)}
  .judge-page .ev li:first-child{border-top:0}
  .judge-page .ev li:last-child{border-bottom:0}
  .judge-page .ev li b,.judge-page .ev > li > a{font-family:var(--display);font-weight:700}
  .judge-page .ev.method{margin-top:28px}
  .judge-page .ev.method li > b{font:700 12px/1.6 var(--display);font-stretch:75%;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
  .recompute a{color:var(--stamp-confirm)}
  code.cmd{background:var(--surface);border:1px solid var(--line);border-radius:8px;font-family:var(--mono);color:var(--ink)}
  .judge-page .jg h2{font-family:var(--display);font-stretch:112%;font-weight:700;font-size:30px;letter-spacing:-.01em;color:var(--on-field)}

  .judge-page .paths{--ink:#1E1A16;--muted:#5E5A55;--cite:#3A3631;--line:#C9DCE4;--focus:#2D3E66;display:block;background:var(--bg);padding:0 var(--card-pad);border-radius:22px}
  .judge-page .paths li + li{border-top:var(--hair) solid var(--line)}
  .judge-page .path-card{display:grid;grid-template-columns:72px minmax(0,4fr) minmax(0,7fr) 150px;column-gap:var(--col);align-items:baseline;padding:22px 0;border:0;background:none;height:auto}
  .judge-page .path-card:hover{background:none}
  .judge-page .path-card .step{grid-row:1/3;font:800 44px/1 var(--display);font-stretch:75%;color:var(--muted)}
  .judge-page .path-card .t{grid-column:2;font-size:22px}
  .judge-page .path-card .tag{grid-column:2;grid-row:2;font:700 11.5px/1.35 var(--display);font-stretch:75%;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
  .judge-page .path-card .d{grid-column:3;grid-row:1/3;margin:0;color:var(--cite);max-width:62ch}
  .judge-page .path-card .go{grid-column:4;grid-row:1/3;padding:0;align-self:center;justify-self:end;font-family:var(--display);color:var(--stamp-confirm);white-space:nowrap}
  .judge-page .path-card:hover .go svg{transform:translateX(3px)}
  .judge-page .jg .also{color:var(--on-field-muted)}
  .judge-page .jg .also a,.judge-page .foot a{color:var(--on-field)}
  .judge-page .jg .also code{font-family:var(--mono);color:var(--on-field)}

  /* Start page opening: the cyanotype still of the card drawer behind the line, bled to the window edges. The
     scrim (the /about hero's, in the same deep Prussian blue) sits on the left, where the words are; the drawer
     stays clear on the right. The finding card and the status key sit on card stock in the left column. */
  .judge-page .jg .story{position:relative;isolation:isolate}
  .judge-page .hero-art{display:block;position:relative;z-index:-1;grid-column:1/-1;grid-row:1/3;margin:-72px calc(50% - 50vw) 0;overflow:hidden;background:var(--board)}
  .judge-page .hero-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:100% 30%}
  .judge-page .hero-art::after{content:"";position:absolute;inset:0;background:
    linear-gradient(90deg, rgba(14,33,56,.86) 0%, rgba(14,33,56,.76) 44%, rgba(14,33,56,.3) 62%, rgba(14,33,56,0) 76%),
    linear-gradient(180deg, rgba(14,33,56,.62) 0%, rgba(14,33,56,.5) 28%, rgba(14,33,56,0) 46%, rgba(18,42,70,0) 80%, #122A46 100%)}
  .judge-page .story h1{grid-row:1;grid-column:1/span 10;font-size:clamp(30px,2.75vw,40px);line-height:1.16;letter-spacing:-.01em}
  .judge-page .story > .lede{grid-row:2;margin-top:44px;padding-bottom:104px}
  .judge-page .story .what{grid-column:1/span 6;grid-row:1}
  .judge-page .story .what > p{max-width:none}
  .judge-page .status-key{--ink:#1E1A16;--muted:#5E5A55;display:inline-flex;gap:10px 16px;margin-top:18px;padding:11px 14px;background:var(--bg);border-radius:14px;box-shadow:0 0 0 2px var(--frame);width:100%;box-sizing:border-box;justify-content:space-between}
  .judge-page .story .catchline{grid-column:1/span 6;grid-row:2;margin-top:32px}
  .judge-page .catchline .cl{font-size:17px;line-height:1.45}
  .judge-page .catchline .who{font:700 11.5px/1.4 var(--display);letter-spacing:.08em;color:var(--muted)}
  .judge-page .catchline .said{font-size:18.5px}
  .judge-page .catchline .why-row{padding-top:12px;border-top:var(--hair) solid var(--line);margin-top:14px;color:var(--cite)}
  .judge-page .story .stat-board{margin-top:0}

  @media (max-width:900px){
    .top{padding-block:10px}
    .word{font-size:16px;padding:5px 8px 4px}
    .theme-select{padding:3px 8px;background:transparent;color:var(--on-field);border:1.5px solid var(--on-field-line)}
    .theme-select option{color:#1E1A16;background:var(--bg)}
    .todo{flex-wrap:wrap}
    .todo .link{white-space:nowrap}
    h1{font-size:27px;line-height:1.12}
    .ans{padding:16px 14px 32px}
    .ans .body{margin:12px -14px 0;padding:12px 14px 0}
    .top .ctx{white-space:normal;overflow:visible;line-height:1.3}
    .top .fict{display:block;margin-left:0}
    .top .fict::before{content:none}
    .judge-page .story .what{grid-column:1/-1;grid-row:2}
    .judge-page .catchline{grid-row:1}
    .ans h3{font-size:18px}
    #endpoints{gap:12px}
    .pages{padding:12px 14px 4px}
    .judge-page .story h1{font-size:clamp(24px,6.6vw,34px);line-height:1.15;grid-column:1/-1;margin-top:18px}
    .judge-page .lede{margin-top:28px}
    .judge-page .story .what{font-size:16px}
    .judge-page .catchline{grid-column:1/-1;padding:18px 16px 34px;margin:0 0 28px;font-size:16px}
    .judge-page .catchline::before{top:64px}
    .judge-page .stat-board{margin-top:56px;padding:26px 0 30px}
    .judge-page .stats{gap:12px}
    .judge-page .stat,.judge-page .stat + .stat{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:center;justify-items:start;text-align:left;padding:18px 16px 30px}
    .judge-page .stat{--d:clamp(46px,13vw,64px)}
    .judge-page .stat .c{margin-top:0;font-size:15px}
    .judge-page .ev{padding:2px 16px}
    .judge-page .paths{padding:0 16px}
    .judge-page .path-card{grid-template-columns:44px minmax(0,1fr);row-gap:6px;padding:18px 0}
    .judge-page .path-card .step{grid-row:1/2;font-size:34px}
    .judge-page .path-card .t{grid-column:2;grid-row:1}
    .judge-page .path-card .tag{grid-column:2;grid-row:2}
    .judge-page .path-card .d{grid-column:1/-1;grid-row:3;margin-top:6px}
    .judge-page .path-card .go{grid-column:1/-1;grid-row:4;padding-top:8px;justify-self:start}
    .judge-page .jg h2{font-size:24px}
    .judge-page .hero-art{grid-row:1;margin-top:-40px}
    .judge-page .hero-art img{object-position:100% 30%}
    .judge-page .hero-art::after{background:linear-gradient(180deg, rgba(14,33,56,.86) 0%, rgba(14,33,56,.8) 72%, rgba(14,33,56,.35) 90%, #1B3A5E 100%)}
    .judge-page .story h1{padding-bottom:min(18vw,84px)}
    .judge-page .story > .lede{margin-top:4px;padding-bottom:0}
    .judge-page .story .what > p{max-width:none}
    .judge-page .status-key{display:flex;justify-content:flex-start;gap:10px 8px;padding:10px}
    .judge-page .story .catchline{grid-column:1/-1;grid-row:1;margin-top:0}
    .judge-page .catchline .said{font-size:17px}
    .judge-page .story .stat-board{margin-top:48px}
  }
}

/* Motion: each stamp inks onto its card once; the drawer labels rise into their frames when the board comes on
   screen. Content is visible by default; reduced motion keeps everything still (app.css). */
@media (prefers-reduced-motion:no-preference){
  :is(:root:not([data-theme]),:root[data-theme="c1"]){
    #answers .badge,.catch-mark .lbl,.summary .sm.bad:not(.zero) dd{animation:c1-stamp .34s cubic-bezier(.2,.9,.25,1) both}
    #answers .ans:nth-child(2) .badge{animation-delay:.06s}
    #answers .ans:nth-child(3) .badge{animation-delay:.12s}
    #answers .ans:nth-child(4) .badge{animation-delay:.18s}
    #answers .ans:nth-child(5) .badge{animation-delay:.24s}
    .judge-page .catch-mark .lbl{animation-delay:.6s}
    &.motion .judge-page .stat-board.num-in .stat .v > .num-row{animation:c1-rise .55s cubic-bezier(.16,1,.3,1) both}
    &.motion .judge-page .stat-board.num-in .stat:nth-child(2) .v > .num-row{animation-delay:.08s}
    &.motion .judge-page .stat-board.num-in .stat:nth-child(3) .v > .num-row{animation-delay:.16s}
    .catch > .rule-draw{animation:c1-draw var(--dur-draw) var(--ease) var(--delay-draw) both}
  }
}
@keyframes c1-stamp{0%{opacity:0}100%{opacity:1}}
@keyframes c1-rise{from{transform:translateY(.5em);clip-path:inset(0 0 50% 0)}to{transform:none;clip-path:inset(0)}}
@keyframes c1-draw{from{transform:scaleX(0)}}

/* Answer screen: three surfaces instead of one. The stack and the vendor pages are deep Prussian drawers, the tally
   is a pale cyanotype card, and each answer card carries its state as a faint wash. Scoped to #app, so /judge and
   /about are untouched. */
#app{
  --ep-bg:#122A46;
  --ep-hover:#16314F;
  --ep-ink:#FFFFFF;
  --ep-muted:#C7D8EA;
  --ep-line:rgba(164,198,222,.32);
  --wash-bad:#F9ECEA;
  --wash-stale:#E4EEF0;
  --wash-slate:#ECEDF0;
  --wash-ok:#DDEAF2;
  --wash-tally:#D9E8F1;
}
#app .catch > h1{font-size:40px;line-height:1.1;max-width:22em}
#app .kicker .st{color:var(--on-field)}
#app .kicker svg{color:var(--frame)}
#app #link{display:none}

/* Tally */
#app .summary{--ink:#1E1A16;--muted:#4A5560;--cite:#33404C;--line:#B4CCDB;background:var(--wash-tally);box-shadow:none}
#app .summary h2{border-bottom-color:#7FB6CF}
#app .summary .sm.zero .num-tile{color:var(--muted)}

/* Stack: endpoint drawers on deep Prussian */
#app .ep-row{--ink:var(--ep-ink);--muted:var(--ep-muted);--cite:var(--ep-muted);--edge:var(--ep-muted);--line:var(--ep-line);--focus:#FFFFFF;background:var(--ep-bg);color:var(--ep-ink);box-shadow:inset 0 0 0 1px var(--ep-line)}
#app .ep-row:hover{background:var(--ep-hover)}
#app .ep-row.sel{background:var(--ep-bg);box-shadow:inset 0 0 0 2px var(--link-signal)}
#app .ep-row .via{color:var(--ep-muted);text-decoration-color:var(--frame)}
#app .ep-row .via:hover{color:var(--ep-ink)}
#app .ep-row .finding{color:#E6EEF6}
#app .ep-row .finding.dim{color:var(--ep-muted)}
#app .ep-row .chip.stale{color:var(--frame);background:rgba(164,198,222,.1)}
#app .ep-row .chip.confirm,#app .ep-row .chip.held{color:var(--ep-muted);background:transparent}
#app .ep-row.changed .path::after{color:var(--frame)}
#app .ep-row:not(.sel) .recheck{display:none}
#app .ep-row .recheck .btn.ghost{background:transparent;border-color:var(--ep-muted);color:var(--ep-ink)}
#app .ep-row .recheck .btn.ghost:hover{background:rgba(255,255,255,.1)}
#app .ep-row.dimmed,#app.recomputing .ep-row{background:var(--ep-bg);opacity:.5;box-shadow:inset 0 0 0 1px var(--ep-line)}
#app .pages{--ink:var(--ep-ink);--muted:var(--ep-muted);--cite:var(--ep-muted);--line:var(--ep-line);--focus:#FFFFFF;background:var(--ep-bg);color:var(--ep-ink);box-shadow:inset 0 0 0 1px var(--ep-line)}
#app .pages li a{color:var(--ep-ink)}
#app .pages .reset button{color:var(--ep-ink)}
#app .legend.note{color:var(--on-field-muted)}

/* Answers: the state as a wash, the head rule in the state's ink */
#app .ans[data-badge="not_true"]{background:var(--wash-bad);box-shadow:0 0 0 2px var(--act)}
#app .ans[data-badge="not_true"] .body{border-top-color:var(--act)}
#app .ans[data-badge="stale"]{background:var(--wash-stale);box-shadow:0 0 0 1.5px var(--stamp-stale)}
#app .ans[data-badge="stale"] .body{border-top-color:var(--stamp-stale)}
#app .ans[data-badge="confirm"],#app .ans[data-badge="held_unspecified"]{--muted:#545B66;background:var(--wash-slate)}
#app .ans[data-badge="confirm"] .body,#app .ans[data-badge="held_unspecified"] .body{border-top-color:#AEB6C2}
#app .ans[data-badge="still_true"]{background:var(--wash-ok)}
#app .ans[data-badge="still_true"] .body{border-top-color:var(--rule-cyan)}
#app .ans.dimmed,#app.recomputing .ans{opacity:.62}
#app .ans .n{font:700 12px/1.3 var(--display);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
#app .confirm-box{background:rgba(255,255,255,.6)}
#app details.per-more,#app details.ev-more{margin-top:14px}
#app details.per-more > summary,#app details.ev-more > summary{cursor:pointer;width:fit-content;font:600 13px/1.4 var(--sans);color:var(--stamp-confirm);padding:4px 0}
#app details.per-more > summary:hover,#app details.ev-more > summary:hover{color:var(--ink)}
#app details.per-more .per{margin-top:8px}
@media (min-width:901px){
  #app .ans{grid-template-columns:minmax(0,1fr) auto;row-gap:4px}
  #app .ans .n{grid-column:1;grid-row:1}
  #app .ans h3{grid-column:1;grid-row:2}
  #app .ans .badge{grid-column:2;grid-row:1/3;align-self:center}
  #app .ans .body{grid-column:1/-1;margin:16px calc(var(--card-pad) * -1) 0;padding:14px var(--card-pad) 0}
}
@media (max-width:900px){
  #app .catch > h1{font-size:27px}
  #app .ans .n{align-self:center}
}
#app .summary > p{display:none}
#app .ep-row .chip{text-transform:none;letter-spacing:.01em;font-size:12px}
#app .ep-row .chip .mono{letter-spacing:.01em}
#app .legend.note{display:block;font-size:13px;line-height:1.5}
#app .legend.note .lh{display:none}

/* Fix round: a readable rail, an even phone hero, one caption less */
#app .ep-row .finding{font-size:14px}
#app .ep-row .via{font-size:14px}
#app .pages li{font-size:13.5px}
#app .pages li .note,#app .pages .reset{color:#DCE7F2}
#app .legend.note{font-size:14px;color:#DCE7F2;padding:2px 2px 0}
#app .ans[data-badge="still_true"] figure.ev figcaption{display:none}
@media (max-width:900px){
  #app .todo{flex-direction:column;gap:10px}
  #app .todo .btn,#app .todo .link{width:100%;justify-content:center}
  #app .stack .ph{display:none}
}
/* Start page: colour by role. Method on pale cyan, the paths each in their own stock, evidence on the deep field. */
:is(:root:not([data-theme]),:root[data-theme="c1"]){
  .judge-page .stat:nth-child(2){background:#0F6B7F}
  .judge-page .stat:nth-child(3){background:#A4C6DE;box-shadow:none}
  .judge-page .stat:nth-child(3) .c{color:#1E1A16}
  .judge-page .stat:nth-child(3) .v{box-shadow:0 0 0 4px #FCFBF7,inset 0 0 0 1px rgba(0,0,0,.08)}
  .judge-page .ev.method{background:#A4C6DE;--muted:#1B3A5E;--cite:#1E1A16;--line:rgba(27,58,94,.28);padding:6px var(--card-pad)}
  .judge-page .ev.method li{grid-template-columns:120px minmax(0,1fr)}
  .judge-page .ev.method li > b{color:#1B3A5E}
  .judge-page .ev.method .qual{font-size:16px;line-height:1.5;color:#1E1A16;max-width:70ch}
  .judge-page .ev.method .btn.ghost{background:#FCFBF7;box-shadow:inset 0 0 0 1.5px #1B3A5E;color:#1B3A5E}
  .judge-page .ev.method .raw{display:inline-flex;align-items:center;min-height:30px;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1.5px #1B3A5E;color:#1B3A5E;font:700 13px/1 var(--display);text-decoration:none}
  .judge-page .ev.method .raw:hover{background:#FCFBF7}
  .judge-page .ev.method code.cmd{background:#FCFBF7;border-color:rgba(27,58,94,.28);max-width:max-content}
  .judge-page .ev.method .recompute-out{color:#1E1A16}
  .judge-page .more summary{cursor:pointer;font:700 14px/1.4 var(--display);color:#1B3A5E;list-style-position:outside;margin-left:16px;width:max-content;max-width:100%}
  .judge-page .more summary:focus-visible{outline:2px solid #1B3A5E;outline-offset:3px;border-radius:4px}
  .judge-page .more[open] summary{margin-bottom:10px}
  .judge-page .more .sub,.judge-page .more .fn{display:block;font-size:14px;line-height:1.55;color:#1E1A16;max-width:76ch}
  .judge-page .more .fn{margin-top:8px}

  .judge-page .paths{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;background:none;padding:0;border-radius:0}
  .judge-page .paths li + li{border-top:0}
  .judge-page .paths li{border-radius:22px;padding:0 var(--card-pad);background:#FCFBF7;transition:background-color var(--dur-fast) var(--ease)}
  .judge-page .paths li.p2{background:#A4C6DE;--muted:#1B3A5E;--cite:#1E1A16}
  .judge-page .paths li.p3{background:#0F6B7F;--ink:#FFFFFF;--muted:#D7E8EF;--cite:#EEF4F6;--focus:#FFFFFF}
  .judge-page .paths li.p1:hover{background:#FFFFFF}
  .judge-page .paths li.p2:hover{background:#B5D2E6}
  .judge-page .paths li.p3:hover{background:#0C5E70}
  .judge-page .path-card{grid-template-columns:64px minmax(0,4fr) minmax(0,7fr) 210px;padding:26px 0;align-items:center;color:var(--ink)}
  .judge-page .badge.catch-mark .lbl{animation-name:judge-ink}
  .judge-page .path-card .step{color:var(--muted);align-self:center}
  .judge-page .path-card .t{align-self:end;color:var(--ink)}
  .judge-page .path-card .tag{align-self:start;margin-top:8px;text-transform:none;letter-spacing:0}
  .judge-page .path-card .tag .badge{background:#FCFBF7}
  .judge-page .path-card .tag .badge.bad{background:#B3202A}
  .judge-page .path-card .tag .badge.ok{padding-inline:8px;border-color:#1B3A5E;border-width:1.5px}
  .judge-page .path-card .tag .badge.held{border-color:#5E5A55;color:#5E5A55}
  .judge-page .path-card .d{color:var(--cite);font-size:16px;line-height:1.5}
  .judge-page .path-card .go{justify-self:end;display:inline-flex;align-items:center;gap:4px;padding:10px 16px 10px 18px;border-radius:999px;background:#1B3A5E;color:#FFFFFF;font-weight:700;font-size:14.5px}
  .judge-page .paths li.p3 .go{background:#FCFBF7;color:#0F6B7F}
  .judge-page .path-card .go svg{stroke:currentColor}
  .judge-page .jg .also{margin-top:18px;font-size:15px}

  .judge-page .ev.docs{background:#122A46;--ink:#FFFFFF;--muted:#C7D8EA;--cite:#C7D8EA;--line:rgba(164,198,222,.28);--focus:#FFFFFF;color:#FFFFFF;display:grid;grid-template-columns:1fr 1fr;column-gap:48px;padding:10px 32px 14px;box-shadow:inset 0 0 0 1.5px rgba(164,198,222,.35)}
  .judge-page .ev.docs li{grid-template-columns:minmax(0,1fr);padding:18px 0;border-top:1px solid var(--line);border-bottom:0}
  .judge-page .ev.docs li:nth-child(-n+2){border-top:0}
  .judge-page .ev.docs li#sponsor{grid-column:1/-1;border-top:1px solid var(--line)}
  .judge-page .ev.docs > li > a{display:inline-flex;align-items:center;gap:6px;width:max-content;color:#A4C6DE;text-decoration:none;font-size:18px}
  .judge-page .ev.docs > li > a:hover{color:#FFFFFF}
  .judge-page .ev.docs > li > a svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
  .judge-page .ev.docs li b{font-size:18px;color:#A4C6DE}
  .judge-page .ev.docs li span{font-size:15px;line-height:1.5;color:#C7D8EA}
  .judge-page .ev.docs li span.mono{color:#FFFFFF}
  .judge-page .foot{max-width:90ch;margin-top:36px}
  .judge-page .jg{padding-bottom:56px}
  .judge-page .catchline .catch-text{position:relative;display:block;margin:8px 6px 2px;padding:12px 16px;background:#EEF4F6;border-radius:10px}
  .judge-page .catchline .catch-text::before{content:"";position:absolute;inset:-7px;pointer-events:none;border:2px solid #1B3A5E;border-radius:14px;-webkit-mask:linear-gradient(#000,#000) left top/26px 26px no-repeat,linear-gradient(#000,#000) right bottom/26px 26px no-repeat;mask:linear-gradient(#000,#000) left top/26px 26px no-repeat,linear-gradient(#000,#000) right bottom/26px 26px no-repeat}

  @media (max-width: 760px){
    .judge-page .ev.method li{grid-template-columns:minmax(0,1fr)}
    .judge-page .ev.method{padding:4px 16px}
    .judge-page .paths li{padding:0 16px}
    .judge-page .path-card{grid-template-columns:40px minmax(0,1fr);row-gap:8px;padding:20px 0;align-items:start}
    .judge-page .path-card .step{grid-row:1/3;font-size:32px}
    .judge-page .path-card .t{grid-column:2;grid-row:1;align-self:start}
    .judge-page .path-card .tag{grid-column:2;grid-row:2;justify-self:start;margin-top:0}
    .judge-page .path-card .d{grid-column:1/-1;grid-row:3;margin-top:6px}
    .judge-page .path-card .go{grid-column:1/-1;grid-row:4;justify-self:start;margin-top:6px}
    .judge-page .ev.docs{grid-template-columns:minmax(0,1fr);padding:4px 18px 8px}
    .judge-page .ev.docs li:nth-child(2){border-top:1px solid var(--line)}
  }
}
@keyframes judge-ink{from{opacity:0}}

/* App page: the vendor's sentence sits inside two rounded corner marks, as on the other pages */
#app .ans blockquote{position:relative;margin:10px 6px;padding:12px 16px;border-radius:10px}
#app .ans blockquote::before{content:"";position:absolute;inset:-7px;pointer-events:none;border:2px solid #1B3A5E;border-radius:14px;-webkit-mask:linear-gradient(#000,#000) left top/26px 26px no-repeat,linear-gradient(#000,#000) right bottom/26px 26px no-repeat;mask:linear-gradient(#000,#000) left top/26px 26px no-repeat,linear-gradient(#000,#000) right bottom/26px 26px no-repeat}