/* ==========================================================================
   tokens — plaster, graphite, patina, and one dark rectangle
   ==========================================================================

   THE DECISION THIS PAGE IS BUILT ON. Every foundry website in existence is
   near-black with ember orange, because that is what a pour looks like
   photographed at night, and because it is easy. It is also the single most
   generic dark-page look on the web right now.

   A foundry at ten in the morning does not look like that. It looks like
   plaster dust: investment shell is chalk, the moulds are pale, the light is
   flat and everywhere. So the page is that — and the darkness is confined to
   exactly one rectangle, the inside of the flask, on the grounds that YOU
   CANNOT SEE INCANDESCENCE IN DAYLIGHT. The only dark region on this page is
   the only place where looking into the dark is how you see anything.

   THE TWO ACCENTS ARE TWO KINDS OF KNOWLEDGE, and nothing may cross over.

     PATINA   everything the model asserts — the solidification front, the
              condemned pocket, the void, the verdicts, the fitted exponent.
              Also the links, because a link is a claim about where something
              is. If it is green, something worked it out.

     GLOW     never a token, never in the stylesheet, never available to a
              designer. Incandescent colour exists only inside the canvases and
              only as the output of Planck's law at a temperature the solver
              computed. There is no hex value for it anywhere in this file, and
              that is deliberate: it cannot be used decoratively if it does not
              exist as a decoration.
   ========================================================================== */

:root {
  /* investment plaster — the ground */
  --shell: #eceae4;
  --shell-2: #e3e0d8;
  --shell-3: #d8d4c9;

  /* graphite — the type */
  --ink: #23211c;
  --ink-2: rgba(35, 33, 28, 0.72);
  --ink-3: rgba(35, 33, 28, 0.46);
  --ink-4: rgba(35, 33, 28, 0.26);

  /* green sand — captions, rules, the quiet register */
  --sand: #6c6f5f;
  --line: rgba(35, 33, 28, 0.14);
  --line-2: rgba(35, 33, 28, 0.3);

  /* patina — measured, never chosen */
  --patina: #3f7a66;
  --patina-hi: #68b79b;
  --patina-dim: rgba(63, 122, 102, 0.5);
  --patina-wash: rgba(63, 122, 102, 0.09);

  /* the flask — the one dark region, and the mould inside it */
  --flask: #191a16;
  --flask-2: #22241f;
  --flask-line: rgba(236, 234, 228, 0.14);
  --flask-ink: rgba(236, 234, 228, 0.86);
  --flask-ink-2: rgba(236, 234, 228, 0.5);

  /* type ------------------------------------------------------------------
     Rozha One is an Indian Type Foundry face with a very high stroke contrast
     and real weight in the thicks — it reads as cast rather than drawn, which
     is the entire subject. It is used ONLY at display sizes; at body size the
     hairlines disappear and it becomes a liability.
     Karla carries every word of prose. Fragment Mono is the instrument voice:
     readouts, units, equations, labels. */
  --f-display: 'Rozha One', 'Georgia', serif;
  --f-body: 'Karla', system-ui, -apple-system, sans-serif;
  --f-mono: 'Fragment Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Rozha One is a wide, high-contrast face and it sets far larger than its
     point size suggests — at 8.4vw the opening line alone was taller than the
     viewport and pushed the flask, which is the actual argument, below the
     fold. A hero that has to be scrolled past to reach the thing it promises
     is a hero that is working against the page. */
  --t-hero: clamp(2.3rem, 5.3vw, 5.4rem);
  --t-h2: clamp(2rem, 5vw, 4.4rem);
  --t-h3: clamp(1.35rem, 2.6vw, 2.1rem);
  --t-lead: clamp(1.08rem, 1.55vw, 1.44rem);
  --t-body: clamp(1rem, 1.05vw, 1.09rem);
  --t-small: 0.875rem;
  --t-meta: clamp(0.62rem, 0.71vw, 0.72rem);

  --gut: clamp(1.15rem, 3.6vw, 3.4rem);
  --sec: clamp(4.5rem, 13vh, 10rem);
  --maxw: 82rem;

  /* Two curves, named for two motions in a foundry.
     --settle is metal finding the bottom of a mould: quick, then a long
     approach that never overshoots. --strike is the hammer coming off a
     chisel: decisive at both ends. */
  --settle: cubic-bezier(0.16, 1, 0.3, 1);
  --strike: cubic-bezier(0.65, 0, 0.35, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --settle: linear;
    --strike: linear;
  }
}
