:root{
    --paper:#F4F6F8; --card:#FFFFFF; --ink:#12263C; --ink-2:#44586E; --ink-3:#6F8298;
    --rule:#D8E0E8; --rule-2:#E8EDF2; --accent:#1B49D3; --accent-soft:#E7EDFD;
    --mark:#FFF0B8; --mark-ink:#12263C; --flag:#A62A22; --flag-soft:#FBEDEC;
    --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
    --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
    --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --paper:#0D1826; --card:#132335; --ink:#E7EEF6; --ink-2:#AFC1D3; --ink-3:#8298AE;
      --rule:#25394F; --rule-2:#1C2E42; --accent:#7FA6FF; --accent-soft:#17294100;
      --mark:#4A3F12; --mark-ink:#FBF3D4; --flag:#F09B94; --flag-soft:#2A1A1A;
    }
  }
  :root[data-theme="dark"]{
    --paper:#0D1826; --card:#132335; --ink:#E7EEF6; --ink-2:#AFC1D3; --ink-3:#8298AE;
    --rule:#25394F; --rule-2:#1C2E42; --accent:#7FA6FF; --accent-soft:#17294100;
    --mark:#4A3F12; --mark-ink:#FBF3D4; --flag:#F09B94; --flag-soft:#2A1A1A;
  }
  *{box-sizing:border-box}
  body{background:var(--paper); color:var(--ink); font-family:var(--serif); margin:0;}
  .wrap{max-width:53rem; margin:0 auto; padding-inline:18px; padding-block:2.6rem 4rem;}
  .kicker{font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin:0 0 .5rem;}
  h1{font-family:var(--sans); font-weight:700; font-size:clamp(1.7rem,4.6vw,2.5rem); line-height:1.1; letter-spacing:-.02em; margin:0 0 .7rem; text-wrap:balance;}
  .standfirst{font-size:1.09rem; line-height:1.6; color:var(--ink-2); margin:0; max-width:40rem;}
  h2{font-family:var(--sans); font-weight:600; font-size:1.18rem; letter-spacing:-.01em; margin:0 0 .2rem; text-wrap:balance;}
  h3{font-family:var(--sans); font-weight:600; font-size:.95rem; margin:0 0 .35rem;}
  p{line-height:1.62; margin:0 0 .8rem;}
  a{color:var(--accent);}
  section{margin-top:2.6rem;}
  .lede{color:var(--ink-2); max-width:40rem;}

  /* chain of authority */
  .chain{display:flex; flex-direction:column; gap:0; margin-top:1.2rem; border-left:2px solid var(--rule);}
  .step{display:grid; grid-template-columns:2.4rem 1fr; gap:.9rem; padding:.85rem 0 .85rem 1rem;}
  .step + .step{border-top:1px solid var(--rule-2);}
  .step__n{font-family:var(--mono); font-size:.8rem; color:var(--ink-3); padding-top:.15rem;}
  .step__t{font-family:var(--sans); font-weight:600; font-size:.96rem; margin:0 0 .15rem;}
  .step__d{font-size:.95rem; color:var(--ink-2); margin:0; line-height:1.55;}

  /* the excerpt */
  .doc{background:var(--card); border:1px solid var(--rule); border-radius:3px; margin-top:1.1rem;}
  .doc__head{display:flex; flex-wrap:wrap; gap:.4rem .9rem; align-items:baseline; justify-content:space-between;
             padding:.7rem 1.15rem; border-bottom:1px solid var(--rule); font-family:var(--mono); font-size:.74rem;
             letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3);}
  .doc__body{padding:1.15rem 1.25rem 1.3rem;}
  .doc__body p{font-size:1.02rem;}
  .doc__body p:last-child{margin-bottom:0;}
  mark{background:var(--mark); color:var(--mark-ink); padding:.08em .18em; border-radius:2px;}
  .cite{font-family:var(--mono); font-size:.78rem; color:var(--ink-3); margin-top:.7rem;}

  /* gloss list */
  .gloss{display:grid; gap:0; margin-top:1.1rem; border-top:1px solid var(--rule-2);}
  .g{display:grid; grid-template-columns:minmax(9rem,15rem) 1fr; gap:.2rem 1.4rem; padding:.85rem 0; border-bottom:1px solid var(--rule-2); align-items:start;}
  .g__q{font-family:var(--serif); font-size:.97rem; color:var(--ink);}
  .g__a{font-family:var(--sans); font-size:.92rem; line-height:1.55; color:var(--ink-2);}
  @media (max-width:640px){ .g{grid-template-columns:1fr; gap:.3rem;} }

  .note{border-left:3px solid var(--accent); background:var(--accent-soft); padding:.85rem 1rem; margin-top:1.1rem; border-radius:0 3px 3px 0;}
  .note p{margin:0; font-family:var(--sans); font-size:.95rem; line-height:1.55;}
  .caution{border-left:3px solid var(--flag); background:var(--flag-soft);}
  .caution h3{color:var(--flag);}

  .src{font-family:var(--sans); font-size:.88rem; color:var(--ink-2); line-height:1.7; margin-top:1rem;}
  .src b{color:var(--ink); font-weight:600;}
.srcline{font-family:var(--sans); font-size:.82rem; color:var(--ink-3); margin:.55rem 0 0; line-height:1.6;}
  .srcline a{color:var(--accent); text-decoration:underline; text-underline-offset:.15em;}
  .doc__head a{color:var(--accent); text-decoration:none; border-bottom:1px solid currentColor;}
  hr{border:0; border-top:1px solid var(--rule); margin:2.6rem 0 0;}
  .foot{font-family:var(--sans); font-size:.82rem; color:var(--ink-3); margin-top:1.4rem;}