:root{
    color-scheme: light;
    --plane:#faf9f7;
    --surface:#ffffff;
    --ink:#15140f;
    --ink-2:#4d4c47;
    --muted:#86847c;
    --rule:#e5e3dc;
    --rule-soft:#efede7;
    --accent:#2a78d6;
    --accent-soft:#eaf2fd;
    --critical:#d03b3b;
    --critical-soft:#fdeeee;
    --amber:#9a6b00;
    --amber-soft:#fdf4e3;
    --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --serif: Charter, "Iowan Old Style", Georgia, "Times New Roman", serif;
    --wrap: 44rem;
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0; background:var(--plane); color:var(--ink);
    font-family:var(--sans); font-size:17px; line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  .wrap{max-width:var(--wrap); margin:0 auto; padding:0 1.35rem}
  .wide{max-width:60rem; margin:0 auto; padding:0 1.35rem}

  /* masthead */
  .masthead{border-bottom:1px solid var(--rule); background:var(--surface)}
  .masthead .wide{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:.95rem; padding-bottom:.95rem; flex-wrap:wrap}
  .brand{font-size:.78rem; font-weight:650; letter-spacing:.1em; text-transform:uppercase; color:var(--ink)}
  .brand span{color:var(--muted); font-weight:500}
  .stamp{font-size:.75rem; color:var(--muted); letter-spacing:.02em}

  /* hero */
  .hero{background:var(--surface); border-bottom:1px solid var(--rule); padding:2.7rem 0 2.05rem}
  .kicker{font-size:.74rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--accent); margin:0 0 1rem}
  h1{
    font-family:var(--serif); font-weight:700; font-size:clamp(2.1rem,5.6vw,3.15rem);
    line-height:1.06; letter-spacing:-.02em; margin:0 0 .9rem;
  }
  .standfirst{font-family:var(--serif); font-size:clamp(1.12rem,2.4vw,1.32rem); line-height:1.55; color:var(--ink-2); margin:0 0 1.6rem}
  .byline{font-size:.82rem; color:var(--muted); border-top:1px solid var(--rule-soft); padding-top:1rem}

  /* stat strip */
  .stats{background:var(--plane); border-bottom:1px solid var(--rule); padding:1.7rem 0}
  .statgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr)); gap:1px; background:var(--rule); border:1px solid var(--rule); border-radius:10px; overflow:hidden}
  .stat{background:var(--surface); padding:.95rem 1rem}
  .stat .v{font-size:1.9rem; font-weight:700; line-height:1; letter-spacing:-.02em; margin-bottom:.4rem}
  .stat .l{font-size:.79rem; color:var(--ink-2); line-height:1.35}
  .stat .s{font-size:.72rem; color:var(--muted); margin-top:.3rem}

  /* sections */
  section{padding:2.25rem 0}
  section + section{border-top:1px solid var(--rule)}
  .sec-num{font-size:.72rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); margin:0 0 .6rem}
  h2{font-family:var(--serif); font-size:clamp(1.5rem,3.4vw,1.9rem); line-height:1.15; letter-spacing:-.015em; margin:0 0 .85rem; font-weight:700}
  h3{font-size:1.02rem; font-weight:680; letter-spacing:-.005em; margin:1.45rem 0 .45rem}
  p{margin:0 0 .88rem; font-family:var(--serif); font-size:1.035rem; line-height:1.58; color:var(--ink)}
  .lede{font-size:1.12rem}
  strong{font-weight:700}
  a{color:var(--accent); text-underline-offset:2px}
  a:hover{color:#1c5cab}

  /* callouts */
  .rulebox{
    background:var(--surface); border:1px solid var(--rule); border-left:3px solid var(--accent);
    border-radius:8px; padding:1.1rem 1.2rem; margin:1.25rem 0;
  }
  .rulebox .src{font-family:var(--sans); font-size:.76rem; font-weight:650; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); margin:0 0 .55rem}
  .rulebox q{font-family:var(--serif); font-size:1.18rem; line-height:1.5; display:block; quotes:none}
  .rulebox .note{font-family:var(--sans); font-size:.85rem; color:var(--ink-2); margin:.7rem 0 0; line-height:1.5}

  .flag{
    background:var(--amber-soft); border:1px solid #f0e2c0; border-radius:8px;
    padding:.9rem 1.05rem; margin:1.2rem 0;
    font-family:var(--sans); font-size:.87rem; line-height:1.5; color:#5c4300;
  }
  .flag b{color:#3d2c00}

  .fairbox{background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:1.25rem 1.3rem .35rem; margin:1.2rem 0}

  /* quote grid */
  .quotes{display:grid; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr)); gap:.6rem; margin:1.25rem 0}
  .q{background:var(--surface); border:1px solid var(--rule); border-radius:8px; padding:.95rem 1rem}
  .q .where{font-family:var(--sans); font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); margin:0 0 .45rem}
  .q .txt{font-family:var(--serif); font-size:.97rem; line-height:1.45; margin:0; color:var(--ink)}
  .q .txt em{font-style:normal; background:#fdeeee; color:#8f1f1f; padding:0 .15em; border-radius:2px; font-weight:600}

  /* timeline */
  .tl{margin:1.35rem 0 0; padding:0; list-style:none; position:relative}
  .tl::before{content:""; position:absolute; left:6.6rem; top:.4rem; bottom:.4rem; width:1px; background:var(--rule)}
  .tl li{position:relative; padding:0 0 1.05rem 8.3rem; min-height:1.4rem}
  .tl .date{position:absolute; left:0; top:0; width:5.9rem; text-align:right; font-family:var(--sans); font-size:.76rem; font-weight:650; color:var(--ink-2); line-height:1.45; letter-spacing:-.01em}
  .tl li::after{content:""; position:absolute; left:6.25rem; top:.38rem; width:9px; height:9px; border-radius:50%; background:var(--surface); border:2px solid var(--muted)}
  .tl li.key::after{background:var(--accent); border-color:var(--accent)}
  .tl .body{font-family:var(--serif); font-size:.97rem; line-height:1.5}
  .tl .body b{font-family:var(--sans); font-size:.93rem; font-weight:670}

  /* meters */
  .figure{background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:1.2rem 1.25rem 1rem; margin:1.35rem 0}
  .fig-title{font-family:var(--sans); font-size:.98rem; font-weight:680; margin:0 0 .25rem; letter-spacing:-.005em}
  .fig-sub{font-family:var(--sans); font-size:.82rem; color:var(--muted); margin:0 0 1.25rem; line-height:1.45}
  .meters{display:flex; flex-direction:column; gap:.62rem}
  .meters .m{display:grid; grid-template-columns:minmax(6.5rem,12rem) 1fr auto; gap:.75rem; align-items:center}
  .meters .m .name{font-family:var(--sans); font-size:.8rem; color:var(--ink-2); line-height:1.25}
  .meters .m .track{position:relative; height:15px; background:#f2f1ec; border-radius:4px; overflow:visible}
  .meters .m .fill{position:absolute; left:0; top:0; bottom:0; background:var(--accent); border-radius:4px; min-width:3px}
  .meters .m .zero{position:absolute; left:0; top:0; bottom:0; width:2px; background:#d5d3ca; border-radius:2px}
  .meters .m .val{font-family:var(--sans); font-size:.8rem; font-variant-numeric:tabular-nums; color:var(--ink-2); min-width:1.1rem; text-align:right; font-weight:600}
  .thresh{position:relative; height:1.9rem; margin-top:.5rem; grid-column:2}
  .fig-thresh{display:grid; grid-template-columns:minmax(6.5rem,12rem) 1fr auto; gap:.75rem; margin-top:.35rem}
  .thline{position:absolute; top:-.5rem; bottom:auto; height:.5rem; width:2px; background:var(--critical)}
  .thlabel{position:absolute; top:.15rem; transform:translateX(-50%); white-space:nowrap; font-family:var(--sans); font-size:.72rem; font-weight:650; color:var(--critical); text-align:center; line-height:1.25}
  .marker{position:absolute; top:-1px; bottom:-1px; width:2px; background:var(--critical); z-index:2}
  .fig-note{font-family:var(--sans); font-size:.78rem; color:var(--muted); line-height:1.5; margin:1.5rem 0 0; padding-top:.9rem; border-top:1px solid var(--rule-soft)}

  /* table */
  .tblwrap{overflow-x:auto; margin:1.5rem 0}
  table{width:100%; border-collapse:collapse; font-family:var(--sans); font-size:.86rem}
  th{text-align:left; font-weight:670; color:var(--ink-2); border-bottom:1.5px solid var(--rule); padding:.55rem .7rem .5rem; white-space:nowrap}
  td{border-bottom:1px solid var(--rule-soft); padding:.55rem .7rem; vertical-align:top}
  td.num{font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap}
  tr:last-child td{border-bottom:none}
  .tag{display:inline-block; font-size:.72rem; font-weight:650; padding:.13rem .45rem; border-radius:4px; letter-spacing:.01em}
  .tag.no{background:var(--critical-soft); color:#9a2020}
  .tag.yes{background:#e8f5e9; color:#1b5e20}

  /* swap diagram */
  .swap{background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:1.2rem; margin:1.35rem 0}
  .swaprow{display:grid; grid-template-columns:1fr; gap:.9rem}
  .swapcard{border:1px solid var(--rule); border-radius:8px; padding:.9rem 1rem; background:var(--plane)}
  .swapcard.was{border-left:3px solid var(--muted)}
  .swapcard.now{border-left:3px solid var(--critical)}
  .swapcard .h{font-family:var(--sans); font-size:.73rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:0 0 .35rem}
  .swapcard.now .h{color:var(--critical)}
  .swapcard .b{font-family:var(--sans); font-size:.92rem; line-height:1.5; color:var(--ink)}
  .swapcard .d{font-family:var(--sans); font-size:.78rem; color:var(--muted); margin-top:.4rem}

  /* docs */
  .docs{list-style:none; padding:0; margin:1.3rem 0 0}
  .docs li{border-bottom:1px solid var(--rule-soft); padding:.6rem 0; font-family:var(--sans); font-size:.85rem; line-height:1.45}
  .docs li:last-child{border-bottom:none}
  .docs .t{font-weight:640; color:var(--ink)}
  .docs .m{display:inline; color:var(--muted); font-size:.8rem}

  /* collapsible reference blocks */
  details.ref{border:1px solid var(--rule); border-radius:8px; background:var(--surface); margin:.65rem 0}
  details.ref > summary{
    list-style:none; cursor:pointer; padding:.75rem 1rem;
    font-family:var(--sans); font-size:.88rem; font-weight:650; color:var(--ink);
    display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  }
  details.ref > summary::-webkit-details-marker{display:none}
  details.ref > summary::after{content:"Show"; font-weight:550; font-size:.8rem; color:var(--accent); white-space:nowrap}
  details.ref[open] > summary::after{content:"Hide"}
  details.ref > summary:hover{background:var(--plane)}
  details.ref > summary .cnt{font-weight:500; color:var(--muted); font-size:.8rem}
  details.ref .inner{padding:0 1rem .5rem}
  details.ref .docs{margin:0}
  details.ref .docs li:first-child{border-top:1px solid var(--rule-soft); padding-top:.7rem}

  /* reply */
  .reply{background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:1.5rem; margin:1.6rem 0}
  .reply label{display:block; font-family:var(--sans); font-size:.8rem; font-weight:650; color:var(--ink-2); margin:0 0 .3rem}
  .reply input, .reply textarea{width:100%; font-family:var(--sans); font-size:.92rem; padding:.6rem .7rem; border:1px solid var(--rule); border-radius:6px; background:var(--plane); color:var(--ink); margin-bottom:.85rem}
  .reply textarea{min-height:7rem; resize:vertical}
  .reply input:focus, .reply textarea:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent)}
  .reply button{font-family:var(--sans); font-size:.88rem; font-weight:650; padding:.6rem 1.3rem; border:none; border-radius:6px; background:var(--accent); color:#fff; cursor:pointer}
  .reply button:hover{background:#1c5cab}

  footer{background:var(--surface); border-top:1px solid var(--rule); padding:2.4rem 0; margin-top:0}
  footer p{font-family:var(--sans); font-size:.82rem; color:var(--muted); line-height:1.6; margin:0 0 .8rem}
  footer p:last-child{margin-bottom:0}

  .tip{position:fixed; pointer-events:none; opacity:0; transform:translate(-50%,-125%); background:var(--ink); color:#fff; font-family:var(--sans); font-size:.78rem; padding:.4rem .6rem; border-radius:5px; white-space:nowrap; z-index:99; transition:opacity .1s}
  .tip.on{opacity:1}

  @media (max-width:640px){
    body{font-size:16px}
    .tl::before{left:0}
    .tl li{padding-left:1.5rem}
    .tl .date{position:static; width:auto; text-align:left; display:block; margin-bottom:.15rem}
    .tl li::after{left:-4px; top:.45rem}
    .meters .m{grid-template-columns:1fr; gap:.25rem}
    .meters .m .val{text-align:left}
    .fig-thresh{grid-template-columns:1fr; margin-top:.9rem}
    .thresh{grid-column:1; height:auto}
    .thline{display:none}
    .thlabel{position:static; transform:none; text-align:left; max-width:none; white-space:normal}
  }
  @media print{
    body{background:#fff}
    .reply, .masthead{display:none}
    section{page-break-inside:avoid}
  }

  /* township files additions */
  .dek{font-family:var(--serif); font-size:1.12rem; color:var(--ink-2); margin:-.35rem 0 1.2rem; line-height:1.5}
  section ul, section ol{margin:0 0 1rem; padding-left:1.25rem; font-family:var(--serif); font-size:1.035rem; line-height:1.55}
  section li{margin:0 0 .35rem}
  section li.sub{margin-left:1.2rem; list-style:circle}
  h3.fair{color:#1b5e20}
  .said{background:var(--accent-soft); border:1px solid #cfe1fa; border-radius:8px; padding:.9rem 1.05rem; margin:1.2rem 0}
  .said .lab{font-family:var(--sans); font-size:.74rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin:0 0 .35rem}
  .said p{margin:0}
  .shots{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; margin:1.4rem 0}
  .shots.one{grid-template-columns:minmax(0,26rem)}
  .shots .shot{display:block; border:1px solid var(--rule); border-radius:8px; overflow:hidden; background:var(--surface)}
  .shots img{display:block; width:100%; height:auto}
  .toc{list-style:none; padding:0; margin:0 0 1rem; columns:2; column-gap:1.5rem; font-family:var(--sans)}
  .toc li{break-inside:avoid; margin:0 0 .5rem; font-size:.95rem}
  .toc a{text-decoration:none; color:var(--ink)}
  .toc a:hover{color:var(--accent)}
  .toc .n{font-variant-numeric:tabular-nums; color:var(--muted); font-weight:700; font-size:.78rem; margin-right:.35rem}
  .totop{font-family:var(--sans); font-size:.8rem; margin-top:1rem}
  .docs li.sub{padding-left:1rem}
  @media (max-width:640px){ .toc{columns:1} .shots{grid-template-columns:1fr} }
  .watch{background:var(--surface); border:1px solid var(--rule); border-left:3px solid #c4302b; border-radius:8px; padding:.9rem 1.05rem .5rem; margin:1.3rem 0}
  .watch .lab{font-family:var(--sans); font-size:.74rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#c4302b; margin:0 0 .45rem}
  .watch ul{list-style:none; padding:0; margin:0 0 .5rem; font-family:var(--sans); font-size:.9rem}
  .watch li{margin:0 0 .4rem}
  .watch a{text-decoration:none}
  .watch a:hover{text-decoration:underline}
  .watch .ts{display:inline-block; min-width:7.2rem; font-variant-numeric:tabular-nums; font-weight:700; color:var(--ink-2); margin-right:.3rem}
  .watch .vnote{font-family:var(--sans); font-size:.76rem; color:var(--muted); margin:.3rem 0 .4rem}
  a.vq{color:inherit; text-decoration:underline; text-decoration-color:#c4302b; text-decoration-thickness:2px}
  a.vq::after{content:" \25B6"; font-size:.7em; color:#c4302b}
  figure.vid{margin:1.4rem 0}
  .vframe{position:relative; padding-top:56.25%; border-radius:8px; overflow:hidden; background:#000}
  .vframe iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
  figure.vid figcaption{font-family:var(--sans); font-size:.8rem; color:var(--muted); margin-top:.45rem}
  a.vcard{display:flex; gap:1rem; align-items:center; background:#15140f; color:#fff; text-decoration:none; border-radius:10px; padding:1.1rem 1.2rem; margin:1.4rem 0; font-family:var(--sans); font-size:.92rem; line-height:1.45}
  a.vcard:hover{background:#2a2924; color:#fff}
  a.vcard .play{flex:0 0 3rem; height:3rem; border-radius:50%; background:#c4302b; display:flex; align-items:center; justify-content:center; font-size:1.2rem; padding-left:.2rem}
  a.vcard b{font-size:1rem}
  /* alternating parts */
  section.part{padding:2.6rem 0 2.2rem; border-top:4px solid #15140f}
  section.part.base{background:#ffffff}
  section.part.alt{background:#f1efe8}
  section.part.alt .said, section.part.alt .watch, section.part.alt details.ref{background:#fff}
  .partband{display:flex; align-items:baseline; gap:.5rem; margin:0 0 .7rem; font-family:var(--sans)}
  .partband .pn{background:#15140f; color:#fff; font-weight:800; font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; padding:.3rem .65rem; border-radius:4px}
  section.part.alt .partband .pn{background:var(--accent)}
  .partband .of{font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
  section.part h2{font-size:clamp(1.8rem,4.2vw,2.35rem)}