/* SeriesFusion brand tokens. Palette B, decided 2026-10-18.
   One file, read by every page. Dark is the default; light is a full version, not an afterthought.
   Change a color here and the whole site follows. */

/* Fonts. SF Calm (the brand face) for the name, titles and pulls. Inter for everything that should disappear. */
@font-face{font-family:"SF Calm";src:url("/fonts/SFCalm-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"SF Calm";src:url("/fonts/SFCalm-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"SF Calm";src:url("/fonts/SFCalm-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"SF Calm";src:url("/fonts/SFCalm-BoldItalic.woff2") format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/inter-latin-variable.woff2") format("woff2");font-weight:100 900;font-display:swap}

:root{
  color-scheme:dark light;

  /* The four brand colors, by name. These never change between themes. */
  --sf-black:#000000;
  --sf-white:#f2efe8;      /* warm white, the ink on black and the paper on light */
  --sf-blue:#8fb8da;       /* steel blue, the one accent */
  --sf-amber:#d9b36a;      /* the second color, rare: emphasis, a number that matters, a competing claim */
  --sf-blue-deep:#5e88a8;  /* steel blue for light grounds, so it still reads */
  --sf-amber-deep:#9a6b22; /* amber for light grounds */
  --sf-stream-blue:#4a84ff;   /* the streams only */
  --sf-stream-green:#2ee6a6;  /* the streams only */
  --sf-stream-a:#4a84ff; --sf-stream-b:#2ee6a6;   /* what plates.js reads; deeper on light */

  /* Roles, dark theme (default). Pages use these, never the names above. */
  --sf-paper:#000000;        /* the ground */
  --sf-surface:#111214;      /* cards, inputs, panels: one step up from the ground */
  --sf-ink:#f2efe8;          /* text */
  --sf-graphite:#a5a49c;     /* secondary text, labels */
  --sf-rule:#2a2c30;         /* hairlines */
  --sf-accent:#8fb8da;       /* links, current nav, the live mark, labels that point */
  --sf-warn:#d9b36a;         /* amber in use */
  --sf-focus:#8fb8da;        /* keyboard focus ring */

  /* Type */
  --sf-calm:"SF Calm",Georgia,serif;
  --sf-sans:"Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --sf-mono:ui-monospace,"SF Mono",Menlo,monospace;

  /* Shape */
  --sf-radius:8px;           /* cards, inputs, buttons */
  --sf-radius-mark:14%;      /* the square mark's corners, as a share of its width */
  --sf-measure:66ch;         /* reading width */
}

/* Light theme: warm white paper, black ink, the deep versions of the two colors. */
:root[data-theme="light"]{
  --sf-paper:#f2efe8; --sf-surface:#e9e4d9; --sf-ink:#000000; --sf-graphite:#5b5a55; --sf-rule:#d4cdbf;
  --sf-accent:#5e88a8; --sf-warn:#9a6b22; --sf-focus:#5e88a8; --sf-stream-a:#2459e0; --sf-stream-b:#0c9a6f;
}
/* Dark is the default on every device. Light is an explicit choice (data-theme="light", set by the page switch). */


html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--sf-paper);color:var(--sf-ink);font-family:var(--sf-sans);line-height:1.5}
a{color:var(--sf-accent)}
:focus-visible{outline:2px solid var(--sf-focus);outline-offset:3px}
