/* Valkyrie Fit Console v2 — the Observatory system.
   An observatory console behind dark glass: a near-black canvas, a stack of
   five grays one step apart, hairline borders, pill-shaped outlined buttons,
   Inter at half-step weights with negative tracking, a monospace accent used
   sparingly, and no chromatic colour anywhere. Depth is value contrast, never
   a drop shadow. One theme; this file is the only palette in the product. */

:root {
  color-scheme: dark;

  /* the fourteen colours — the whole palette */
  --onyx:     #050507;   /* page background, primary surface — the logo's black */
  --carbon:   #121216;   /* elevated card, input field */
  --graphite: #1a1a20;   /* mid-elevation panels, nested surfaces, icon tiles, code cards */
  --smoke:    #23232a;   /* hover state, deeper card, button surface, hairline (light) */
  --iron:     #2c2c34;   /* pressed / active surface, highest elevation */
  --ash:      #34343c;   /* primary hairline border: dividers, rows, separators */
  --ferrite:  #3e3e48;   /* inner-stroke, focus-adjacent 1px outlines */
  /* VALKYRIE FIT's one accent: the wings' electric violet. What you press and
     what marks the brand; never the ground, never a whole surface. */
  --violet:       #5b2be0;
  --violet-light: #8b6cf0;
  --violet-deep:  #3d1aa8;
  --violet-wash:  rgba(91, 43, 224, 0.14);
  --steel:    #62666d;   /* tertiary text, muted icons, bullets */
  --pewter:   #7f7f80;   /* disabled text, placeholders */
  --fog:      #8a8f98;   /* muted body, metadata, timestamps, nav items */
  --mist:     #d0d6e0;   /* secondary text, descriptions, body paragraphs */
  --chalk:    #e4e5e9;   /* light icon accent, rare light dividers, the date-marker dot */
  --snow:     #f7f8f8;   /* primary text, headings, pill-button border — the only near-white */
  --void:     #030404;   /* deepest recess, inset tint */

  /* the roles the faces read (every rule below maps to one of the fourteen) */
  --bg:         var(--onyx);
  --surface-1:  var(--carbon);
  --surface-2:  var(--graphite);
  --surface-3:  var(--smoke);
  --surface-4:  var(--iron);
  --border:     var(--smoke);
  --border-2:   var(--ash);
  --border-3:   var(--ferrite);
  --text:       var(--snow);
  --text-2:     var(--mist);
  --text-3:     var(--fog);
  --text-4:     var(--steel);
  --text-off:   var(--pewter);

  /* the first console's names, kept so app.css's vocabulary still resolves —
     every one of them lands on a gray. Nothing here is a colour. */
  --accent:      var(--violet-light);   /* the accent is the brand's violet now */
  --accent-dim:  var(--violet-deep);
  --accent-wash: var(--violet-wash);
  --on-accent:   var(--snow);
  --ok:          var(--chalk);
  --alert:       var(--snow);      /* urgency is weight and words, not red */
  --p-color:     var(--violet);    /* a program's stripe when no program set one */
  --r-btn:       4px;
  --r-panel:     8px;
  --marker:     var(--chalk);
  --inset:      rgba(255, 255, 255, 0.03);

  /* type — Inter at half-step weights; no webfont, no CDN */
  --sans:    "Inter Variable", Inter, "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --display: "Inter Variable", Inter, "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --mono:    "Berkeley Mono", "JetBrains Mono", "Cascadia Code", Consolas, ui-monospace, "SF Mono", Menlo, monospace;
  --w-body:  400;
  --w-mid:   500;
  --w-head:  510;   /* headings, buttons, nav — the signature half-step */
  --w-em:    590;   /* inline emphasis, counts a coach must not miss */

  /* the type scale: size / line-height / letter-spacing */
  --fs-caption: 12px; --lh-caption: 1.6;  --ls-caption: -0.12px;
  --fs-small:   13px; --lh-small:   1.5;  --ls-small:   -0.13px;
  --fs-ui:      14px; --lh-ui:      1.45; --ls-ui:      -0.14px;
  --fs-body:    15px; --lh-body:    1.5;  --ls-body:    -0.15px;
  --fs-lead:    17px; --lh-lead:    1.45; --ls-lead:    -0.187px;
  --fs-h3:      24px; --lh-h3:      1.33; --ls-h3:      -0.288px;
  --fs-h2:      32px; --lh-h2:      1.2;  --ls-h2:      -0.416px;
  --fs-h1:      48px; --lh-h1:      1.13; --ls-h1:      -1.056px;
  --fs-mono:    15px; --lh-mono:    1.3;  --ls-mono:    -0.014em;

  /* geometry — a 4px base, compact density */
  --u:        4px;
  --page:     1080px;
  --prose:    680px;
  --gap:      8px;
  --pad-card: 16px;
  --gap-sect: 48px;
  --r-pill:   9999px;   /* buttons, nav items, tag pills */
  --r-card:   8px;      /* cards, icon tiles, images */
  --r-input:  4px;      /* inputs, tags, code cards */
  --r-icon:   4.4625px;
  --bar-h:    56px;
}

* { box-sizing: border-box; }
html { font-feature-settings: "cv01", "ss03"; -webkit-font-smoothing: antialiased; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; }
}
