/* ============================================================
   //cmrabdu suite — INSTRUMENTS · design tokens v6 (rev 01)
   Vanilla CSS custom properties. No framework, no build step.
   Light mode is the source of truth. Dark is a single [data-theme] override.
   ============================================================ */

:root {
  /* ---- surfaces (châssis blanc moulé) ---- */
  --chassis:   #f4f4f2;  /* app background — the moulded plastic */
  --panel:     #ffffff;  /* raised surface: cards, sheets, controls */
  --recess:    #e9e9e5;  /* sunken well: key wells, tracks, inputs */
  --recess-2:  #e2e2dd;  /* shimmer highlight for recess */

  /* ---- ink ---- */
  --ink:       #131316;  /* primary text, display screens */
  --ink-2:     #5c5c60;  /* secondary text */
  --ink-3:     #9c9c9e;  /* silkscreen marking, tertiary */
  --ink-inv:   #ffffff;  /* text on ink surfaces */

  /* ---- lines ---- */
  --hairline:  #dcdcd7;  /* dividers, card borders */
  --hairline-2:#c8c8c2;  /* stronger edges, key borders */

  /* ---- LIVE / the one blue — only what acts or lives ---- */
  --live:      #1e48ff;  /* primary action, active element, changing value, focus */
  --live-press:#1330c4;  /* pressed depth face */
  --live-wash: #e9ecff;  /* active halo / focus ring / soft fill */
  --live-line: #b9c3ff;  /* live on dark, thin marks */

  /* ---- signals — desaturated instrument markings (never the action) ---- */
  --sig-red:    #c6483a;  --sig-red-wash:   #f7e6e3;  /* REC (recording) + error/destructive ONLY */
  --sig-green:  #4f8a63;  --sig-green-wash: #e6efe8;  /* confirmation / positive delta */
  --sig-amber:  #b4832f;  --sig-amber-wash: #f3ebda;  /* attention + nutri "calories" channel */
  --sig-violet: #6e5aa6;  --sig-violet-wash:#ece8f3;  /* marking / concept: gym Pull, books graph, tags */

  /* ---- nutri macro channels ---- */
  --cal:     #b4832f;   /* calories  (= sig-amber) */
  --protein: #1e48ff;   /* protéines (= live) */
  --carb:    #4f8a63;   /* glucides  (= sig-green) */
  --fat:     #6e5aa6;   /* lipides   (= sig-violet) */

  /* ---- habits/gym heat scale (blue ramp) ---- */
  --heat-0:#e9e9e5; --heat-1:#b9c3ff; --heat-2:#7f92ff; --heat-3:#4d67ff; --heat-4:#1e48ff;

  /* ---- spacing · step of 4 ---- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;

  /* ---- radii ---- */
  --r-1:4px; --r-2:8px; --r-3:12px; --r-4:18px; --r-pill:999px;

  /* ---- type ---- */
  --font-ui:   'Hanken Grotesk', system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, monospace;
  /* scale (size / line-height / usage)
     display  52-72 / .9   — hero numeric readouts (mono)
     h1       32   / 1.05  — screen titles
     h2       24   / 1.1   — section titles
     lg       20   / 1.25  — strong list item
     body     16   / 1.5   — base reading
     sm       14   / 1.45  — secondary meta
     silk     10-11/ 1     — technical markings (mono, letter-spacing 2px, uppercase) */

  /* ---- elevation (physical, warm — never pure black) ---- */
  --e-1: 0 1px 2px rgba(19,19,22,.05);
  --e-2: 0 4px 14px rgba(19,19,22,.08), 0 1px 3px rgba(19,19,22,.06);
  --e-3: 0 18px 48px rgba(19,19,22,.16), 0 4px 12px rgba(19,19,22,.08);
  --key-raise: 0 2px 0 var(--hairline-2), 0 5px 10px rgba(19,19,22,.07); /* control at rest */
  --key-press: inset 0 2px 5px rgba(19,19,22,.16);                       /* control pressed */
  --cover-e:   0 6px 16px rgba(19,19,22,.18);                            /* book cover */

  /* ---- motion ---- */
  --ease-spring: cubic-bezier(.34,1.42,.5,1);  /* touch response, mechanical mass */
  --ease-out:    cubic-bezier(.22,1,.36,1);    /* entrances, page transitions */
  --ease-inout:  cubic-bezier(.6,0,.35,1);
  --d-1:90ms;  /* press   */
  --d-2:160ms; /* control */
  --d-3:260ms; /* surface */
  --d-4:360ms; /* odometer / ring */

  /* ---- PWA safe areas (iPhone) ---- */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

/* ---- DARK (secondary — prepared, not tuned; light mode is primary) ---- */
:root[data-theme="dark"] {
  --chassis:#121211; --panel:#1b1b19; --recess:#232320; --recess-2:#2c2c28;
  --ink:#f2f1ea; --ink-2:#a4a39a; --ink-3:#75746c; --ink-inv:#121211;
  --hairline:#2c2c28; --hairline-2:#3a3a34;
  --live:#5b6cff; --live-press:#7f8cff; --live-wash:#1b2145; --live-line:#3a4488;
  --sig-red:#e0655a; --sig-red-wash:#31191700;
  --sig-green:#5aa87b; --sig-amber:#d09a3f; --sig-violet:#9a83cf;
  --cal:#d09a3f; --protein:#5b6cff; --carb:#5aa87b; --fat:#9a83cf;
  --heat-0:#232320; --heat-1:#293463; --heat-2:#39489f; --heat-3:#4658c9; --heat-4:#5b6cff;
  --e-1:0 1px 2px rgba(0,0,0,.4); --e-2:0 4px 14px rgba(0,0,0,.5); --e-3:0 18px 48px rgba(0,0,0,.62);
  --key-raise:0 2px 0 #000, 0 5px 10px rgba(0,0,0,.4); --key-press:inset 0 2px 5px rgba(0,0,0,.5);
}

/* ---- primitives ---- */
* { box-sizing: border-box; }
body { margin:0; background:var(--chassis); color:var(--ink); font-family:var(--font-ui); -webkit-font-smoothing:antialiased; }
.tnum { font-variant-numeric: tabular-nums; font-feature-settings:"tnum" 1; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}