/* ============================================================
   Box of Pizza · brand.css
   THE single source of truth for brand color + type.
   Every page links this file; no page redefines these values.
   Change a color here and it changes everywhere.
   Spec & reasoning: _design/brand/BRAND.md (not deployed).
   ============================================================ */

/* ---------- Type: self-hosted, zero third-party requests ---------- */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/instrument-serif.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/instrument-serif-italic.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 500;font-display:swap;src:url("fonts/inter.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/ibm-plex-mono-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/ibm-plex-mono-500.woff2") format("woff2")}

:root{
  /* Neutrals: warm paper + warm ink */
  --paper:#FBFAF6; --paper-2:#F2F0E7; --paper-3:#E8E5D8;
  --ink:#26221C;
  --ink-70:rgba(38,34,28,.7); --ink-45:rgba(38,34,28,.46);
  --ink-20:rgba(38,34,28,.2); --ink-10:rgba(38,34,28,.1);

  /* Brand color: ONE warm accent family, matched to the logo.
     ember      — the identity color: the slice mark, the oven, display-size
                  accents, signature moments. Graphics/large type only
                  (4.4:1 on paper — below AA for body text).
     ember-deep — ember at text size: links, mono labels, small accents
                  (5.8:1 on paper, AA).
     ember-soft — soft fill for subtle highlights. */
  --ember:#C7521E;
  --ember-deep:#A84517;
  --ember-soft:rgba(199,82,30,.10);

  /* The oven: the always-dark zone at the foot of the page.
     oven-ink is the light ink used on top of it (constant across themes). */
  --oven:#140F0A;
  --oven-ink:#ECE6D8;

  /* Imagery: one exhibition grade for every plate */
  --grade:saturate(.85) contrast(1.03) brightness(1.02);

  /* Type stacks */
  --serif:"Instrument Serif",Georgia,serif;
  --sans:"Inter",-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}

/* Night theme (lab site uses html[data-theme], the shelf uses body.dark) */
html[data-theme="night"],body.dark{
  --paper:#14110C; --paper-2:#1C1812; --paper-3:#241F17;
  --ink:#ECE6D8;
  --ink-70:rgba(236,230,216,.7); --ink-45:rgba(236,230,216,.45);
  --ink-20:rgba(236,230,216,.22); --ink-10:rgba(236,230,216,.1);
  --ember:#E0682F;
  --ember-deep:#E0682F; /* 5.6:1 on night paper — AA at text size as-is */
  --ember-soft:rgba(224,104,47,.12);
  --oven:#0A0703;
  --grade:saturate(.8) contrast(1.05) brightness(.84);
}