/* ATLAS · tokens/depth.css — AuditHunt arc (v3.1) * ScrollStage writes --depth (0..1) to :root every frame. Every visual axis * below is a function of it. * * Palette arc — v3.1 QUIET policy: * Grounds are black everywhere. Only the accent hue drifts. * Surface → midnight blue. Hunt → rust. Proof → oxblood spark. * Brain/Archive → back to deep blue-steel. Swings are small. */ :root { /* Driven by ScrollStage. 0 = Perimeter, 1 = Brain. */ --depth: 0.02; /* Act bands — snap points for reference */ --act-1-end: 0.15; --act-2-end: 0.35; --act-3-end: 0.55; --act-4-end: 0.75; --act-5-end: 1.00; /* ── Depth-reactive color stops (v3.1 — quiet arc) ────────── Grounds DO NOT shift. Accent interpolates: Shield → Hunt (mid) → Shield again. */ --paper-tint: color-mix(in oklab, var(--bone) calc((1 - var(--depth)) * 100%), #050505); --ink-depth: color-mix(in oklab, var(--steel) calc((1 - var(--depth)) * 100%), var(--ink)); /* Accent arc — shield → hunt (mid, dimmed by 40%) → shield-dim at brain. */ --accent-mid: color-mix(in oklab, var(--shield) calc((1 - var(--depth)) * 100%), var(--hunt)); --accent-depth: color-mix(in oklab, var(--accent-mid) calc((1 - max(0, (var(--depth) - 0.72) * 3.57)) * 100%), #1C2840); /* Gradient center drifts top-right → bottom-left as we descend. */ --depth-x: calc(78% - var(--depth) * 58%); --depth-y: calc(14% + var(--depth) * 72%); /* Accent intensity — v3.2 drift is barely perceptible (× 0.25). abs() used for supporting browsers; static fallback for older engines. */ --accent-pulse: 0.05; --accent-pulse: calc((1 - max(var(--depth) - 0.48, 0.48 - var(--depth)) * 1.7) * 0.25); /* Type response — weight + tracking tighten with depth. */ --display-weight: calc(300 + var(--depth) * 300); --display-tracking: calc(-0.012em - var(--depth) * 0.022em); --body-opacity: calc(0.74 + var(--depth) * 0.14); /* Hairline strength — v3.2 max 0.10 (was 0.15). Whisper-thin. */ --hair-alpha: calc(0.04 + var(--depth) * 0.06); --hair: rgba(234, 238, 245, var(--hair-alpha)); /* Grain — v3.2 near-zero across the entire arc. */ --grain-opacity: calc(0.008 + max(0, 0.20 - abs(var(--depth) - 0.55)) * 0.04); } /* Reduced motion freezes depth at the correct entry point for each act. Uses :has() to read the body data-act attribute from :root scope. */ @media (prefers-reduced-motion: reduce) { :root { --depth: 0.30; } /* safe fallback */ :root:has([data-act="1"]) { --depth: 0.05; } :root:has([data-act="2"]) { --depth: 0.25; } :root:has([data-act="3"]) { --depth: 0.45; } :root:has([data-act="4"]) { --depth: 0.65; } :root:has([data-act="5"]) { --depth: 0.88; } :root:has([data-act="6"]) { --depth: 0.96; } } /* Per-page entry depth, set by . */ body[data-act="1"] { --entry-depth: 0.05; } body[data-act="2"] { --entry-depth: 0.25; } body[data-act="3"] { --entry-depth: 0.45; } body[data-act="4"] { --entry-depth: 0.65; } body[data-act="5"] { --entry-depth: 0.88; } body[data-act="6"] { --entry-depth: 0.96; }