/* ─────────────────────────────────────────────────────────────────────────
   Itô V2 — tokens. THE VALUE ORIGIN for branch v2.
   Every value below is measured from the v19 design files (the Component
   Library v2 canvas and the surface canvases). Nothing here is invented.

   STATUS: IN FORCE with DESIGN.md (R-09 signed 09-02). The application
   byte-copy is styles/tokens-v2.css, enforced by design lint check 8.
   styles/tokens.css retains V1 values for compatibility surfaces.
   The separate design-file render asset belongs to the design session.

   DARK MODE (ruled 09-01: both modes ship): a component INVERTS ITS
   CONSTRUCTION between modes, never swaps a hex. The dark values the
   canvases STATE are below under [data-theme="dark"]. The full dark ramp
   (grounds, hairlines, body text) is DESIGNED ON CANVAS before B-01 copies
   anything — dark values are drawn, never derived by arithmetic alone. A
   missing dark token here means "not yet drawn", and building against it
   is a stop, not a guess. THE FULL DARK RAMP WAS DESIGNED AND SIGNED
   09-03 (Sean; the audited proposal and its verification live in
   audits/2026-09-03-reference-kit/ — verification-5.md: 113/113 stated
   ratios recomputed exact). The law above stands for every FUTURE token.

   THE ACTIVATION CONTRACT (recorded 09-03 from the reference kit's
   round-3 work; two-way law): theme activation is ONE attribute —
   the application resolves the person's preference (System default,
   per-person persistence; the APPEARANCE control of DESIGN.md §5) and
   sets `data-theme="light"|"dark"` on the document element; the
   stylesheets carry `[data-theme="light"] { color-scheme: light }` and
   `[data-theme="dark"] { color-scheme: dark }`. DELIBERATELY no CSS
   `prefers-color-scheme` mirror of the values: a media-query copy would
   restate every dark value outside this origin, and a media query
   cannot express "Light on a dark machine". One origin, one attribute.
   ───────────────────────────────────────────────────────────────────── */

@property --rail-collapse-progress {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

:root {
  /* Sean's11 September identity delivery. Identity values stay out of product type. */
  --font-identity: "Outfit", sans-serif;
  --identity-lockup-gap: 0.22em;
  --identity-lockup-nudge: 0.064em;
  --dur-identity-ring: 1500ms;
  --dur-identity-accent: 750ms;
  --ease-identity: cubic-bezier(0.65, 0, 0.35, 1);
  --identity-ring-origin: 12px 14.77px;
  --bell-menu-width: 392px;
  --account-menu-width: 300px;
  --account-trigger-gap: 6px;
  --account-trigger-right: 5px;
  --account-trigger-left: 3px;
  --account-trigger-chevron: 11px;
  --ls-verdict: -0.003em;
  --account-menu-avatar-size: 28px;
  --rule-hairline: 1px;
  --notification-dot-size: 5px;
  --notification-badge-size: 17px;
  --account-menu-inset: 11px;
  --account-menu-row-y: 10px;
  --account-menu-identity-top: 13px;
  /* En document context revision3, supplied12 September. */
  --en-context-top: 13px;
  --en-context-inset: 14px;
  --en-context-gap: 11px;
  --en-control-gap: 9px;
  --en-file-y: 5px;
  --en-file-x: 10px;
  --en-kind-y: 2px;
  --en-input-y: 8px;
  --en-file-name-min: 120px;
  --en-row-leading: 1.4;
  /* Your Details, supplied account canvas11 September. */
  --account-details-label-width: 96px;
  --account-check-size: 16px; /* Profile API Tokens revision3 existing Check face */
  --credential-field-narrow: 92px; /* Profile token duration field width */
  --credential-acts-track: 132px; /* Profile token register final track */
  --credential-head-tracking: 0.11em; /* Delivered token table header */
  --account-details-avatar-size: 36px;
  --account-details-row-y: 9px;
  --account-details-gap: 10px;
  --account-details-action-gap: 7px;
  --account-details-input-inset: 8px;
  --account-details-label-tracking: 0.09em;
  --account-details-meta-tracking: 0.05em;
  --account-details-meta-leading: 1.6;
  --account-details-title-tracking: -0.004em;
  --account-details-title-leading: 1.3;
  --account-details-row-leading: 1.4;
  --account-details-section-gap: 14px;
  --account-act-primary-inset: 13px;
  /* Full Profile, supplied account canvas11 September, Round151. */
  --account-page-inset: 26px;
  --account-column-min: 320px;
  /* Connections, supplied account canvas11 September, Round156. */
  /* Account Setup delivered12 September, register/form inset. */
  --setup-row-inset: 11px;
  --setup-field-gap: 6px;
  --connection-primary-min: 520px;
  --connection-kind-min: 210px;
  --connection-kind-icon: 16px;
  --connection-inset: 12px;
  --connection-date-track: 140px;
  --connection-state-track: 96px;
  --account-org-label-width: 118px;
  --account-preference-track: 74px;
  --account-subtab-gap: 18px;
  --account-subtab-tracking: 0.07em;
  --account-readout-row: 32px;
  --account-session-dialog-width: 360px;
  --account-dialog-outer: 20px;
  --account-dialog-top: 15px;
  --account-dialog-inset: 16px;
  --account-people-date-track: 110px;
  --account-people-state-track: 120px;
  --notification-line-height: 1.45;
  --activity-cell-width: 5px;
  --activity-cell-height: 16px;
  --activity-cell-gap: 3px;
  --activity-stack-gap: 10px;
  --dur-activity: 1560ms;
  --dur-activity-step: 120ms;

  /* Rail Collapse v1, adopted Round134. One progress value moves the shell. */
  --shell-rail-collapsed: 51px;
  --rail-icon-size: 15px;
  --rail-mark-size: 23px;
  --rail-hover-dwell: 2000ms;
  /* R-62 (Sean, 09-18): the closing grace is ADOPTED as drawn. A pointer
     crossing the rail edge must not close it mid-reach. Like the dwell it
     is a delay before a decision, not motion, so reduced motion does not
     take it to zero. */
  --rail-close-grace: 400ms;
  --dur-rail: 180ms;
  --dur-rail-exit: 90ms;
  --dur-rail-enter: 120ms;
  --dur-rail-delay: 60ms;
  --ease-rail: cubic-bezier(0.65, 0, 0.35, 1);
  --ito-rail-icon-op: 0.72;
  --ito-rail-accent: #5358db;
  --ito-rail-hover: rgba(255,255,255,0.07);
  --ito-rail-press: rgba(255,255,255,0.12);
  --ito-rail-toggle-rule: rgba(255,255,255,0.09);
  --surface-rail: var(--ito-rail-ground);
  /* ── ink and text ─────────────────────────────────────────────── */
  --ito-ink: #14161A;            /* primary text on light grounds; the rail ground */
  --ito-body: #4A4F58;           /* prose, secondary text (7.4:1 on white) */
  --ito-body-strong: #2E3238;    /* emphasized body (10.1:1) */
  --ito-label: #646A73;          /* every eyebrow/label/caption on light grounds (5.62:1) */
  --ito-label-on-ink: #9DA3AF;   /* rail section labels — contrast is directional */
  --ito-faint: #8A8F98;          /* de-emphasized notes; the did-state */
  --ito-quiet: #6E7280;          /* ghost-button text */
  --ito-muted: #565C66;          /* inactive tab faces, SOON chips */

  /* ── the accent ───────────────────────────────────────────────── */
  --ito-accent: #5358db;         /* selection, links, the mark, the assumed half, the NOW rule */
  --ito-accent-deep: #5606FF;    /* the mark's gradient, stop 1 — the mark ONLY */
  --ito-accent-still: #4348C9;   /* the mark's gradient, stop 2 — the mark ONLY */
  --ito-accent-hover: #3F44C4;   /* the ONE accent's hover state (drawn on all five
                                    product canvases) — a state, never a second
                                    accent (§15) */

  /* ── semantic species (L09: one meaning per colour) ───────────── */
  --ito-red: #B4402F;            /* text: below floor, blocking, level variance */
  --ito-red-fill: #E0705C;       /* fill only (dark-mode badge fill; dark chart line) */
  --ito-amber: #8F6007;          /* text: waiting on a person, assumed, review */
  --ito-amber-fill: #E3B341;     /* fill only, never text. RULED more-yellow by
                                    Sean 09-02 (the drawn #C9962C read too close
                                    to the red fill on ink grounds); the canvases
                                    still draw #C9962C — flagged for the next
                                    canvas revision */
  --ito-green: #197152;          /* settled, contractual, within terms, cleared */

  /* ── grounds (five, and no gradients outside the mark) ────────── */
  --ito-surface: #FFFFFF;        /* regions, cells */
  --ito-panel: #FAFBFC;          /* the insights panel ground; plain-readout zebra */
  --ito-row: #F7F8FB;            /* row tint; group label rows */
  --ito-well: #F1F3F7;           /* wells: tab tracks, SOON chips, quiet tags */
  --ito-page: #EEF0F4;           /* the page itself */

  /* ── hairlines (lighter as they get more frequent) — two names, two
        jobs (09-02 audit): #E2E5EC is the OUTER SHELL border; #E4E7EF is
        the majority region hairline across four surfaces. #E4E6EC (12
        drawn uses, mostly the En canvas) is flagged as a near-duplicate
        for the next canvas revision — not declared. ── */
  --ito-rule-shell: #E2E5EC;
  --ito-rule-region: #E4E7EF;
  /* RULED STRONGER by Sean 09-09 (the light half of the 09-09 dark ruling:
     'I don't see the title and section division lines anywhere'): the
     section divider takes the ramp's own heavier drawn divider step
     (rule-strong's value); the drawn faint step stays on rule-row/table. */
  --ito-rule-section: #DFE2EA;
  --ito-rule-row: #F2F4F8;
  --ito-rule-table: #F4F5F8;

  /* ── selection and interaction ────────────────────────────────── */
  --ito-selected-row: #F7F8FD;   /* selected register row */
  --ito-selected-cell: #F1F2FA;  /* selected reading/cell ground */
  --ito-pill-border: #DDE0E8;    /* secondary button border */
  --ito-dashed: #C2C7D2;         /* SOON chip dashed border; disclosure chevrons */

  /* ── tags (tinted grounds; a state is always a tag) ───────────── */
  --ito-tag-green-bg: #E9F2EC;   /* SETTLED / CONTRACT */
  --ito-tag-amber-bg: #F8F1DF;   /* ASSUMED / TIMING / NEW-capability */
  --ito-tag-red-bg: #F7E9E6;     /* LEVEL / DRIFT / blocking tints */
  --ito-tag-accent-bg: #EDEEFB;  /* RESTATED / WIRING / open tints */
  --ito-tag-grey-bg: #F1F3F7;    /* STALE / quiet */

  /* ── badges (three species). The construction is GROUND-dependent,
        not theme-dependent (09-02 audit): an ink ground — the rail — carries
        SOLID FILL + ink numeral in BOTH themes (drawn: #7B80F0 on Command's
        light rail); tinted chip + edge belongs to light content grounds. ── */
  --ito-badge-open-onink-bg: #7B80F0;   --ito-badge-open-onink-fg: #14161A;
  --ito-badge-wait-onink-bg: #E3B341;   --ito-badge-wait-onink-fg: #14161A;
  --ito-badge-block-onink-bg: #E0705C;  --ito-badge-block-onink-fg: #14161A;
  /* light content grounds: tinted chip with border ─────────────── */
  --ito-badge-open-bg: #ECEDFB;      --ito-badge-open-fg: #5358db;      --ito-badge-open-edge: #CFD0F2;
  --ito-badge-wait-bg: #F8F1DF;      --ito-badge-wait-fg: #8F6007;      --ito-badge-wait-edge: #EBDCB4;
  --ito-badge-block-bg: #F9EAE7;     --ito-badge-block-fg: #B4402F;     --ito-badge-block-edge: #E8C9C2;

  /* ── charts ───────────────────────────────────────────────────── */
  /* Command standalone 09-08: settled area ink fades from nine percent. */
  --ito-chart-settled-opacity: 0.09;
  --ito-chart-settled-opacity-end: 0;
  --ito-chart-assumed: #A9AEE8;  /* the assumed (dotted) line */
  --ito-chart-band: #DEE0F9;     /* uncertainty band fill; bar tracks */
  --ito-chart-callout: #D9DCEC;  /* callout pill border */
  --ito-chart-claimed: #A2A9B6;  /* the grey dashed claimed line (drawn value; reconcile on canvas if it moves) */ /* corrected R-24/DH-005: #9AA0AC was drawn on NO canvas; #A2A9B6 is the drawn claimed line */

  /* ── radii (nothing else, ever) — MEASURED from the five product
        canvases (doctrine audit, 09-02). Root cause of the old ladder:
        Redesign Direction §1's after-specimen is labeled PROPOSED ·
        REGION, R6 ROWS, and that PROPOSAL — 12/10/6 — is what the docs
        encoded; the surfaces were then drawn tighter and never walked
        back. 12, 10 and 6 appear ZERO times on any product canvas. ── */
  --r-shell: 4px;                /* the outer product-surface container */
  --r-region: 3px;               /* regions, wells, popovers, cards */
  --r-prompt: 24px;             /* En and Command pill prompt, Sean 23 September */
  --r-composer: 12px;           /* En and Command chat inputs, Sean 23 September */
  --r-control: 2px;              /* buttons, inputs, rows, tags, tab faces */
  --r-bar: 1px;                  /* progress and legend bars */
  --r-dot: 50%;                  /* species dots, avatars */
  --r-pill: 999px;               /* the rail nav badge, and nothing else */

  /* ── rows and shell ───────────────────────────────────────────── */
  --row-register: 34px;
  --row-panel: 30px;
  --row-group: 26px;
  --avatar-account-size: 22px; /* Account delivery11 September trigger disc */
  --control-h-tab: 28px;       /* delivered V2 ModuleTabs face */
  --tab-inset: 3px;            /* delivered V2 ModuleTabs well gap and inset */
  --h-facet: 22px;               /* facet-segment faces + the window stepper (drawn 22
                                    in the Cash Flow and Command canvases) */
  --shell-rail: 216px;
  --topbar-h: 52px;              /* the drawn V2 bar (Ito Command v2 canvas:69).
                                    Declared in the V2 layer so it overrides V1's 56
                                    in the cascade — one height authority, the drawn
                                    one; every reader follows the token */
  --shell-center-min: 560px;
  --shell-panel: 300px;
  --shell-panel-min: 260px;      /* R-38 snaps, SIGNED by Sean 09-03: the divider's floor —
                                    beneath it the reading rows starve */
  --shell-panel-max: 480px;      /* R-38 snaps, SIGNED: the divider's ceiling */
  --shell-narrow: 1076px;        /* below this the panel drops AND its track collapses */
  --verdict-min: 270px;          /* the verdict sentence's floor — beneath it the readings
                                    starve the sentence to zero width (measured, 09-02) */
  --verdict-basis: 320px;        /* the sentence block's flex basis, as drawn */
  --verdict-readings-basis: 380px; /* the readings strip's flex basis, as drawn */
  --matrix-label: 150px;         /* the matrix's sticky label column, as drawn */

  /* ── spacing ──────────────────────────────────────────────────── */
  --sp-section: 40px;            /* between sections */
  --sp-inside: 24px;             /* inside a section */
  --sp-row-x: 12px;              /* register row padding */
  --sp-panel-x: 9px;             /* panel row padding */

  /* ── type ─────────────────────────────────────────────────────── */
  --font-sans: "Zen Kaku Gothic New", -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", monospace;
  /* Compatibility roles converge on the same two product faces so retained
     surfaces move with the system token rather than keeping a third voice. */
  --font-display: var(--font-sans);
  --font-body: var(--font-sans);
  --font-data: var(--font-mono);
  --fs-page-title: 19px;         /* 700 */
  --fs-verdict: 27px;            /* 700 · 1.15 · −0.003em · one per surface —
                                    drawn 27 on both flagship canvases (09-02
                                    audit); 22 is the PANEL FIGURE, only that */
  --fs-section: 15px;            /* 600 · two words; basis in the meta */
  --fs-entity: 13.5px;           /* 600 · the top-bar company/entity name — R-23
                                    (ruled 09-02): ONE declared step; Cash Flow’s
                                    drawn 14 normalizes at the next canvas revision */
  --fs-body: 12.5px;             /* 400 · 1.55 · cap 88–96ch */
  --fs-row: 12.5px;              /* one line in a 34px row */
  --fs-sub: 11.5px;              /* button labels, table sub-copy, reading subs —
                                    31+ drawn uses; declared per DESIGN §4's own
                                    rule (an undeclared size in use kills a scale) */
  /* mono scale — eight sizes, and no ninth */
  --fs-mono-datesub: 7.5px;
  --fs-mono-chart: 8px;
  --fs-mono-eyebrow: 8.5px;
  --fs-mono-axis: 9px;
  --fs-mono-rowmeta: 11px;
  --fs-mono-rowfig: 12px;
  --fs-mono-reading: 17px;
  --fs-mono-panelfig: 22px;
  --ls-eyebrow: 0.08em;          /* 0.11em on table headers as drawn */

  /* ── the NOW rule (L10) ───────────────────────────────────────── */
  --now-rule: 2px;               /* a rule, not a fill; full matrix height at W1's left edge */
  /* ── canvas-reconciled additions — R-24 signed by Sean 09-02 (the hex
        census: 96 drawn vs 47 declared; 14 structural values promoted to
        tokens, 3 near-duplicates flagged as MERGES in README, 35
        incidental left as canvas-local paint). Names finalized at the
        signing; rename via a later ruling if wanted. ── */
  --ito-rule-card: #EDEFF3;        /* the drawn card/list border, four canvases */
  --ito-chart-edge: #C6C9D2;       /* chart edge / axis stroke */
  --ito-meta-mid: #C7CBD6;         /* Packs meta value grey */
  --ito-rule-strong: #DFE2EA;      /* the heavier drawn divider, three canvases */
  --ito-label-faint: #949AA5;      /* drawn faint label ink, three canvases */
  --ito-accent-wash: #F2F3FD;      /* accent-tinted ground (Command) */
  --ito-green-wash: #E6F0EA;       /* ok-tinted ground */
  --ito-accent-edge: #DFE1F7;      /* accent-tinted edge (Packs) */
  --ito-scrollbar-thumb: #D6D9E2;  /* drawn scrollbar-color thumb */
  --ito-rule-dark: #B9BCCB;        /* drawn dark hairline / emphasized underline */
  --ito-edge-tint: #D5D9EC;        /* lavender-grey tinted border, three canvases */
  --ito-edge-neutral: #D9DCE4;     /* neutral border + drawn shadow edge */
  --ito-red-wash: #FDF6F4;         /* warm red-tinted wash ground */


  /* ── SIGNED ADDITIONS (Sean, 09-03 — the dark-ramp proposal's homes;
        each token's section home is annotated; same-both-themes tokens
        carry their one value here and are not repeated in the dark
        block) ─────────────────────────────────────────────────────── */
  --ito-fg-on-ink: #C6C9D2;          /* § ink and text · was drawn-undeclared --ito-rail-fg · same both themes */
  --ito-fg-on-ink-strong: #FFFFFF;   /* § ink and text · was --ito-rail-fg-on · the on-ink EMPHASIS state · same both themes */
  --ito-accent-on-ink: #A5A9F5;      /* § the accent · from tokens/identity gap · same both themes (8.27:1 on the rail ground) */
  --ito-rail-ground: #14161A;        /* § grounds · declared in BOTH themes (also in the dark block, per the signed
                                        structural proposal): the rail ground stops aliasing --ito-ink, which inverts */
  --ito-rule-red: #EED8D3;           /* § hairlines · was --ito-gate-fail-edge */
  --ito-selected-on-ink: rgba(255,255,255,0.14); /* S3, Rail Collapse v1; same both themes */
  --ito-rule-on-ink: #3A3D46;        /* § hairlines · the shell hairline as it reads ON the ink column (the dark ramp's own shell step) · same both themes — RULED by Sean 09-09: the rail carries the top bar's divider at the same height */
  --ito-bar-track-red: #F3DFDB;      /* § charts · was --ito-bar-track-out */
  --ito-bar-track-grey: #EDEFF4;     /* § charts · was --ito-bar-track-quiet */
  --ito-chart-callout-2: #C9CDD8;    /* § charts · was --ito-callout-edge-2 */

  /* ── engagement lifts (NEW section, signed 09-03) — a lift is a DEPTH,
        not a colour pair: on dark it inverts DIRECTION (deeper shadow),
        never vanishes ──────────────────────────────────────────────── */
  --ito-lift-tab: 0 1px 2px rgba(20,22,26,0.09);
  --ito-lift-popover: 0 8px 28px rgba(20,22,26,0.13);

}

/* Dark mode — THE FULL SIGNED RAMP (Sean, 09-03; designed by the
   design-system instrument as a swatch-sheet proposal, audited by the
   Builder — verification-5.md: 113/113 stated ratios recomputed exact —
   and signed). A component INVERTS ITS CONSTRUCTION between modes,
   never swaps a hex. Tokens deliberately the SAME in both themes are
   declared once in :root and not repeated here: the on-ink family
   (--ito-fg-on-ink, --ito-fg-on-ink-strong, --ito-accent-on-ink,
   --ito-selected-on-ink, the three -onink- badge pairs), and
   --ito-chart-assumed. Any FUTURE token still obeys the drawn-never-
   derived law above. */
/* Match the retained V1 root selector so this later layer owns shared names. */
:root[data-theme="dark"] {
  /* grounds — page darkest, surface lightest (the light ordering inverts) */
  --ito-page: #0F1013;           --ito-well: #17191F;           --ito-row: #1A1D23;
  --ito-panel: #1F2129;          --ito-surface: #24262E;
  --ito-rail-ground: #14161A;    /* explicit in BOTH themes per the signed structural proposal */

  /* ink and text — prose one step below the on-ink white (13.11:1 on surface) */
  --ito-ink: #EDEFF3;            --ito-body: #C6C9D2;           --ito-body-strong: #DDE0E7;
  --ito-label: #9DA3AF;          --ito-label-faint: #8A8F9B;    --ito-faint: #9095A0;
  --ito-quiet: #8E93A0;          --ito-muted: #9096A2;
  --ito-label-on-ink: #9DA3AF;   /* unchanged; already the on-ink grey */

  /* the accent */
  --ito-accent: #A5A9F5;         --ito-accent-hover: #BFC2F8;   --ito-accent-deep: #7B5CFF;
  --ito-accent-still: #8A8EE8;   --ito-accent-wash: #1E2038;    --ito-accent-edge: #3A3D63;

  /* species — the light FILLS become dark TEXT (construction inversion);
     green is the one designed choice (no drawn dark green exists) */
  --ito-red: #E0705C;            --ito-amber: #E3B341;          --ito-green: #4CAE86;
  --ito-red-fill: #E0705C;       --ito-amber-fill: #E3B341;
  --ito-red-wash: #2A1C1A;       --ito-green-wash: #17281F;

  /* hairlines */
  --ito-rule-shell: #3A3D46;     --ito-rule-region: #33363E;    --ito-rule-section: #43464F;
  --ito-rule-row: #2A2C34;       --ito-rule-table: #272932;     --ito-rule-card: #2C2E37;
  --ito-rule-strong: #43464F;    --ito-rule-dark: #565A66;      --ito-rule-red: #4A2E29;

  /* selection, borders, edges */
  --ito-selected-row: #1E2130;   --ito-selected-cell: #23263A;  --ito-pill-border: #3A3D46;
  --ito-dashed: #4A4E58;         --ito-edge-tint: #3A3E52;      --ito-edge-neutral: #3C3F48;

  /* tag grounds */
  --ito-tag-green-bg: #17281F;   --ito-tag-amber-bg: #2C2415;   --ito-tag-red-bg: #2E1E1B;
  --ito-tag-accent-bg: #1F2140;  --ito-tag-grey-bg: #262931;

  /* badges — ink grounds carry solid fill + ink numeral in BOTH themes */
  --ito-badge-open-bg: #7B80F0;      --ito-badge-open-fg: #14161A;      --ito-badge-open-edge: transparent;
  --ito-badge-wait-bg: #E3B341;      --ito-badge-wait-fg: #14161A;      --ito-badge-wait-edge: transparent;
  --ito-badge-block-bg: #E0705C;     --ito-badge-block-fg: #14161A;     --ito-badge-block-edge: transparent;

  /* charts */
  --ito-chart-band: #2B2F52;     --ito-chart-claimed: #8B92A0;  --ito-chart-callout: #3A3E52;
  --ito-chart-edge: #4A4E58;     --ito-chart-callout-2: #43464F;
  --ito-bar-track-red: #3A2723;  --ito-bar-track-grey: #2A2C34;
  --ito-meta-mid: #7E838F;       --ito-scrollbar-thumb: #3C3F48;

  /* engagement lifts — direction inverts: a deeper shadow, never vanishing */
  --ito-lift-tab: 0 1px 2px rgba(0,0,0,0.45);
  --ito-lift-popover: 0 8px 28px rgba(0,0,0,0.55);
}