/* Boiler House design tokens: shared by the dashboard and the simulator shell. */
@font-face{font-family:"Fraunces";src:url(../../../simulator/fonts/fraunces-latin-opsz-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url(../../../simulator/fonts/fraunces-latin-opsz-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"Geist";src:url(../../../simulator/fonts/geist-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../../../simulator/fonts/geist-mono-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  color-scheme:dark;

  /* Type */
  --font-display:"Fraunces","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-ui:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --text-xs:.75rem;      /* 12  labels, tags: the floor */
  --text-sm:.8125rem;    /* 13  meta */
  --text-base:.9375rem;  /* 15  UI and body */
  --text-md:1rem;        /* 16  reading text */
  --text-lg:1.125rem;    /* 18  lead, question stems */
  --text-xl:1.375rem;    /* 22  card titles */
  --text-2xl:1.75rem;    /* 28  feature titles */
  --text-3xl:clamp(2.125rem,1.45rem + 2.5vw,3.25rem); /* page titles */

  /* Soot: warm near-black surfaces, darkest at the back */
  --bg-0:#12100e;        /* page canvas */
  --bg-1:#181513;        /* rail, top bar, wells */
  --surface-1:#1f1b18;   /* cards */
  --surface-2:#27221e;   /* raised, hover */
  --surface-3:#322b26;   /* controls, chips */
  --surface-4:#40372f;   /* pressed, strong control */
  --line:rgba(255,226,194,.09);
  --line-2:rgba(255,226,194,.15);
  --line-3:rgba(255,226,194,.26);

  /* Ink: cream on soot */
  --ink-0:#fff8ee;       /* display */
  --ink-1:#f0e7da;       /* body */
  --ink-2:#cfc2b1;       /* secondary */
  --ink-3:#a59786;       /* meta: the lowest contrast allowed for text */
  --ink-4:#7a6e61;       /* decoration and disabled only */

  /* Plant colours */
  --ember:#ff8a4c;     --ember-ink:#2b1205;
  --brass:#f3c24f;     --brass-ink:#2a1e04;
  --copper:#e9a877;    --copper-ink:#2a1608;
  --verdigris:#6fcdb4; --verdigris-ink:#06231d;
  --plum:#dfa3cf;      --plum-ink:#2a0f24;
  --steam:#a9cde8;     --steam-ink:#0b1c29;
  --moss:#b3db7c;      --moss-ink:#16230a;  /* right, passed */
  --fire:#ff7a6b;      --fire-ink:#2d0c08;  /* wrong, failed, destructive */

  /* The tone in force. Set data-tone on any element to re-tone it and its children. */
  --tone:var(--ember);--tone-ink:var(--ember-ink);

  /* The ember-filled primary action: its fill, resting shadow and hover shadow */
  --ember-fill:linear-gradient(180deg,color-mix(in srgb,var(--ember) 83%,var(--ink-0)),color-mix(in srgb,var(--ember) 94%,var(--ember-ink)));
  --ember-lift:inset 0 1px 0 color-mix(in srgb,var(--ink-0) 38%,transparent),inset 0 -1px 0 color-mix(in srgb,var(--ember-ink) 30%,transparent),0 10px 24px -10px color-mix(in srgb,var(--ember) 60%,transparent);
  --ember-glow:inset 0 1px 0 color-mix(in srgb,var(--ink-0) 42%,transparent),inset 0 -1px 0 color-mix(in srgb,var(--ember-ink) 30%,transparent),0 14px 30px -10px color-mix(in srgb,var(--ember) 80%,transparent);

  --focus:#ffc59a;

  /* Shape */
  --r-xs:6px;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-pill:999px;
  --gutter:clamp(16px,4vw,44px);

  /* Depth: light falls from above; shadows are warm black */
  --top-light:inset 0 1px 0 rgba(255,238,214,.06);
  --shadow-1:var(--top-light),0 1px 2px rgba(0,0,0,.35);
  --shadow-2:var(--top-light),0 14px 34px -14px rgba(0,0,0,.7);
  --shadow-3:var(--top-light),0 30px 70px -22px rgba(0,0,0,.85),0 0 0 1px var(--line);

  /* Motion */
  --ease:cubic-bezier(.22,1,.36,1);
  --t-fast:140ms;--t:220ms;--t-slow:420ms;

  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 .93  0 0 0 0 .84  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

[data-tone=ember]{--tone:var(--ember);--tone-ink:var(--ember-ink)}
[data-tone=brass]{--tone:var(--brass);--tone-ink:var(--brass-ink)}
[data-tone=copper]{--tone:var(--copper);--tone-ink:var(--copper-ink)}
[data-tone=verdigris]{--tone:var(--verdigris);--tone-ink:var(--verdigris-ink)}
[data-tone=plum]{--tone:var(--plum);--tone-ink:var(--plum-ink)}
[data-tone=steam]{--tone:var(--steam);--tone-ink:var(--steam-ink)}
[data-tone=moss]{--tone:var(--moss);--tone-ink:var(--moss-ink)}
[data-tone=fire]{--tone:var(--fire);--tone-ink:var(--fire-ink)}
:root,[data-tone]{
  --tone-bg:color-mix(in srgb,var(--tone) 12%,transparent);
  --tone-bg-2:color-mix(in srgb,var(--tone) 20%,transparent);
  --tone-line:color-mix(in srgb,var(--tone) 38%,transparent);
}
