/* Catalog Map design skin (claude.ai/design f69110b9 · Catalog Map.dc.html).
   Loaded by shell_map.html AFTER tex.css, on the map pages only; everything
   here overrides tex.css by order or specificity. Tokens are the design
   helmet's, verbatim; dark follows the OS (owner 2026-10-09), no toggle. */

:root{color-scheme:light;--c0:#0f1430;--c1:#6b7190;--c2:#e3e6ef;--c3:#8a90ab;--c4:#454c6b;--c5:#5b4cff;--c6:#ffffff;--c7:#d5d9e6;--c8:#f7f8fb;--c9:#f1f2f8;--c10:#e9ebf2;--c11:#c3c8d8;--c12:#0f1430;--c13:#ffffff;--c14:#c62a4f;--c15:#a85a00;--c16:#eef0f6;--c17:#5b4cff;--c18:#c62a4f;--c19:#ffffff;--c20:#1f8a5b;--c21:#f6c9d3;--c22:rgba(15,20,48,.12);--c23:#eef0f6;--c24:#b45f06;--c25:#4f6c9e;--c26:#3a5a92;--c27:#2c4a80;--c28:#c3c8d8;--c29:#e88aa0;--c30:rgba(15,20,48,.4);--c31:rgba(15,20,48,.18);--c32:#1f2540;--c33:#f3b5c3;--c34:#a8dcc2;--c35:#1f8a5b;--c36:#eef4ff;--c37:#7d97c9;--c38:#9db6e6;--c39:#c9dafc;--c40:#3a5a92;--c41:#e3edff;--c42:#1d2f55;--c43:#b9b0ff;--c44:#f0a5b6;--c45:#c62a4f;--c46:#c9dafc;--c47:#e6b061;--c48:#24406f;--c49:#4a6fb0;--c50:#5a6080;--c51:#3c4360;--c52:#4a5070;--c53:#7a809c;--c54:#f1f2f8;--c55:#8fd1b0;--c56:#a85a00;--c57:#fff1d6;--c58:#e6b061;--c59:#fff4f6;--c60:#fff7e8;--c61:#d0335e;--c62:rgba(255,255,255,.94);--c63:#fff8ec;--c64:#c9821f;--c65:#ffefd2;--c66:#fff1f3;--c67:#4a3bf0}
@media (prefers-color-scheme: dark){
:root{color-scheme:dark;--c0:#f1efe9;--c1:#8f8b80;--c2:#37362f;--c3:#76736a;--c4:#bdb9ae;--c5:oklch(0.68 0.16 40);--c6:#1f1f1c;--c7:#46443c;--c8:#181815;--c9:#22221e;--c10:#2c2b26;--c11:#5f5c53;--c12:#d9d5ca;--c13:#1b1b18;--c14:oklch(0.76 0.15 32);--c15:oklch(0.82 0.13 75);--c16:#2a2a25;--c17:oklch(0.75 0.15 40);--c18:oklch(0.78 0.14 32);--c19:#161613;--c20:oklch(0.74 0.13 150);--c21:oklch(0.42 0.09 30);--c22:rgba(0,0,0,.45);--c23:#2f2e29;--c24:oklch(0.78 0.13 55);--c25:#7a8c99;--c26:oklch(0.8 0.05 235);--c27:oklch(0.88 0.05 235);--c28:#56544b;--c29:oklch(0.55 0.14 30);--c30:rgba(10,10,8,.72);--c31:rgba(0,0,0,.55);--c32:#e6e2d8;--c33:oklch(0.45 0.12 30);--c34:oklch(0.45 0.08 150);--c35:oklch(0.78 0.12 150);--c36:#0f1e29;--c37:#4f6574;--c38:#425866;--c39:#26394a;--c40:oklch(0.8 0.04 235);--c41:#16303f;--c42:oklch(0.97 0.015 235);--c43:oklch(0.5 0.15 40);--c44:oklch(0.48 0.17 30);--c45:oklch(0.66 0.12 30);--c46:oklch(0.42 0.13 245);--c47:oklch(0.52 0.13 65);--c48:oklch(0.91 0.045 235);--c49:oklch(0.72 0.08 238);--c50:#a9a598;--c51:#c4c0b4;--c52:#b6b2a5;--c53:#7b776d;--c54:#26261f;--c55:oklch(0.55 0.13 150);--c56:oklch(0.86 0.12 75);--c57:oklch(0.3 0.06 75);--c58:oklch(0.6 0.12 75);--c59:#1f1a17;--c60:#2a2620;--c61:oklch(0.6 0.17 30);--c62:rgba(24,24,21,.94);--c63:oklch(0.23 0.02 60);--c64:oklch(0.6 0.12 55);--c65:oklch(0.27 0.04 60);--c66:#241c18;--c67:oklch(0.72 0.16 40)}
}

/* ------------------------------------------------------------------ base -- */
body { background: var(--c8); color: var(--c0);
  font-family: Geist, system-ui, sans-serif; font-size: 15px; }
a { color: var(--c0); }
a:hover { color: var(--c17); }
input::placeholder { color: var(--c3); }
select, input { font-family: inherit; }

/* ----------------------------------------------------------------- shell -- */
.nav { background: var(--c6); border-right-color: var(--c2); }
.brand-mark { background: var(--c12); color: var(--c13); border-radius: 4px; }
.brand-word { color: var(--c4); }
.nav a.item { color: var(--c4); border-radius: 4px; }
.nav a.item:hover { background: var(--c9); color: var(--c0); }
.nav a.item.on { background: var(--c12); color: var(--c13); }
.nav .sec { color: var(--c3); }
.nav .who { color: var(--c1); border-top-color: var(--c2); }
.nav .who strong { color: var(--c0); }
.main { max-width: 1280px; padding: 40px 32px 56px; }

/* ---------------------------------------------------------------- header -- */
.crumb { font-size: 13px; letter-spacing: 0; text-transform: none; color: var(--c1); }
.crumb a { color: var(--c1); text-decoration: none; }
.crumb a:hover { color: var(--c17); }
h1 { font-family: Geist, system-ui, sans-serif; font-size: 32px; font-weight: 500;
  letter-spacing: -0.02em; margin: 6px 0 0; }
.topbar { margin-bottom: 28px; }
.topbar .meta { font-size: 15px; color: var(--c1); margin-top: 6px; }
.topbar .meta .code { color: var(--c0); }
.topbar .line { font-size: 15px; color: var(--c1); margin-top: 8px; }
.asof { font-size: 13px; color: var(--c3); font-variant-numeric: tabular-nums; }
.topbar.stack { display: block; }
.topbar.stack .asof { margin-top: 6px; }

/* ------------------------------------------------- stat strip (map.html) -- */
.band { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0;
  border-top: 1px solid var(--c2); border-bottom: 1px solid var(--c2);
  margin-bottom: 28px; }
.band .card { display: flex; flex-direction: column; background: none; border: 0;
  border-left: 1px solid var(--c2); border-radius: 0; box-shadow: none;
  padding: 16px 18px 14px; }
.band .card:first-child { border-left: 0; }
.band .card .v { order: 1; font-family: Geist, system-ui, sans-serif; font-size: 24px;
  font-weight: 500; font-variant-numeric: tabular-nums; margin: 0; }
.band .card .k { order: 2; font-size: 13px; color: var(--c1); text-transform: none;
  letter-spacing: 0; margin-top: 6px;
  text-decoration: underline dotted var(--c7); text-underline-offset: 4px; }
.band .card .sub { order: 3; font-size: 12px; color: var(--c3); margin-top: 6px; line-height: 1.45; }
a.card { text-decoration: none; color: inherit; }
.band a.card:hover { background: var(--c9); border-color: var(--c2); }

/* maps.html keeps a card grid, in the design's card language */
.band.band-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px; border: 0; }
.band.band-cards .card { background: var(--c13); border: 1px solid var(--c7);
  border-radius: 8px; padding: 18px; }
.band.band-cards .card .k { order: 1; font-family: 'Geist Mono', ui-monospace, monospace;
  font-size: 12px; color: var(--c3); text-decoration: none; margin: 0; }
.band.band-cards .card .v { order: 2; font-size: 20px; margin-top: 6px; }
.band.band-cards .card .sub { order: 3; font-size: 13px; color: var(--c1); margin-top: 8px; }
.band.band-cards a.card:hover { background: var(--c9); border-color: var(--c11); }

/* --------------------------------------------------------------- filters -- */
.filterrow { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start;
  margin-bottom: 12px; }
.filterrow .searchbar { flex: 1 1 320px; margin: 0; }
.searchbar { gap: 8px; }
.searchbar input { flex: 1; max-width: none; height: 40px; padding: 0 14px;
  font-family: inherit; font-size: 15px; color: var(--c0);
  background: var(--c6); border: 1px solid var(--c2); border-radius: 4px; }
.searchbar input:focus { border-color: var(--c3); outline: none; }
.searchbar button { height: 40px; padding: 0 16px; font-size: 15px; color: var(--c0);
  background: var(--c6); border: 1px solid var(--c2); border-radius: 4px; }
.searchbar button:hover { border-color: var(--c3); }

.dd { position: relative; margin: 0; }
.dd > summary { height: 40px; display: inline-flex; align-items: center;
  padding: 0 14px; font-size: 15px; color: var(--c0);
  background: var(--c6); border: 1px solid var(--c2); border-radius: 4px; }
.dd > summary .n { color: var(--c1); }
.dd > summary::after { content: " ▾"; color: var(--c1); margin-left: 6px; }
.dd[open] > summary { background: var(--c6); color: var(--c0); border-color: var(--c3); }
.dd-list { background: var(--c13); border: 1px solid var(--c7); border-radius: 6px;
  box-shadow: 0 12px 28px var(--c22); }

.chips { gap: 8px; margin-bottom: 16px; }
.chip { padding: 6px 10px; font-size: 13px; color: var(--c0);
  background: var(--c6); border: 1px solid var(--c2); border-radius: 4px; }
.chip:hover { border-color: var(--c3); color: var(--c0); }
.chip .n { color: var(--c1); }
.chip.on { background: var(--c6); border-color: var(--c7); color: var(--c0); font-weight: 400; }
.chip.on .n { color: var(--c1); }
.dd-list .chip.on { border-color: var(--c0); }
/* "Clear filters" reads as a text link (the only non-.on chip in .chips) */
.chips .chip:not(.on) { background: none; border: 0; padding: 6px 2px; color: var(--c1);
  text-decoration: underline; text-underline-offset: 3px; }
.chips .chip:not(.on):hover { color: var(--c17); }

/* ---------------------------------------------------------------- tables -- */
.tablewrap { background: var(--c13); border: 1px solid var(--c2); border-radius: 6px;
  box-shadow: none; }
table.map thead th, table.sub thead th { font-size: 13px; letter-spacing: 0;
  text-transform: none; color: var(--c1); font-weight: 500;
  border-bottom-color: var(--c2); }
tbody td { border-bottom-color: var(--c10); }
tbody tr:hover { background: var(--c9); }
.song a { font-size: 15px; font-weight: 600; letter-spacing: 0.01em; color: var(--c0); }
.song .artist { color: var(--c1); font-size: 13px; }
.song .line { font-size: 13px; color: var(--c4); margin-top: 4px; }
.song .line .lab { color: var(--c1); }
.code { font-family: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px; color: var(--c4); }
a.code { color: var(--c4); }
a.code:hover { color: var(--c17); }
.num { font-size: 15px; font-variant-numeric: tabular-nums; }
.num.zero { color: var(--c3); }
.muted { color: var(--c1); }

/* publishers: a borderless inline run with " / " separators (design card rows) */
.pchip { background: none; border: 0; padding: 0; border-radius: 0;
  font-size: 13px; color: var(--c4); margin: 0; }
.pchip::after { content: " / "; color: var(--c3); }
.pchip:last-child::after { content: ""; }

/* status: colored dot + colored text, no box */
.pill { background: none; border: 0; padding: 0; border-radius: 0;
  font-size: 13px; font-weight: 400; letter-spacing: 0; color: var(--c1);
  white-space: nowrap; margin: 0 10px 2px 0; }
.pill::before { content: ""; display: inline-block; width: 7px; height: 7px;
  border-radius: 50%; background: currentColor; margin-right: 7px; vertical-align: 1px; }
.pill.good { background: none; border: 0; color: var(--c20); }
.pill.warn { background: none; border: 0; color: var(--c15); }
.pill.bad  { background: none; border: 0; color: var(--c14); }

/* ----------------------------------------------------------------- pager -- */
.pager { font-size: 13px; color: var(--c1); border-top: 1px solid var(--c2);
  padding: 14px 16px; font-variant-numeric: tabular-nums; }
.pager a { padding: 7px 12px; border: 1px solid var(--c2); border-radius: 4px;
  color: var(--c0); }
.pager a:hover { border-color: var(--c3); color: var(--c0); }
.pager .off { opacity: 1; color: var(--c11); border-color: var(--c10); pointer-events: none; }

/* -------------------------------------------------- detail pages' panels -- */
.panel { background: var(--c13); border: 1px solid var(--c2); border-radius: 6px;
  padding: 16px; box-shadow: none; }
.panel h2 { font-size: 13px; letter-spacing: 0; text-transform: none;
  color: var(--c1); font-weight: 500; }
.panel h2 .n { color: var(--c3); }
.panel.why p { font-size: 15px; line-height: 1.5; color: var(--c4); }
.panel.why .lab { font-size: 11px; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--c1); }
.panel .empty { font-size: 13px; color: var(--c1); }
table.sub { font-size: 13px; }
table.sub tbody td { border-bottom-color: var(--c10); }

.note { background: var(--c57); border-left-color: var(--c24); color: var(--c24); }

/* ------------------------------------------------------------ responsive -- */
@media (max-width: 1100px) {
  .band { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .band .card { border-top: 1px solid var(--c2); margin-top: -1px; }
  .band .card:nth-child(3n+1) { border-left: 0; }
}
@media (max-width: 640px) {
  .band { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .band .card:nth-child(3n+1) { border-left: 1px solid var(--c2); }
  .band .card:nth-child(2n+1) { border-left: 0; }
  .main { padding: 24px 16px 40px; }
}
