/* ============================================================
   CDRS shared theme — design tokens (light + dark) and nav chrome
   Loaded by every page BEFORE the page's own <style>.
   Dark mode: html[data-theme="dark"], set by assets/theme.js
   (reads saved preference, falls back to prefers-color-scheme).
   ============================================================ */

:root{
  color-scheme: light;

  /* neutrals */
  --paper:#faf9f5;
  --paper-2:#f2f0e8;
  --card:#ffffff;
  --ink:#1c1b18;
  --ink-soft:#4c4a44;
  --ink-faint:#807c72;
  --rule:#ddd8cd;
  --hairline:#e8e4da;
  --rule-soft:#e8e4da;
  --edge:#b9b3a5;
  --shadow:rgba(26,28,34,.10);
  --paper-glass:rgba(250,249,245,.93);
  --badge-ink:#ffffff;            /* text on solid accent chips */

  /* nav band (identical in both themes) */
  --band:#14151a;
  --band-ink:#e8e6e0;

  /* accents */
  --cobalt:#1f3fb5;  --cobalt-deep:#16308f; --cobalt-soft:#e6eafb; --cobalt-line:#c2cbf0;
  --gold:#b07d2b;    --gold-deep:#8a6413;   --gold-mid:#cfa864;    --gold-soft:#f5ecd9;
  --gold-line:#dcc18f; --gold-line2:#e0d0a2; --gold-tan:#c9b48d;
  --green:#2e6e4e;   --green-mid:#6fa088;   --green-soft:#e7f0ec;  --green-line:#b3d1c0;
  --purple:#6b4a9e;  --purple-deep:#533a7a; --purple-mid:#a891c9;  --purple-soft:#f0eafa; --purple-line:#d8cdea;
  --madder:#a4442f;
  --prussian:#2e5c8a;
  --umber:#8a5a2b;
  --verdigris:#3d6b5c;
  --iris:#5a4a7d;
  --maroon:#6b2d3c;  --maroon-soft:#f7f0f1; --maroon-line:#d9bcc2;
}

html[data-theme="dark"]{
  color-scheme: dark;

  --paper:#171613;
  --paper-2:#201f1a;
  --card:#22211c;
  --ink:#e8e6e0;
  --ink-soft:#bdb9ae;
  --ink-faint:#8f8b80;
  --rule:#3a382f;
  --hairline:#2c2b25;
  --rule-soft:#2c2b25;
  --edge:#55524a;
  --shadow:rgba(0,0,0,.5);
  --paper-glass:rgba(23,22,19,.93);
  --badge-ink:#171613;

  --cobalt:#91a5ee;  --cobalt-deep:#aab8f2; --cobalt-soft:#232a4d; --cobalt-line:#39406b;
  --gold:#d3a45a;    --gold-deep:#e0bd7a;   --gold-mid:#a37f3f;    --gold-soft:#322818;
  --gold-line:#54431f; --gold-line2:#4a3d20; --gold-tan:#6b5a35;
  --green:#7dbc9a;   --green-mid:#55806c;   --green-soft:#1e2c25;  --green-line:#33473c;
  --purple:#ab93d8;  --purple-deep:#bfa9e6; --purple-mid:#7c649f;  --purple-soft:#2a2338; --purple-line:#3f3552;
  --madder:#d1846f;
  --prussian:#82abd2;
  --umber:#c08d51;
  --verdigris:#77a897;
  --iris:#a091c9;
  --maroon:#c17085;  --maroon-soft:#2d2225; --maroon-line:#4f3a41;
}

/* guard: full-bleed section rules are drawn at 100vw */
html{overflow-x:clip}

/* consistent glyph weight everywhere — without this, light-on-dark serif
   text renders with heavier strokes on macOS and reads as bold */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* ---- nav additions: theme toggle + hamburger ---- */
.cdrs-theme-btn{
  background:none;border:none;cursor:pointer;
  color:#c9c6bd;font-size:15px;line-height:1;
  padding:0 15px;align-self:stretch;
  border-right:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono,monospace);
}
.cdrs-theme-btn:hover{background:#22242c;color:#fff}
.cdrs-theme-btn:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.cdrs-nav .cdrs-tag{margin-left:auto}

.cdrs-burger{
  display:none;background:none;border:none;cursor:pointer;
  padding:0 15px;align-self:stretch;
  flex-direction:column;justify-content:center;gap:4px;
  border-right:1px solid rgba(255,255,255,.08);
}
.cdrs-burger span{
  display:block;width:17px;height:2px;background:#c9c6bd;
  transition:transform .18s ease, opacity .18s ease;
}
.cdrs-burger:hover span{background:#fff}
.cdrs-burger:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.cdrs-burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.cdrs-burger.open span:nth-child(2){opacity:0}
.cdrs-burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.cdrs-menu{
  display:none;flex-direction:column;
  background:#14151a;border-bottom:2px solid var(--gold);
  font-family:var(--font-mono,monospace);font-size:13px;
}
.cdrs-menu.open{display:flex}
/* must track the burger breakpoint below, or the button opens nothing */
@media(min-width:940px){.cdrs-menu{display:none!important}}
.cdrs-menu a{
  color:#c9c6bd;text-decoration:none;padding:13px 20px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.cdrs-menu a:hover{background:#22242c;color:#fff}
.cdrs-menu a.cdrs-current{background:#22242c;color:#fff;box-shadow:inset 3px 0 0 var(--gold)}

/* Below 880px the ten volume links cannot fit the bar even at 10px type
   (they need ~908px, plus the search button), so they are replaced by the burger menu rather than
   left to scroll. Raised from 720px on 27 Jul 2026 to match the measured
   ladder in each volume's own nav CSS; raised again to 940px when Search
   became a fixed-width button in the bar. */
@media(max-width:939px){
  .cdrs-nav a:not(.cdrs-brand){display:none}
  .cdrs-burger{display:flex}
}

/* ---- site-wide copyright strip (last element on every page) ---- */
.cdrs-copyright{
  font-family:var(--font-mono,monospace);
  font-size:11px;letter-spacing:.06em;
  color:var(--ink-faint);
  text-align:center;
  margin:0;padding:20px 20px 28px;
  border-top:1px solid var(--rule);
  background:var(--paper);
}

/* ---- site-wide search overlay (added 27 Jul 2026) ----
   Built by theme.js on first open, so every volume gets it from one file. */
.cdrs-sox{
  position:fixed;top:0;right:0;bottom:0;left:0;inset:0;z-index:10000;display:none;
  background:rgba(12,13,16,.55);
  padding:8vh 18px 18px;
}
.cdrs-sox.open{display:block}
html.cdrs-sox-lock{overflow:hidden}
.cdrs-sox-panel{
  max-width:720px;margin:0 auto;background:var(--card,#fff);
  border:1px solid var(--rule,#ddd8cd);border-radius:4px;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
  display:flex;flex-direction:column;max-height:82vh;overflow:hidden;
}
.cdrs-sox-bar{display:flex;align-items:stretch;border-bottom:1px solid var(--rule,#ddd8cd)}
.cdrs-sox-input{
  flex:1;min-width:0;border:none;background:transparent;color:var(--ink,#22201c);
  font-family:var(--font-sans,system-ui);font-size:17px;padding:15px 16px;
}
.cdrs-sox-input:focus{outline:none}
.cdrs-sox-close{
  border:none;background:none;cursor:pointer;font-size:22px;line-height:1;
  padding:0 16px;color:var(--ink-faint,#807c72);
}
.cdrs-sox-close:hover{color:var(--ink,#22201c)}
.cdrs-sox-status{
  font-family:var(--font-mono,monospace);font-size:10.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-faint,#807c72);
  padding:8px 16px;border-bottom:1px solid var(--hairline,#ece8dd);
}
.cdrs-sox-list{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.cdrs-sox-hit{
  display:flex;align-items:baseline;gap:10px;text-decoration:none;color:inherit;
  padding:10px 16px;border-bottom:1px solid var(--hairline,#ece8dd);
}
.cdrs-sox-hit:hover,.cdrs-sox-hit.on{background:var(--cobalt-soft,#e6eafb)}
.cdrs-sox-hit.on{box-shadow:inset 3px 0 0 var(--cobalt,#1f3fb5)}
.cdrs-sox-k{
  flex:0 0 auto;font-family:var(--font-mono,monospace);font-size:9px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft,#4c4a44);
  border:1px solid var(--hairline,#ece8dd);background:var(--paper-2,#f2f0e8);
  border-radius:2px;padding:2px 5px;
}
.cdrs-sox-t{flex:1;min-width:0;font-family:var(--font-serif,Georgia);font-size:15.5px;
  color:var(--cobalt,#1f3fb5);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdrs-sox-t mark{background:var(--gold-soft,#f6edcd);color:inherit}
.cdrs-sox-v{
  flex:0 0 auto;font-family:var(--font-mono,monospace);font-size:9.5px;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint,#807c72);
}
.cdrs-sox-all{
  display:block;padding:12px 16px;text-align:center;text-decoration:none;
  font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--cobalt,#1f3fb5);background:var(--paper-2,#f2f0e8);
}
.cdrs-sox-all:hover{background:var(--cobalt,#1f3fb5);color:#fff}
@media(max-width:600px){
  .cdrs-sox{padding:0}
  .cdrs-sox-panel{
    max-width:none;border:none;border-radius:0;
    height:100vh;max-height:100vh;          /* fallback */
    height:100dvh;max-height:100dvh;        /* iOS: excludes the keyboard and toolbars */
    padding-bottom:env(safe-area-inset-bottom,0);
  }
  .cdrs-sox-v{display:none}
}
@media (prefers-reduced-motion: reduce){.cdrs-sox *{transition:none!important}}

/* search button in the bar — same metrics as the theme toggle */
.cdrs-search-btn{
  display:flex;align-items:center;justify-content:center;
  background:none;border:none;cursor:pointer;
  color:#c9c6bd;font-size:17px;line-height:1;
  padding:0 14px;align-self:stretch;flex:0 0 auto;
  border-right:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono,monospace);
}
.cdrs-search-btn:hover{background:#22242c;color:#fff}
.cdrs-search-btn:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
/* the text link stays in the markup for the burger menu; hidden in the bar
   wherever the button is doing that job */
@media(min-width:940px){
  .cdrs-nav a[href^="search.html"]{display:none}
}
