/* SemanticQuant shared tokens — reading-skin pages (hub, collection/).
   Explainers stay self-contained and do not load this file.
   Constitution: docs/DESIGN.md */
:root{
  --paper:#E9EDF1; --plate:#FBFCFD; --ink:#1B2430; --ink-soft:#586574;
  --rule:#CBD4DD; --accent:#0E7C86; --accent-soft:rgba(14,124,134,.1);
  --link:#0E7C86;

  /* site hues — muted, one per site, tint by destination */
  --hue-mm:#7A5C17; --hue-mm-soft:rgba(140,106,29,.12);
  --hue-cc:#2E7D57; --hue-cc-soft:rgba(46,125,87,.12);
  --hue-sr:#8A3D63; --hue-sr-soft:rgba(138,61,99,.12);
  --hue-ex:#37628F; --hue-ex-soft:rgba(55,98,143,.12);
  /* the ceremonial register: gold, no site hue */
  --hue-ce:#77653A; --hue-ce-soft:rgba(138,118,66,.12);

  --font-display:"Space Grotesk",system-ui,sans-serif;
  --font-body:"Newsreader",Georgia,serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;
}
@media (prefers-color-scheme: dark){
  :root[data-theme="auto"]{
    --paper:#10141A; --plate:#161C24; --ink:#E7ECF1; --ink-soft:#909DAB;
    --rule:#2B343F; --accent:#39C2CD; --accent-soft:rgba(57,194,205,.12);
    --link:#5BD2DB;
    --hue-mm:#C9A85C; --hue-mm-soft:rgba(201,168,92,.14);
    --hue-cc:#6FAE8F; --hue-cc-soft:rgba(111,174,143,.14);
    --hue-sr:#C07EA0; --hue-sr-soft:rgba(192,126,160,.14);
    --hue-ex:#7FA3C9; --hue-ex-soft:rgba(127,163,201,.14);
  }
}
:root[data-theme="dark"]{
  --paper:#10141A; --plate:#161C24; --ink:#E7ECF1; --ink-soft:#909DAB;
  --rule:#2B343F; --accent:#39C2CD; --accent-soft:rgba(57,194,205,.12);
  --link:#5BD2DB;
  --hue-mm:#C9A85C; --hue-mm-soft:rgba(201,168,92,.14);
  --hue-cc:#6FAE8F; --hue-cc-soft:rgba(111,174,143,.14);
  --hue-sr:#C07EA0; --hue-sr-soft:rgba(192,126,160,.14);
  --hue-ex:#7FA3C9; --hue-ex-soft:rgba(127,163,201,.14);
}

/* cross-site links: destination hue + the sideways glyph, nowhere else */
.xlink{text-decoration:none; border-bottom:1px solid currentColor; font-weight:500}
.xlink::before{content:"⤳ "; font-family:var(--font-mono)}
.xlink.mm{color:var(--hue-mm)} .xlink.cc{color:var(--hue-cc)}
.xlink.sr{color:var(--hue-sr)} .xlink.ex{color:var(--hue-ex)}
.xlink.wx, .xlink.md{color:var(--hue-ce)}

/* site chips: small mono badges naming a site in its own hue */
.schip{display:inline-block; font-family:var(--font-mono); font-size:10px;
  letter-spacing:.14em; text-transform:uppercase; padding:2px 8px;
  border-radius:999px; border:1px solid currentColor}
.schip.mm{color:var(--hue-mm); background:var(--hue-mm-soft)}
.schip.cc{color:var(--hue-cc); background:var(--hue-cc-soft)}
.schip.sr{color:var(--hue-sr); background:var(--hue-sr-soft)}
.schip.ex{color:var(--hue-ex); background:var(--hue-ex-soft)}
.schip.wx, .schip.md{color:var(--hue-ce); background:var(--hue-ce-soft)}