/* ── PULSE V2.2 — design tokens · "ION ATMOSPHERE" (dual theme) ── */

:root {
  color-scheme: dark;

  /* Canvas + surfaces (cyan-tinted layered depth) */
  --canvas:    oklch(0.13 0.010 200);   /* ≈ #040809 · page background      */
  --surface-1: oklch(0.17 0.012 200);   /* ≈ #091111 · raised card / panel  */
  --surface-2: oklch(0.20 0.014 198);   /* ≈ #0e1818 · higher panel/inputs  */
  --surface-3: oklch(0.23 0.015 196);   /* ≈ #151f1f · hover lift           */

  /* Void — the monolith hero environment falls to TRUE black */
  --void-black: #010304;
  --void-glow-a: oklch(0.16 0.020 198 / 0.60); /* void top wash             */
  --void-glow-b: oklch(0.66 0.110 186 / 0.07); /* void floor glow           */

  /* Header scrims (cyan-black veils — replaces raw rgba(5,6,7,…)) */
  --veil-92: oklch(0.13 0.010 200 / 0.92);
  --veil-78: oklch(0.13 0.010 200 / 0.78);

  /* ---------- Hairlines (cyan-tinted alpha strokes) ---------- */
  --line-0: oklch(0.92 0.045 195 / 0.05);  /* whisper grid            */
  --line-1: oklch(0.92 0.045 195 / 0.08);  /* default hairline        */
  --line-2: oklch(0.92 0.045 195 / 0.13);  /* emphasized / hover      */
  --line-3: oklch(0.92 0.045 195 / 0.22);  /* strong / active         */

  /* Washes — hover fills (replace raw rgba(255,255,255,.03)) */
  --wash-1: oklch(0.90 0.060 195 / 0.04);
  --wash-2: oklch(0.90 0.060 195 / 0.07);

  /* ---------- Accent: Ion Cyan — one hue, several intensities ---------- */
  --accent:        #00d4c8;                  /* brand anchor (fills, strokes) */
  --accent-bright: oklch(0.82 0.150 184);    /* ≈ #00e3cf · accent TEXT on darks — 12.3:1 on canvas */
  --mint:          oklch(0.90 0.090 175);    /* ≈ #9cf2db · gradient-text endpoint — 15.5:1 */
  --accent-ink:    #03211e;                  /* text on accent fills — 9.1:1 on accent */
  --accent-tint-1: rgba(0, 212, 200, 0.14);  /* halos, chips, selections    */
  --accent-tint-2: rgba(0, 212, 200, 0.07);  /* faint washes                */
  --accent-line:   rgba(0, 212, 200, 0.45);  /* accented hairline           */

  /* ---------- Danger: ONLY for "stock / jitter" contrast in charts ---------- */
  --danger:      #ff4d5e;                    /* 6.2:1 on canvas (chart strokes) */
  --danger-tint: rgba(255, 77, 94, 0.12);

  /* ---------- Text tiers (cyan-tinted, AA-verified) ---------- */
  --text-1:     oklch(0.95 0.011 196);       /* ≈ #e7f1f1 · headings — 17.5:1 on canvas */
  --text-2:     oklch(0.84 0.016 196);       /* ≈ #bfcece · body — 12.4:1 canvas, 11.1:1 surface-2 */
  --text-3:     oklch(0.68 0.022 196);       /* ≈ #899d9d · muted — 7.1:1 canvas, 5.9:1 surface-3 */
  --text-4:     oklch(0.49 0.020 198);       /* ≈ #546464 · decorative ONLY — 3.2:1, fails AA for text */
  --text-ghost: oklch(0.90 0.060 195 / 0.07); /* oversized section numerals */

  /* ---------- Atmosphere: aurora glow stops + void rim-light ---------- */
  --aurora-a: oklch(0.74 0.14 190 / 0.30);   /* primary fold              */
  --aurora-b: oklch(0.68 0.13 198 / 0.26);   /* deep fold                 */
  --aurora-c: oklch(0.72 0.12 184 / 0.18);   /* wide wash                 */
  --aurora-d: oklch(0.82 0.12 172 / 0.14);   /* mint highlight            */
  --rim-1:    oklch(0.78 0.16 184 / 0.22);   /* void rim-light, hot core  */
  --rim-2:    oklch(0.86 0.10 190 / 0.07);   /* void rim-light, wide fall */

  /* ---------- Viz: gauge / chart / trace plumbing ---------- */
  --viz-track:  oklch(0.92 0.050 195 / 0.10); /* gauge + bar track          */
  --viz-grid:   oklch(0.92 0.050 195 / 0.06); /* chart gridlines, eng. grid */
  --scanline:   oklch(0.92 0.060 195 / 0.025);/* scanline texture stripe    */
  --glow-soft:  0 0 8px oklch(0.78 0.16 184 / 0.50);  /* drop-shadow(var(--glow-soft)) */
  --glow-trace: 0 0 14px oklch(0.78 0.16 184 / 0.70); /* hotter — seams, pulse */

  /* ---------- Monolith slab (base.css consumes; theme-resolved) ---------- */
  --slab-edge:     oklch(0.78 0.10 190 / 0.22);  /* slab border             */
  --slab-edge-top: oklch(0.86 0.10 190 / 0.32);  /* top edge catchlight     */
  --slab-face:     oklch(0.165 0.014 200);       /* glass base color        */
  --slab-glow:     oklch(0.30 0.030 196 / 0.60); /* face top-light radial   */
  --slab-grad-1:   oklch(0.21 0.016 199 / 0.96); /* face gradient start     */
  --slab-grad-2:   oklch(0.13 0.012 200 / 0.98); /* face gradient end       */
  --slab-sheen:    oklch(0.97 0.030 195 / 0.20); /* top rim-light hairline  */
  --slab-bar:      oklch(0.11 0.010 200 / 0.6);  /* title bar fill          */
  --slab-ring:     oklch(0.08 0.012 210 / 0.85); /* 1px containment ring    */
  --slab-drop:     oklch(0.04 0.020 215 / 0.9);  /* deep drop shadow color  */
  --slab-halo:     rgba(0, 212, 200, 0.28);      /* cyan under-halo         */

  /* ---------- Panel tint (deep gradient panels, e.g. SHA panel) -------- */
  --panel-tint-1: oklch(0.18 0.012 200 / 0.92);
  --panel-tint-2: oklch(0.14 0.011 200 / 0.96);

  /* Signal field canvas palette (field.js reads these) */
  --field-t0:    rgba(0, 198, 188, 0.07);   /* dim edge traces             */
  --field-stock: rgba(255, 77, 94, 0.12);   /* red "stock" traces          */
  --field-t1:    rgba(0, 212, 200, 0.11);   /* mid traces                  */
  --field-t2:    rgba(0, 224, 213, 0.16);   /* brighter traces             */
  --field-t3:    rgba(112, 242, 232, 0.22); /* center traces               */
  --field-shade-0: rgba(1, 3, 4, 0.74);     /* copy skip-zone, core        */
  --field-shade-1: rgba(1, 3, 4, 0.46);     /* copy skip-zone, mid         */
  --field-shade-2: rgba(1, 3, 4, 0);        /* copy skip-zone, edge        */
  --field-sweep-a: rgba(0, 212, 200, 0);    /* sweep strip stops →         */
  --field-sweep-b: rgba(0, 212, 200, 0.05);
  --field-sweep-c: rgba(0, 222, 210, 0.16);
  --field-sweep-d: rgba(150, 255, 246, 0.5);
  --field-sweep-core: rgba(225, 255, 252, 0.9);
  --field-sweep-e: rgba(150, 255, 246, 0.42);
  --field-sweep-f: rgba(0, 212, 200, 0.07);
  --field-beam: rgba(214, 255, 251, 0.85);  /* sweep center line           */
  --field-blend: lighter;                   /* canvas composite op         */

  /* ---------- Typography ---------- */
  --font-sans: "Instrument Sans", system-ui, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "Space Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* Type scale — the ONLY size source. No component-level clamps. */
  --fs-display: clamp(3.5rem, 8vw, 7rem);        /* index hero only       */
  --fs-h1:      clamp(2.5rem, 5.5vw, 4.25rem);   /* page heroes           */
  --fs-h2:      clamp(2rem, 4vw, 3rem);          /* section titles        */
  --fs-h3:      clamp(1.375rem, 2.4vw, 1.75rem); /* card / module titles  */
  --fs-h4:      1.125rem;                        /* minor headings        */
  --fs-lead:    clamp(1.125rem, 1.4vw, 1.3125rem); /* hero subs           */
  --fs-body:    1.0625rem;                       /* 17px body             */
  --fs-body-sm: 0.9375rem;                       /* 15px secondary        */
  --fs-micro:   0.6875rem;                       /* 11px mono labels — the FLOOR */
  --fs-num-lg:  clamp(2.5rem, 5vw, 4rem);        /* KPI numerals          */

  /* Tracking */
  --track-display: -0.04em;  /* display + h1            */
  --track-tight:   -0.02em;  /* h2 / h3                 */
  --track-micro:    0.12em;  /* uppercase mono labels   */

  /* Line heights */
  --lh-display: 1.02;
  --lh-heading: 1.12;
  --lh-body:    1.6;

  /* ---------- Spacing scale ---------- */
  --sp-1:  0.25rem;   /*   4px */
  --sp-2:  0.5rem;    /*   8px */
  --sp-3:  0.75rem;   /*  12px */
  --sp-4:  1rem;      /*  16px */
  --sp-5:  1.5rem;    /*  24px */
  --sp-6:  2rem;      /*  32px */
  --sp-7:  3rem;      /*  48px */
  --sp-8:  4rem;      /*  64px */
  --sp-9:  6rem;      /*  96px */
  --sp-10: 8rem;      /* 128px */
  --sp-section: clamp(7.5rem, 12vw, 11.25rem);  /* 120–180px between sections */

  /* ---------- Layout ---------- */
  --gutter:          clamp(1.25rem, 5vw, 2.5rem);
  --container-max:   72rem;   /* 1152px standard   */
  --container-wide:  84rem;   /* full-bleed bands  */
  --container-prose: 44rem;   /* legal / docs      */

  /* ---------- Radii ---------- */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   16px;   /* monolith glass */
  --radius-pill: 999px;

  /* ---------- Shadows + glows (cyan-black, never neutral) ---------- */
  --shadow-1: 0 1px 2px oklch(0.05 0.020 220 / 0.55);
  --shadow-2: 0 12px 40px oklch(0.04 0.020 215 / 0.50);
  --shadow-slab: 0 1px 0 oklch(0.97 0.030 195 / 0.07) inset,
                 0 40px 90px -30px oklch(0.02 0.010 220 / 0.85);
  --glow-accent:    0 0 24px rgba(0, 212, 200, 0.28);
  --glow-accent-lg: 0 0 64px rgba(0, 212, 200, 0.16);

  /* ---------- Motion ---------- */
  --dur-1: 150ms;      /* micro-interactions          */
  --dur-2: 300ms;      /* hover states, nav           */
  --dur-3: 600ms;      /* reveals                     */
  --dur-trace: 1800ms; /* oscilloscope trace draw     */
  --dur-gauge: 900ms;  /* gauge sweep / bar fill      */
  --ease-glide: cubic-bezier(0.22, 0.8, 0.24, 1);  /* the house curve */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --rv-shift: 12px;    /* reveal travel (8–14px)      */

  /* ---------- Z-layers ---------- */
  --z-viz:    -1;   /* traces / auroras sit behind content      */
  --z-raised: 10;
  --z-nav:    90;
  --z-grain:  100;  /* grain film sits over everything          */
  --z-skip:   110;  /* skip link above all                      */
}

/* ── LIGHT THEME — "LABORATORY WHITE" A bright clean instrument: paper… ── */
html[data-theme="light"] {
  color-scheme: light;

  --canvas:    oklch(0.975 0.005 200);  /* ≈ #f3f8f8 · paper                */
  --surface-1: oklch(0.99 0.003 200);   /* ≈ #fafcfc · white card           */
  --surface-2: oklch(0.955 0.007 198);  /* ≈ #ebf2f2 · inputs / panels      */
  --surface-3: oklch(0.935 0.009 196);  /* ≈ #e3ebeb · hover lift           */

  /* The void becomes the brightest surface in the lab */
  --void-black: oklch(0.985 0.004 200); /* ≈ #f7fbfb                        */
  --void-glow-a: oklch(0.93 0.030 198 / 0.70);
  --void-glow-b: oklch(0.60 0.110 186 / 0.10);

  --veil-92: oklch(0.975 0.005 200 / 0.92);
  --veil-78: oklch(0.975 0.005 200 / 0.78);

  --line-0: oklch(0.35 0.045 195 / 0.06);
  --line-1: oklch(0.35 0.045 195 / 0.10);
  --line-2: oklch(0.35 0.045 195 / 0.16);
  --line-3: oklch(0.35 0.045 195 / 0.28);

  --wash-1: oklch(0.40 0.060 195 / 0.04);
  --wash-2: oklch(0.40 0.060 195 / 0.07);

  --accent:        oklch(0.53 0.115 184); /* ≈ #008073 · 4.5:1 on canvas (fills, strokes) */
  --accent-bright: oklch(0.47 0.105 184); /* ≈ #006d61 · accent TEXT — 5.8:1 on canvas, 4.8:1 on the tinted… */
  --mint:          oklch(0.47 0.070 175); /* ≈ #286859 · gradient endpoint — 6.1:1 */
  --accent-ink:    oklch(0.985 0.010 184);/* ≈ #f3fcfb · text on accent fills — 4.6:1 */
  --accent-tint-1: rgba(0, 128, 115, 0.14);
  --accent-tint-2: rgba(0, 128, 115, 0.08);
  --accent-line:   rgba(0, 128, 115, 0.45);

  --danger:      oklch(0.50 0.170 18);    /* ≈ #af283d · 6.1:1 on canvas    */
  --danger-tint: rgba(175, 40, 61, 0.10);

  --text-1:     oklch(0.21 0.015 196);    /* ≈ #101b1b · 16.5:1             */
  --text-2:     oklch(0.32 0.020 196);    /* ≈ #273636 · 11.7:1             */
  --text-3:     oklch(0.45 0.025 196);    /* ≈ #455a5a · 6.9:1              */
  --text-4:     oklch(0.62 0.020 198);    /* ≈ #798a8a · decorative ONLY    */
  --text-ghost: oklch(0.30 0.060 195 / 0.08);

  /* Auroras: soft cyan washes on paper */
  --aurora-a: oklch(0.82 0.085 190 / 0.55);
  --aurora-b: oklch(0.84 0.075 198 / 0.45);
  --aurora-c: oklch(0.88 0.065 184 / 0.40);
  --aurora-d: oklch(0.90 0.060 172 / 0.32);
  --rim-1:    oklch(0.78 0.110 184 / 0.34);
  --rim-2:    oklch(0.88 0.060 190 / 0.16);

  --viz-track:  oklch(0.40 0.050 195 / 0.14);
  --viz-grid:   oklch(0.40 0.050 195 / 0.08);
  --scanline:   oklch(0.35 0.060 195 / 0.04);
  --glow-soft:  0 0 8px oklch(0.53 0.115 184 / 0.40);
  --glow-trace: 0 0 14px oklch(0.53 0.115 184 / 0.55);

  /* Slab: white glass artifact on the lab bench */
  --slab-edge:     oklch(0.45 0.080 190 / 0.28);
  --slab-edge-top: oklch(0.99 0.005 190 / 0.90);
  --slab-face:     oklch(0.975 0.006 200);
  --slab-glow:     oklch(0.92 0.030 196 / 0.70);
  --slab-grad-1:   oklch(0.99 0.004 199 / 0.96);
  --slab-grad-2:   oklch(0.955 0.008 200 / 0.98);
  --slab-sheen:    oklch(1 0 0 / 0.85);
  --slab-bar:      oklch(0.965 0.006 200 / 0.75);
  --slab-ring:     oklch(0.60 0.040 210 / 0.20);
  --slab-drop:     oklch(0.45 0.030 215 / 0.30);
  --slab-halo:     rgba(0, 128, 115, 0.20);

  --panel-tint-1: oklch(0.97 0.006 200 / 0.92);
  --panel-tint-2: oklch(0.945 0.008 200 / 0.96);

  /* Signal field: dark teal traces on paper, sweep drawn opaque (not */
  --field-t0:    rgba(8, 109, 102, 0.10);
  --field-stock: rgba(175, 40, 61, 0.16);
  --field-t1:    rgba(0, 128, 115, 0.16);
  --field-t2:    rgba(0, 118, 106, 0.24);
  --field-t3:    rgba(0, 102, 91, 0.34);
  --field-shade-0: rgba(247, 251, 251, 0.80);
  --field-shade-1: rgba(247, 251, 251, 0.50);
  --field-shade-2: rgba(247, 251, 251, 0);
  --field-sweep-a: rgba(0, 128, 115, 0);
  --field-sweep-b: rgba(0, 128, 115, 0.04);
  --field-sweep-c: rgba(0, 122, 110, 0.12);
  --field-sweep-d: rgba(0, 102, 91, 0.36);
  --field-sweep-core: rgba(0, 90, 80, 0.85);
  --field-sweep-e: rgba(0, 102, 91, 0.30);
  --field-sweep-f: rgba(0, 128, 115, 0.05);
  --field-beam: rgba(0, 90, 80, 0.80);
  --field-blend: source-over;

  /* Shadows lighten — soft cool greys, never heavy black */
  --shadow-1: 0 1px 2px oklch(0.45 0.020 220 / 0.16);
  --shadow-2: 0 12px 40px oklch(0.45 0.020 215 / 0.14);
  --shadow-slab: 0 1px 0 oklch(1 0 0 / 0.85) inset,
                 0 40px 90px -30px oklch(0.40 0.020 220 / 0.28);
  --glow-accent:    0 0 24px rgba(0, 128, 115, 0.22);
  --glow-accent-lg: 0 0 64px rgba(0, 128, 115, 0.12);
}