/* ═══════════════════════════════════════════════════════════════════════════
   PHNTM // DESIGN TOKENS  (P43.1)

   One name, one meaning. The bug that forced this: --surface was defined in
   twenty templates as rgba(255,255,255,0.035), a translucent WASH, and in four
   more as an opaque #0c1115. .phntm-menu-drawer asked for var(--surface) and
   got whichever the page happened to set, which is why the drawer is
   see-through on CORTEX and solid on the hub. The name is what allowed it.

   So the wash keeps its value under an honest name, --overlay-wash, and
   --surface becomes the opaque page background at the bottom of a tonal
   ladder.

   SEPARATION COMES FROM TONE, NOT TRANSPARENCY. Material 3 retired tint-based
   elevation: "Surface tint color is deprecated" and "Tone-based surface color
   roles have replaced the previous approach of surfaces at +1 to +5
   elevation." Every surface role below is opaque.

   ON CONTRAST. Adjacent surface roles sit at 1.03 to 1.16:1, and that is
   correct rather than a miscalibration: Google's own dark baselines measure
   1.04 to 1.17:1 between adjacent steps. WCAG 1.4.11's 3:1 governs component
   BOUNDARIES, which is --outline's job, not the tonal distance between two
   backgrounds. Ratios are pasted in the P43 report.

   PHNTM | P43.1
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Surface ladder. Opaque, tonal, PHNTM's green-leaning neutral at
        Google's dark lightness steps. Usable dark range is #0E to #37. ── */
  --surface-lowest:    #0a0d11;   /* Neutral  4 — deepest wells, code blocks */
  --surface:           #0e1116;   /* Neutral  6 — page background            */
  --surface-low:       #151a21;   /* Neutral 10 — resting cards              */
  --surface-container: #191f26;   /* Neutral 12 — navigation regions         */
  --surface-high:      #222a33;   /* Neutral 17 — raised panels, menus       */
  --surface-highest:   #222c3a;   /* Neutral 22 — modals, sheets             */

  --on-surface:         #d8dee6;
  --on-surface-variant: #9fa8b0;

  /* Neutral 0 at 32%. A scrim is the thing that makes a drawer read as
     temporary; without it an opaque drawer looks like a page. */
  --scrim: rgba(0, 0, 0, 0.32);

  --outline:         #8a929a;   /* Neutral-variant 60 — component boundaries */
  --outline-variant: #5f656a;   /* dividers. Lifted from NV30 to clear 3:1
                                   against --surface so a divider is actually
                                   perceivable; NV30 measured 2.15:1.        */

  /* ── The wash, named for what it is. Same value it always had, so nothing
        that consumes it changes appearance. ── */
  --overlay-wash:  rgba(255, 255, 255, 0.035);
  --overlay-wash2: rgba(255, 255, 255, 0.06);

  /* ── The accent, lifted here because the archive already agreed on it.
        primitives.css consumes var(--azul) for the primary button and the
        focus ring, but no stylesheet defined it — every page restated the
        palette in its own <style>, which is the pattern that made rule 7
        necessary. A page that forgot lost its accent.

        Only the UNANIMOUS values are lifted. Counting every declaration and
        every var() fallback across all templates: --azul is #2e9bff in
        46 of 46, --azul-dim #3f5468 in 64 of 64, --azul-muted
        #14304a in 30 of 30, --text-dim #8098b0 in 25 of 25. Nothing resolves
        to a different value than it does today, so this is a move, not a
        repaint.

        --bg, --text, --text-muted, --amber, --red and --border-bright are
        deliberately NOT here. Each has two or more values in live use (--bg is
        #04060a in 25 declarations and #04060a in 17 fallbacks), and picking a
        winner would repaint the 16 templates that carry no palette of their
        own. That is a decision to take deliberately, not in passing. New
        surfaces should use the semantic roles above — --surface for the page,
        --on-surface for text — which have been unambiguous since P43.1. ── */
  --azul:        #2e9bff;
  --azul-dim:    #1e4a73;
  --azul-muted:  #14304a;

  /* ── SCRIBE, dark ────────────────────────────────────────────────────────
     SCRIBE is the notebook. Its whole palette was authored dark-only and drawn
     on --bg-base (#04060a), which has no light value, so in light mode the
     notebook stayed near-black under dark ink and nothing could be read. The
     palette lives here now, answered for both themes, so it flips like the rest
     of the app.

     Three roles, kept apart deliberately (the DISPATCH lesson: a colour used as
     a fill is not the same colour used as ink):
       --scribe       the sage IDENTITY, used only as a fill  -  the FAB, colour
                      dots, the checkbox, the active border. One value, because a
                      coloured object reads on either ground; it is never text.
       --scribe-ink   the sage as TEXT  -  links, labels, active rows, headings
                      accents. This one MUST flip: #a9c0d6 is 10:1 on the dark
                      page and would be 2:1 on the light one, so light gets a
                      deep slate-sage instead. In the text-token gate.
       --scribe-bright alias of --scribe-ink, kept so existing rules need no edit.
     Tints and surfaces are translucent sage or map to the surface ramp, so they
     lighten the dark ground and tint the light one without a second value. */
  --scribe:        #7c9ec2;
  --scribe-ink:    #a9c0d6;
  --scribe-bright: var(--scribe-ink);
  --scribe-dim:    rgba(124, 158, 194, 0.40);
  --scribe-glow:   rgba(124, 158, 194, 0.12);
  --scribe-tint:   rgba(124, 158, 194, 0.15);
  --scribe-rule:   rgba(150, 167, 184, 0.10);
  --scribe-bar:    rgba(14, 17, 22, 0.72);
  --scribe-glass:  rgba(20, 24, 31, 0.92);
  /* CAD-02: white habit ink. Near-white on the dark grid, near-black in light
     so a white habit stays legible if CADENCE gains a light mode. */
  --cad-white-ink: #f2f5f8;
  --text-dim:        #8098b0;

  /* ── Type scale. Material's, from a 14dp base. size / line-height / tracking.
        LINE HEIGHT IS NEVER LOCKED anywhere in this system: WCAG 1.4.12
        requires a layout to survive line-height forced to 1.5x, so these are
        starting values a user stylesheet can override, not fixed heights. ── */
  --headline-small-size: 24px;  --headline-small-lh: 32px;  --headline-small-track: 0;
  --title-large-size:    22px;  --title-large-lh:    28px;  --title-large-track: 0;
  --title-medium-size:   16px;  --title-medium-lh:   24px;  --title-medium-track: 0.15px;
  --title-small-size:    14px;  --title-small-lh:    20px;  --title-small-track: 0.1px;
  --body-large-size:     16px;  --body-large-lh:     24px;  --body-large-track: 0;
  --body-medium-size:    14px;  --body-medium-lh:    20px;  --body-medium-track: 0;
  --body-small-size:     12px;  --body-small-lh:     16px;  --body-small-track: 0.1px;
  --label-large-size:    14px;  --label-large-lh:    20px;  --label-large-track: 0;
  --label-medium-size:   12px;  --label-medium-lh:   16px;  --label-medium-track: 0.1px;
  /* 11px is permitted ONLY for ALL CAPS tactical labels, which is what PHNTM's
     section headers already are. Anything read as a sentence stays at 12+. The
     P43.3 audit enforces exactly that distinction. */
  --label-small-size:    11px;  --label-small-lh:    16px;  --label-small-track: 0.1px;

  /* ── Spacing, 8dp base. Nested units at 2, 4, 6 and 10dp only. New values
        follow the multiplier pattern, so space225 is 18dp. ── */
  --space25:   2px;
  --space50:   4px;
  --space75:   6px;
  --space100:  8px;
  --space125: 10px;
  --space150: 12px;
  --space175: 14px;
  --space200: 16px;
  --space225: 18px;
  --space250: 20px;
  --space300: 24px;
  --space400: 32px;
  --space500: 40px;
  --space600: 48px;
  --space800: 64px;

  /* ── Shape ── */
  --radius-chip:   8px;
  --radius-card:  12px;
  --radius-sheet: 16px;

  /* ── Targets. Painted size and hit size are different numbers on purpose.
        Material: "If required, the target can extend beyond the visible
        container of the chip." ── */
  --target-min:   48px;
  --chip-painted: 32px;
  --icon-size:    18px;

  /* ── Navigation (P44). These are system tokens, so they live here rather
        than in the consumer, which is also what keeps audit rule 7 flat. ── */
  --nav-bar-height: 80px;          /* Material container height */
  --nav-rail-width: 96px;          /* collapsed */
  --nav-rail-width-expanded: 220px;
  --nav-item-height: 64px;
  --statusbar-height: 32px;       /* VITALS strip, Medium and up */
  --badge-inset: 2px;             /* p-badge-anchor overhang */
  --scrim-blur: 12px;             /* backdrop-filter radius */
  --badge-size: 16px;             /* p-badge, painted */
  --badge-dot: 6px;               /* p-badge--dot */
  --icon-btn-glyph: 24px;         /* p-btn--icon svg */
  --focus-ring: 2px;              /* focus-visible outline */
  --row-h-two-line: 72px;         /* p-row--two */
  --row-h-three-line: 88px;       /* p-row--three */
  --on-accent: #04101a;           /* text on a azul fill */
  --list-row-height: 56px;

  /* ── P53: the row primitive ───────────────────────────────────────────
     Heights are FLOORS. Every one of these is consumed as min-height and
     never as height, because the operator's Android font scaling is not yet
     known and a row that grows is correct at any scale while a row pinned to
     48px is wrong the moment his text renders larger. */
  --row-h-one: 48px;              /* no status line */
  --row-h-two: 56px;              /* status line present */
  --dot: 8px;
  --swatch: 10px;
  --radius-xs: 2px;
  /* Derived, not measured by eye: a 10dp swatch against the title's line box
     sits mid-line at exactly this offset, which is why one rule serves both a
     single-line title and a wrapping one. Survives a change to either value. */
  /* The row's own type step. The locked spec is 14/20, which is Material
     body-medium, NOT body-large at 16/24. Using body-large put every title on
     a 24px line and made a single-line row measure 53px against a 48px floor,
     and it pushed the derived swatch offset to 7px where the spec's arithmetic
     gives 5. Named separately from body-medium so a change to the row's type
     does not silently move every body-medium string in the app. */
  --text-row-size: var(--body-medium-size);
  --text-row-lh:   var(--body-medium-lh);
  --text-row-track: var(--body-medium-track);
  --swatch-offset: calc((var(--text-row-lh) - var(--swatch)) / 2);
  --line-micro: var(--label-small-lh);

  /* State palette. Blue is the only new hue: it means something is actively
     changing, so it blinks. Amber waits on a human and stays steady, because
     steady reads as patient rather than urgent. Red appears in exactly one
     place in the whole application, which is what keeps it meaning something. */
  --state-active: #4EA7FC;
  --state-waiting: var(--amber);
  --state-failed: var(--red);

  /* ── Company swatches ─────────────────────────────────────────────────
     Four slots reserved. NOTE: Ashling currently shares the accent green. If
     the palette grows past two companies, Ashling shifts one step off it so
     the active navigation destination stays unmistakable. Flagged here, not
     yet needed. */
  --co-ashling: #1c5c3a;
  --co-boeing:  #0039a6;
  --co-slot-3:  #F5B942;
  --co-slot-4:  #A78BFA;
  --co-slot-5:  #0064c8;
  --co-slot-6:  #FF7BA6;
  --co-unknown: var(--outline-variant);        /* Material list item, one line */
  --nav-indicator-w: 56px;
  --nav-indicator-h: 32px;
  --nav-icon: 24px;
  --nav-rail-top: 44px;            /* top space, deliberately not filled */
  --nav-menu-width: 280px;
  /* Elevation level 2, cast upward for a bottom-anchored bar. Tone does most
     of the work; the shadow is the only cue a fixed bar needs to read as
     sitting above the page. */
  --elevation-2-up: 0 -1px 3px rgba(0, 0, 0, 0.30);

  /* Cadence port */
  --on-surface-74: rgba(255, 255, 255, 0.74);
  --on-surface-58: rgba(255, 255, 255, 0.58);
  --azul-30: rgba(46, 155, 255, 0.30);
  --azul-20: rgba(46, 155, 255, 0.20);
  --scrim-heavy: rgba(0, 0, 0, 0.72);

  /* Type scale (2026-09-10). The system had spacing, radii and colour tokens
     but no type scale, so every font-size in the app was a raw literal and
     rule 7 could never be satisfied. These are the sizes actually in use.
     A later design pass should consolidate 15 steps into ~8. */
  --text-8: 8px;
  --text-9: 9px;
  --text-10: 10px;
  --text-11: 11px;
  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-17: 17px;
  --text-18: 18px;
  --text-20: 20px;
  --text-22: 22px;
  --text-26: 26px;
  --text-28: 28px;

  /* Two constants that were 50 copies of a number (2026-09-10). */
  /* CODEX shelf (2026-09-10). Cover cards are the only place in the app with a
     fixed aspect ratio and a fixed card width, so the metrics live here rather
     than as literals in codex.css (rule 7). 2:3 is the comic trim size. */
  --codex-card-w: 124px;
  --codex-card-w-lg: 156px;
  --codex-hero-w: 168px;
  --codex-rail-h: 4px;
  --codex-sheet-max: 760px;
  --codex-strip-w: 86px;
  --codex-reader-bar: 56px;   /* reader chrome height, top and bottom */
  --codex-thumb: 18px;        /* page-scrubber thumb */
  --codex-loupe: 216px;       /* magnifier diameter */
  --codex-end-w: 420px;       /* end-of-book panel */
  /* Publisher marks, from Daoud's own Azul spec for the pull-list email. The
     shelf uses the same colour per publisher so the two surfaces agree. */
  --pub-dc: #f9a03f;
  --pub-marvel: #f2557a;
  --pub-idw: #4caf50;
  --pub-boom: #9c6ade;
  --pub-dynamite: #e2574c;
  --pub-other: #8098b0;
  --target-hig: 44px;   /* Apple HIG minimum touch target; --target-min 48px is ours */
  --control-h:  36px;   /* compact control height: chips, small buttons */
}

:root{
/* PHNTM:pagehead tokens, MK.V */
  --pagehead-height: 48px;
  --pagehead-height-sm: 44px;
  --pagehead-logo-h: 22px;
  --pagehead-logo-h-sm: 18px;
  --pagehead-blur: 12px;
  --pagehead-track: 0.72px;
/* PHNTM:pagehead end */
}

/* PHNTM:missing-token aliases, MK.V */
:root{
  --text: var(--on-surface);  /* was falling back to #d8e0d8, green tinted */
  --bg: var(--surface-lowest);  /* was falling back to #04060a or the green #04060a */
  --border: var(--border-rest);  /* was invalid, so borders vanished or inherited */
  --border-bright: var(--border-strong);  /* was invalid, so it resolved to currentColor and drew a near-white line */
  --mono: var(--font-mono);  /* was falling back to generic ui-monospace */
  --red: var(--danger);  /* unblocks --state-failed */
  --accent-rgb: 46, 155, 255;  /* azul as rgb triplet, used inside rgba() */
  /* MK.VI text-muted, resolved 2026-09-01.
     tokens.css previously left this out because it had "two or more values in
     live use". The real count was eight, across 32 declarations, ranging from
     2.5:1 (#3f5468, unreadable) to 5.4:1, so the same word meant a different
     grey on every page. Resolved to one value at 6.3:1 against --surface-lowest,
     which is readable without collapsing the gap to --text. All 32 per-page
     declarations were rewritten to match, so this is now the only decision. */
  --text-muted: #8494a3;
  /* MK.VI: the tile hover treatment was two dark literals inside shell.css,
     so hovering a card in light mode painted a dark slate wash and a heavy
     black shadow. Named here so both themes can answer. */
  --tile-hover-wash: rgba(20, 27, 34, 0.65);
  --tile-hover-shadow: 0 12px 36px rgba(0, 0, 0, 0.50), 0 0 0 1px rgba(var(--accent-rgb), 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  /* MK.VI: #phntm-statusbar was rgba(20,24,31,0.5), a dark literal in
     shell.css. It never flipped, so light mode kept a dark band across the
     bottom of every page and its text measured 1.68:1. */
  --statusbar-bg: rgba(20, 24, 31, 0.5);
  /* MK.VI: --primary and --azul-48 were referenced by the cadence radar
     and defined nowhere, so `--cad-blue: var(--primary)` was invalid and
     the radar shape rendered on a fallback in DARK as well as light. */
  --primary: var(--azul);
  --azul-48: rgba(46, 155, 255, 0.48);
  /* MK.VI, found by Rule C. --surface2 (note: not --surface-2) painted two
     hover backgrounds in spectre-head.css that therefore did nothing at all.
     --text-bright coloured the company name in detail.html. Neither existed. */
  --surface2: var(--surface-container);
  --text-bright: var(--text);
}
/* PHNTM:missing-token aliases end */

/* PHNTM:spectre palette, MK.VI ─────────────────────────────────────────
   Taken from the Figma Make export at src/screens/Spectre.tsx, which is
   dark-only. The light half is Claude's, chosen for contrast. These lived
   in spectre-mock.css until rule 7b pointed out that a module file is not
   where tokens are made. */
:root {
  --sm-surf:  rgba(255,255,255,0.035);
  --sm-surfr: rgba(255,255,255,0.06);
  --sm-bdr:   rgba(255,255,255,0.07);
  --sm-hair:  rgba(255,255,255,0.04);
  --sm-bg:    #0b0e12;
  --sm-acc:   #2e9bff;
  --sm-accd:  #2b4a6b;
  --sm-accm:  #12283d;
  --sm-txt:   #e3e9ef;
  --sm-txtd:  #93a5b8;
  --sm-txtm:  #6f8093;
  --sm-warn:  #f5b942;
  --sm-mono:  'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}
html[data-theme="light"] {
  --sm-surf:  rgba(0,0,0,0.025);
  --sm-surfr: rgba(0,0,0,0.05);
  --sm-bdr:   rgba(0,0,0,0.10);
  --sm-hair:  rgba(0,0,0,0.06);
  --sm-bg:    #f3f5f8;
  --sm-acc:   #1668c9;
  --sm-accd:  #9dc4ea;
  --sm-accm:  #e8f1fb;
  --sm-txt:   #16202a;
  --sm-txtd:  #46586a;
  --sm-txtm:  #5f7386;
  --sm-warn:  #8a6100;
}
/* PHNTM:spectre palette end */

/* PHNTM:model chips, MK.VI ──────────────────────────────────────────────────
   The six model chips were bright hues used as INK on a transparent pill:
   .model-chip.local was #a3e635 lime, which measures 1.41:1 on the light page.
   A colour that saturated is a FILL, not an ink - the same category error as
   the company tags in DISPATCH. Each chip is now a tinted fill with an ink
   chosen for readability, per theme. Light inks measured on #f5f7fa. */
:root {
  --chip-local-ink:  #a3e635;  --chip-local-fill:  rgba(163, 230,  53, 0.14);
  --chip-opus-ink:   #f59e0b;  --chip-opus-fill:   rgba(245, 158,  11, 0.14);
  --chip-sonnet-ink: #4ade80;  --chip-sonnet-fill: rgba( 74, 222, 128, 0.14);
  --chip-cyan-ink:   #56d6e8;  --chip-cyan-fill:   rgba( 86, 214, 232, 0.14);
  --chip-gemini-ink: #7a9cff;  --chip-gemini-fill: rgba(122, 156, 255, 0.14);
}
html[data-theme="light"] {
  --chip-local-ink:  #3f6212;  --chip-local-fill:  rgba( 63,  98,  18, 0.10);  /* 6.70:1 */
  --chip-opus-ink:   #92400e;  --chip-opus-fill:   rgba(146,  64,  14, 0.10);  /* 6.62:1 */
  --chip-sonnet-ink: #166534;  --chip-sonnet-fill: rgba( 22, 101,  52, 0.10);  /* 6.79:1 */
  --chip-cyan-ink:   #0e7490;  --chip-cyan-fill:   rgba( 14, 116, 144, 0.10);  /* 5.05:1 */
  --chip-gemini-ink: #4338ca;  --chip-gemini-fill: rgba( 67,  56, 202, 0.10);  /* 7.40:1 */
}
/* PHNTM:model chips end */

/* PHNTM:dispatch card, DIS-03 ─────────────────────────────────────────────
   Priority stops being a bordered red word competing with the task and
   becomes heat around the whole card: a 1px ring plus a wide, low-opacity
   bloom. Normal priority gets nothing, because if everything is marked then
   nothing is. */
:root {
  --pri-glow: rgba(248, 113, 113, 0.55);
  --overdue-glow: rgba(255, 107, 53, 0.55);
  --ai-done-ink:  #4ade80;
  --ai-done-fill: rgba(74, 222, 128, 0.12);
}
html[data-theme="light"] {
  --pri-glow: rgba(179, 38, 30, 0.34);
  --overdue-glow: rgba(194, 65, 12, 0.34);
  /* MK.VI. --amber had three values and --red three, none with a light
     counterpart, so 59 "assign owner" labels measured 3.73:1 and every count
     badge 2.06:1 on the light page. The light block outranks the per-file
     :root declarations, so these govern in light without touching dark. */
  --amber: #8a6100;
  --red: #b3261e;
  --danger: #b3261e;
  --overdue-pulse: #c2410c;
  --ai-done-ink:  #166534;
  --ai-done-fill: rgba(22, 101, 52, 0.10);
}
/* PHNTM:dispatch card end */

/* PHNTM:company-colours generated from companies.color, do not hand edit */
:root{
  --co-ashling-partners: #1c5c3a;
  --co-boeing: #0039a6;
  --co-citizens: #00965e;
  --co-cvs: #7a1828;
  --co-mayo-clinic: #4d2e75;
  --co-personal: #d4a574;
  --co-robotica-pro: #1e3a8a;

}
/* PHNTM:company-colours end */

/* ═══════════════════════════════════════════════════════════════════════════
   X57 LIGHT MATERIAL
   The ladder above is dark-only. Without these, light mode flips --bg,
   --surface and --text and leaves every Material role behind: the nav bar
   stays navy and the page-head lockup, painted with --on-surface, drops to
   about 1.3:1 and reads as a ghost.

   Tonal steps mirror the dark ladder so relationships built on these roles
   survive the theme change. Measured, on the light surface:
     on-surface         15.0:1 on the nav bar   (dark: 12.3:1)
     on-surface-variant  8.2:1 on the nav bar   (dark:  6.9:1)
     outline             4.8:1 vs surface       (dark:  6.0:1)
     outline-variant     3.2:1 vs surface       (dark:  3.2:1, and this file
                         requires 3:1 for dividers, so it was tuned to hit it
                         rather than left at the 1.90:1 an obvious grey gives)

   CORRECTED MK.VI 2026-09-01: this file previously said --surface was omitted
   because theme.css set it to #ffffff in light. It does not, and never did.
   Measured in light mode, --surface resolved to #0e1116, so .appbar (which
   asks for var(--surface)) painted a black bar across the top of every light
   page. Fourth defect traced to this token. It is declared here now.
   #fafbfc sits one step above --surface-lowest #ffffff, mirroring the dark
   ladder where --surface sits one step above --surface-lowest.
   --azul and its family are absent on purpose: --azul is the primary button
   FILL with --on-accent as its text, so darkening it for light mode is a
   coupled decision, not a token swap.
   ARKHM | MK.V.139
   ═══════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
  --surface-lowest:    #ffffff;
  --surface-low:       #f3f5f8;
  --surface-container: #edf0f4;
  --surface-high:      #e6eaf0;
  --surface-highest:   #d1d9e4;
  --on-surface:         #161b21;
  --on-surface-variant: #414952;
  --outline:         #6d747d;
  --outline-variant: #8a9099;
  --overlay-wash:  rgba(0, 0, 0, 0.035);
  --overlay-wash2: rgba(0, 0, 0, 0.06);
  /* MK.VI text-muted, light. 6.2:1 on #ffffff. Without this, light mode
     inherited the dark grey and muted text sat near 1.8:1. */
  --text-muted: #56636e;
  /* MK.VI. --text-dim had no light counterpart, so light mode inherited the
     dark #8098b0 and rendered secondary text at 2.98:1. 5.4:1 on white. */
  --text-dim: #5c6b78;
  /* ── SCRIBE, light. Only the roles that must answer for light appear here;
     --scribe (fill), --scribe-dim, --scribe-glow, --scribe-tint and
     --scribe-rule are translucent or a fixed sage and read on both grounds. */
  --scribe-ink:   #3f6087;
  --cad-white-ink: #14171a;
  --scribe-bar:   rgba(250, 251, 252, 0.82);
  --scribe-glass: rgba(250, 251, 252, 0.94);
  --scribe-rule:  rgba(60, 90, 120, 0.14);
  --surface: #fafbfc;
  --statusbar-bg: rgba(255, 255, 255, 0.78);
  --tile-hover-wash: rgba(255, 255, 255, 0.88);
  --tile-hover-shadow: 0 10px 28px rgba(16, 24, 32, 0.13), 0 0 0 1px rgba(var(--accent-rgb), 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.90);
}