/* Jarvis: the design language (D1). Every colour, type stack, size and duration lives here; app.css and
   presence.css use these tokens only, and presence.js reads the colours from them. Dark only: the room of the
   Stark hologram, amber and gold light on blue-black. System type stacks only (the CSP allows no font origin). */
:root {
  color-scheme: dark;

  /* The room. */
  --bg: #070A12;
  --bg-deep: #04060C;
  --bg-raise: #0C1221;
  --room: rgba(38, 58, 102, 0.34); /* cool light from above, behind everything */

  /* The light. */
  --gold: #F2B544;
  --gold-core: #FFE6B0; /* the lit centre of the sphere; never pure white */
  --gold-soft: rgba(242, 181, 68, 0.14);
  --gold-glow: rgba(242, 181, 68, 0.38);
  --amber: #E0862B;
  --amber-text: #F3A55B; /* amber for words: brighter, so it reads on glass */
  --amber-soft: rgba(224, 134, 43, 0.12);
  --amber-haze: rgba(224, 134, 43, 0.16);
  --on-gold: #1B1305;

  /* Glass: translucent blue-black with a thin gold rule. */
  --glass: rgba(15, 23, 41, 0.62);
  --glass-strong: rgba(11, 17, 31, 0.86);
  --rule: rgba(242, 181, 68, 0.22);
  --rule-strong: rgba(242, 181, 68, 0.55);
  --rule-faint: rgba(242, 181, 68, 0.1);
  --line-cool: rgba(140, 150, 168, 0.16);

  /* Words. */
  --text: #ECE3CF; /* warm off-white */
  --text-strong: #FAF1DD;
  --muted: #8D97AA; /* cool grey */
  --faint: #6A7487;
  --good: #A8D3A0;
  --warn: #F0A24E;
  --danger: #EE9783; /* a soft coral: legible on blue-black without vibrating */
  --danger-soft: rgba(238, 151, 131, 0.12);

  /* Type: a geometric sans for the HUD, a humanist sans for Jarvis's own words, tabular figures. */
  --font-hud: "Avenir Next", Avenir, "Century Gothic", "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif;
  --font-voice: Seravek, "Gill Sans Nova", "Gill Sans", Ubuntu, Calibri, "Segoe UI", "Trebuchet MS", sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --figures: tabular-nums;
  --root-size: 17px;
  --leading: 1.5;
  --leading-voice: 1.6;
  --step--2: 0.76rem;
  --step--1: 0.88rem;
  --step-0: 1rem;
  --step-1: 1.18rem;
  --step-2: 1.45rem;
  --step-3: 1.9rem;
  --track-hud: 0.04em;
  --track-tight: 0.02em;
  --track-brand: 0.14em;
  --input-size: 17px; /* 16px or more keeps iOS from zooming into a field */

  /* Space and shape. */
  --s1: 0.25rem;
  --s2: 0.5rem;
  --s3: 0.75rem;
  --s4: 1rem;
  --s5: 1.5rem;
  --s6: 2rem;
  --s7: 3rem;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-pill: 999px;
  --measure: 44rem;
  --tap: 44px;

  /* The presence. */
  --presence-hero: min(64vw, 36vh, 340px);
  --presence-compact: 34px;

  /* Motion: light changing, never boxes sliding. */
  --slow: 1200ms;
  --calm: 400ms;
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
}

@media (min-width: 48rem) {
  :root { --presence-hero: min(40vw, 38vh, 360px); }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --slow: 0ms;
    --calm: 0ms;
  }
}