/* GENERATED by scripts/gen-app-tokens.mjs from the design system (kulip-io/kulip#612). Do not edit this file:
   edit design/pages/src/palette.py for design system tokens, or design/system/app-tokens.json for the old names. */

/* Faces bundled in design/fonts. */
@font-face { font-family: "Inter"; font-weight: 100 900; font-style: normal; font-display: swap; src: url("fonts/inter/InterVariable.ttf") format("truetype"); }
@font-face { font-family: "Inter"; font-weight: 100 900; font-style: italic; font-display: swap; src: url("fonts/inter/InterVariable-Italic.ttf") format("truetype"); }
@font-face { font-family: "Geist Mono"; font-weight: 100 900; font-style: normal; font-display: swap; src: url("fonts/geist-mono/GeistMono-Variable.ttf") format("truetype"); }
@font-face { font-family: "Geist"; font-weight: 100 900; font-style: normal; font-display: swap; src: url("fonts/geist/Geist-Variable.ttf") format("truetype"); }

/* Kulip design tokens (kulip-io/kulip#612; colour code #620). Written by design/pages/src/palette.py: edit that, not this.
   All sizes are SCREEN px. Where the app applies --ui-zoom (1.21 on .app-shell), the CSS value is the screen value / 1.21.
   Light is the default. Dark applies with [data-theme="dark"], or with the system setting unless [data-theme="light"]. */
:root {
  --navy: #020F46;
  --navy-hover: #14225E;
  --azure: #2E95FE;
  --violet: #7D62FB;
  --sky: #56CCFE;
  --lilac: #B976FB;
  --soft-light: #F4F6FB;
  --grad: linear-gradient(90deg, #56CCFE 0%, #2E95FE 32%, #7D62FB 67%, #B976FB 100%);
  --grad-action: linear-gradient(90deg, #0074DA 0%, #765AF2 100%);
  --grad-text: linear-gradient(90deg, #0074DA 0%, #765AF2 100%);
  --on-navy: #FFFFFF;
  --on-action: #FFFFFF;
  --on-mark: #FFFFFF;
  --ground: #F4F6FB;
  --surface: #FFFFFF;
  --raised: #FFFFFF;
  --chat-paper: #FFFFFF;
  --chat-ink: #000000;
  --chat-muted: #626C85;
  --provenance-paper: #FFFCF5;
  --head-provenance: #DBF5F5;
  --kink-provenance: #1F544C;
  --ink: #020F46;
  --ink-2: #4A5270;
  --ink-3: #626C85;
  --ink-4: #9AA0B4;
  --line: #E1E2E9;
  --line-2: #CDD0DC;
  --hover: #EEF0F6;
  --press: #E4E7F1;
  --scrim: rgba(2,15,70,.35);
  --tip: #26272B;
  --tip-ink: #F2F3F5;
  --ok: #166534;
  --ok-bg: #EAF6EE;
  --ok-line: #BCD5C2;
  --ok-dot: #1F9D57;
  --ask: #9A3412;
  --ask-bg: #FFF4E6;
  --ask-line: #ECC9B7;
  --err: #AB4A60;
  --err-bg: #FCEEF1;
  --err-line: #EDC9CF;
  --info: #0069CE;
  --info-bg: #EEF4FF;
  --focus: #2E95FE;
  --destroy-recoverable: #B45309;
  --destroy-permanent: #B91C1C;
  --live: #E5484D;
  --avatar-1: #5B3FD6;
  --avatar-2: #0074DA;
  --avatar-3: #167D74;
  --avatar-bot: linear-gradient(90deg, #0074DA 0%, #765AF2 100%);
  --project-indigo: #8B93C9;
  --project-green: #5FB3A1;
  --project-orange: #E3985A;
  --project-rose: #E07A95;
  --project-sky: #6FB4E0;
  --project-plum: #7A5AA6;
  --project-teal: #3F9AA3;
  --project-gold: #D4B13A;
  --project-coral: #E5654A;
  --project-moss: #7F9A4B;
  --project-slate: #6B7A90;
  --project-cobalt: #3D63C9;
  --project-clay: #B4673D;
  --project-lilac: #C5A3E6;
  --project-mint: #7FD6B0;
  --project-berry: #9C2F66;
  --ground-butter: #FDE68A;
  --ground-peach: #FDBA74;
  --ground-sage: #BBF7D0;
  --ground-sky: #BAE6FD;
  --ground-blush: #FECDD3;
  --ground-lilac: #E9D5FF;
  --ground-mint: #A7F3D0;
  --ground-sand: #F5E6C8;
  --ground-ice: #CFFAFE;
  --ground-lemon: #FEF08A;
  --ground-apricot: #FED7AA;
  --ground-lavender: #DDD6FE;
  --ground-seafoam: #99F6E4;
  --ground-rosewater: #FBCFE8;
  --ground-pistachio: #D9F99D;
  --ground-powder: #DBEAFE;
  --head-help: #FFE6D5;
  --line-help: #D4772B;
  --ink-help: #753000;
  --head-inbox: #FFF0DE;
  --line-inbox: #E0A454;
  --ink-inbox: #79371C;
  --head-mail: #FFEBCE;
  --line-mail: #DCA651;
  --ink-mail: #783915;
  --head-draft: #FEE6BC;
  --line-draft: #D7A94F;
  --ink-draft: #763A0D;
  --head-clips: #FFF1D2;
  --line-clips: #D2AC4E;
  --ink-clips: #753C03;
  --head-notes: #FCEDC1;
  --line-notes: #CCAE4E;
  --ink-notes: #713F00;
  --head-ads: #D9FBF8;
  --line-ads: #00A8A2;
  --ink-ads: #00635F;
  --head-narrative: #D4F6F4;
  --line-narrative: #00A7A5;
  --ink-narrative: #006261;
  --head-intelligence: #CFF1F1;
  --line-intelligence: #00A7A9;
  --ink-intelligence: #006263;
  --head-xlive: #D8FAFB;
  --line-xlive: #00A6AC;
  --ink-xlive: #006265;
  --head-swot: #D4F5F8;
  --line-swot: #00A6AF;
  --ink-swot: #006167;
  --head-workspace: #CFF1F4;
  --line-workspace: #00A5B3;
  --ink-workspace: #006169;
  --head-code: #D9FAFF;
  --line-code: #00A5B6;
  --ink-code: #00616C;
  --head-jobs: #D4F5FB;
  --line-jobs: #00A4BA;
  --ink-jobs: #00606E;
  --head-deliverables: #D0F0F8;
  --line-deliverables: #00A4BD;
  --ink-deliverables: #006070;
  --head-partners: #DEF8FF;
  --line-partners: #00A3C1;
  --ink-partners: #006072;
  --head-geo: #D5F4FE;
  --line-geo: #01A2C5;
  --ink-geo: #005F75;
  --head-lines: #D1EFFB;
  --line-lines: #12A1C7;
  --ink-lines: #005F77;
  --head-doors: #E2F6FF;
  --line-doors: #1EA0CA;
  --ink-doors: #005E7A;
  --head-view: #E7F4FF;
  --line-view: #039BE8;
  --ink-view: #005B8B;
  --head-dashboard: #E0F0FF;
  --line-dashboard: #2099EA;
  --ink-dashboard: #00598F;
  --head-reporting: #D8ECFF;
  --line-reporting: #3097EC;
  --ink-reporting: #005894;
  --head-decisions: #EAF4FF;
  --line-decisions: #3C96ED;
  --ink-decisions: #02569A;
  --head-library: #E3EFFF;
  --line-library: #4694EF;
  --ink-library: #13559B;
  --head-sheet: #DCEBFF;
  --line-sheet: #4E92F0;
  --ink-sheet: #1E549C;
  --head-image: #ECF3FF;
  --line-image: #5690F0;
  --ink-image: #26529C;
  --head-assets: #E5EEFF;
  --line-assets: #5E8EF1;
  --ink-assets: #2D519C;
  --head-browser: #DFE9FF;
  --line-browser: #658DF1;
  --ink-browser: #334F9D;
  --head-shelf: #EDF2FF;
  --line-shelf: #6B8BF1;
  --ink-shelf: #384E9D;
  --head-knowledge: #E8EDFF;
  --line-knowledge: #7289F1;
  --ink-knowledge: #3D4D9C;
  --head-bots: #E0E7FF;
  --line-bots: #7D62FB;
  --ink-bots: #5B3FD6;
  --head-chat: #EEEBFF;
  --line-chat: #9778F5;
  --ink-chat: #5A3FA0;
  --head-blocks: #EFE3FF;
  --line-blocks: #AB71EA;
  --ink-blocks: #683997;
  --head-settings: #EFF3F8;
  --line-settings: #8493A9;
  --ink-settings: #434E5E;
  --head-admin: #EAEEF3;
  --line-admin: #8493A9;
  --ink-admin: #434E5E;
  --head-terminal: #E6E9EF;
  --line-terminal: #8493A9;
  --ink-terminal: #434E5E;
  --head-usage: #EFF3F8;
  --line-usage: #8493A9;
  --ink-usage: #434E5E;
  --head-promote: #EAEEF3;
  --line-promote: #8493A9;
  --ink-promote: #434E5E;
  --voice-edith-bg: linear-gradient(90deg, #E6F7FF 0%, #E3EEFF 35%, #ECE7FF 70%, #F4EAFF 100%);
  --voice-edith-line: #D3CCF7;
  --voice-edith-mark: linear-gradient(90deg, #0074DA 0%, #765AF2 100%);
  --voice-edith-mark-ink: #FFFFFF;
  --voice-advice-bg: linear-gradient(90deg, #FFF3D6 0%, #FFE6DA 50%, #FFE1EC 100%);
  --voice-advice-line: #F2D2C4;
  --voice-advice-mark: linear-gradient(135deg, #FCD34D, #FDA4AF);
  --voice-advice-mark-ink: #020F46;
  --voice-offer-bg: #E7F8F1;
  --voice-offer-line: #BFE6D5;
  --voice-offer-mark: #0F9F6E;
  --voice-offer-mark-ink: #FFFFFF;
  --voice-ask-bg: #FFF4E6;
  --voice-ask-line: #ECC9B7;
  --voice-ask-mark: #EA580C;
  --voice-ask-mark-ink: #FFFFFF;
  --voice-system-bg: #FFFFFF;
  --voice-system-line: #CDD0DC;
  --voice-system-mark: #EEF0F6;
  --voice-system-mark-ink: #4A5270;
  --voice-tip-bg: #F7F8FB;
  --voice-tip-line: #E1E2E9;
  --voice-tip-mark: transparent;
  --voice-tip-mark-ink: #626C85;
  --voice-text: var(--ink);
  --voice-src: var(--ink-2);
  --emoji-azure: #4DA3FF;
  --emoji-azure-deep: #0B5AB5;
  --emoji-slate: #A3AFC2;
  --emoji-slate-deep: #3E4A5E;
  --emoji-violet: #9580FF;
  --emoji-violet-deep: #4A30C0;
  --emoji-lilac: #C99AFF;
  --emoji-lilac-deep: #7B3AC4;
  --emoji-amber: #F7BE45;
  --emoji-amber-deep: #8A4B06;
  --emoji-ok: var(--ok-dot);
  --emoji-ok-deep: var(--ok);
  --emoji-ask: #F26B1D;
  --emoji-ask-deep: var(--ask);
  --emoji-glass: #FFFFFF;
  --font-display: "Geist", "Inter", system-ui, sans-serif;
  --font-sans: "Geist", "Inter", system-ui, sans-serif;
  --font-mono: "Geist Mono", "SF Mono", monospace;
  --font-desk: "Fraunces", Georgia, serif;
  --fs-label: 11px;
  --fs-meta: 12px;
  --fs-ui-sm: 13px;
  --fs-ui: 14px;
  --fs-prompt: 15px;
  --fs-lg: 14px;
  --fs-panel-title: 12px;
  --fs-section: 19px;
  --fs-dialog: 18px;
  --fs-page: 30px;
  --lh-control: 1.15;
  --lh-text: 1.45;
  --lh-notice: 1.15;
  --lh-message: 1.4;
  --lh-body: 1.5;
  --ls-caps: .07em;
  --head-fade-stop: 35%;
  --h-sm: 26px;
  --h: 30px;
  --h-lg: 38px;
  --h-field: 32px;
  --h-row: 28px;
  --h-cmd: 30px;
  --h-chip: 24px;
  --h-send: 30px;
  --h-badge: 20px;
  --h-panel-head: 30px;
  --pad-btn-sm: 9px;
  --pad-btn: 12px;
  --pad-btn-lg: 16px;
  --pad-field: 10px;
  --pad-chip: 9px;
  --pad-seg: 2px;
  --pad-tab: 6px 0 8px;
  --pad-panel-head: 0 6px 0 12px;
  --pad-li: 8px 12px;
  --pad-cell: 8px 12px;
  --r-btn-sm: 7px;
  --r-btn: 9px;
  --r-btn-lg: 10px;
  --r-field: 9px;
  --r-chat: 18px;
  --r-card: 12px;
  --r-panel: 12px;
  --r-pop: 14px;
  --r-dialog: 16px;
  --r-pill: 999px;
  --pad-1: 4px;
  --pad-2: 6px;
  --pad-3: 8px;
  --pad-4: 10px;
  --pad-5: 12px;
  --pad-6: 16px;
  --pad-7: 24px;
  --pad-8: 32px;
  --shadow: 0 1px 2px rgba(2,15,70,.035), 0 1px 5px rgba(2,15,70,.03);
  --shadow-pop: 0 1px 3px rgba(2,15,70,.05), 0 6px 18px rgba(2,15,70,.065);
  --dur-fast: 120ms;
  --dur-base: 160ms;
  --dur-arrive: 180ms;
  --dur-panel: 220ms;
  --dur-slow: 300ms;
  --ease: cubic-bezier(.4, 0, .2, 1);
  --focus-ring: 2px solid var(--focus);
  --focus-offset: 2px;
}
:root[data-density="comfortable"] {
  --h-sm: 30px;
  --h: 36px;
  --h-lg: 44px;
  --h-field: 38px;
  --h-row: 32px;
  --h-cmd: 36px;
  --h-chip: 28px;
  --h-send: 34px;
  --h-badge: 22px;
  --h-panel-head: 34px;
  --pad-btn-sm: 10px;
  --pad-btn: 14px;
  --pad-btn-lg: 18px;
  --pad-field: 12px;
  --pad-chip: 10px;
  --pad-seg: 3px;
  --pad-tab: 8px 0 10px;
  --pad-panel-head: 0 8px 0 14px;
  --pad-li: 10px 14px;
  --pad-cell: 10px 12px;
  --r-btn-sm: 8px;
  --r-btn: 10px;
  --r-btn-lg: 12px;
  --r-field: 10px;
  --fs-lg: 15px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --navy: #2E95FE;
    --navy-hover: #4AA6FF;
    --on-navy: #020F46;
    --on-mark: #020F46;
    --grad-text: linear-gradient(90deg, #56CCFE 0%, #B976FB 100%);
    --ground: #020F46;
    --surface: #0B1A57;
    --raised: #122264;
    --chat-paper: #FFFFFF;
    --chat-ink: #000000;
    --chat-muted: #626C85;
    --provenance-paper: #132462;
    --head-provenance: #0A3A40;
    --kink-provenance: #BFEFEC;
    --ink: #FFFFFF;
    --ink-2: #C0C3D1;
    --ink-3: #9CA3C0;
    --ink-4: #6E77A0;
    --line: #2A3564;
    --line-2: #3A4677;
    --hover: #16266A;
    --press: #1D2E78;
    --scrim: rgba(0,0,0,.55);
    --tip: #F2F3F5;
    --tip-ink: #26272B;
    --ok: #5FD08A;
    --ok-bg: #0F3324;
    --ok-line: #296645;
    --ok-dot: #34C77B;
    --ask: #FFD3A8;
    --ask-bg: #3A2412;
    --ask-line: #795C42;
    --err: #F08AA1;
    --err-bg: #3A1422;
    --err-line: #753A4B;
    --info: #8CC4FF;
    --info-bg: #15286E;
    --destroy-recoverable: #FB923C;
    --destroy-permanent: #F87171;
    --live: #FF6B70;
    --head-help: #4C230D;
    --ink-help: #FFB891;
    --head-inbox: #4D2311;
    --ink-inbox: #E8DA82;
    --head-mail: #4C230D;
    --ink-mail: #E8DA82;
    --head-draft: #4B2409;
    --ink-draft: #E8DA82;
    --head-clips: #4A2604;
    --ink-clips: #E8DA82;
    --head-notes: #492701;
    --ink-notes: #E8DA82;
    --head-ads: #003B38;
    --ink-ads: #9BE0DB;
    --head-narrative: #003B3A;
    --ink-narrative: #9AE0DD;
    --head-intelligence: #003B3C;
    --ink-intelligence: #9AE0E0;
    --head-xlive: #003A3E;
    --ink-xlive: #99E0E2;
    --head-swot: #003A3F;
    --ink-swot: #99DFE5;
    --head-workspace: #003A41;
    --ink-workspace: #9ADFE7;
    --head-code: #003942;
    --ink-code: #9ADEE9;
    --head-jobs: #003944;
    --ink-jobs: #9ADEEB;
    --head-deliverables: #003945;
    --ink-deliverables: #9BDEED;
    --head-partners: #003847;
    --ink-partners: #9CDDEF;
    --head-geo: #003849;
    --ink-geo: #9DDCF1;
    --head-lines: #00374A;
    --ink-lines: #9EDCF3;
    --head-doors: #00374B;
    --ink-doors: #A0DBF4;
    --head-view: #043450;
    --ink-view: #A5D8FF;
    --head-dashboard: #083351;
    --ink-dashboard: #A9D7FF;
    --head-reporting: #0D3252;
    --ink-reporting: #ACD6FF;
    --head-decisions: #113252;
    --ink-decisions: #AFD5FF;
    --head-library: #143153;
    --ink-library: #B2D4FF;
    --head-sheet: #173053;
    --ink-sheet: #B4D3FF;
    --head-image: #1A3053;
    --ink-image: #B7D2FF;
    --head-assets: #1D2F53;
    --ink-assets: #BAD2FF;
    --head-browser: #1F2E54;
    --ink-browser: #BCD1FF;
    --head-shelf: #222E54;
    --ink-shelf: #BED0FF;
    --head-knowledge: #242D53;
    --ink-knowledge: #C1CFFF;
    --head-bots: #2E2A52;
    --ink-bots: #B7A6FF;
    --head-chat: #322950;
    --ink-chat: #D1C9FF;
    --head-blocks: #38264D;
    --ink-blocks: #DDC4FF;
    --head-settings: #243143;
    --ink-settings: #C8D2DF;
    --head-admin: #243143;
    --ink-admin: #C8D2DF;
    --head-terminal: #243143;
    --ink-terminal: #C8D2DF;
    --head-usage: #243143;
    --ink-usage: #C8D2DF;
    --head-promote: #243143;
    --ink-promote: #C8D2DF;
    --voice-edith-bg: linear-gradient(90deg, #00364E 0%, #103155 35%, #2E2954 70%, #39254E 100%);
    --voice-edith-line: #4B4A86;
    --voice-edith-mark: linear-gradient(90deg, #0074DA 0%, #765AF2 100%);
    --voice-edith-mark-ink: #FFFFFF;
    --voice-advice-bg: linear-gradient(90deg, #482800 0%, #4F1E25 50%, #501E23 100%);
    --voice-advice-line: #6E4A3A;
    --voice-advice-mark: linear-gradient(135deg, #FCD34D, #FDA4AF);
    --voice-advice-mark-ink: #020F46;
    --voice-offer-bg: #003C25;
    --voice-offer-line: #1F5E47;
    --voice-offer-mark: #34D399;
    --voice-offer-mark-ink: #020F46;
    --voice-ask-bg: #3A2412;
    --voice-ask-line: #795C42;
    --voice-ask-mark: #FFD3A8;
    --voice-ask-mark-ink: #020F46;
    --voice-system-bg: #122264;
    --voice-system-line: #3A4677;
    --voice-system-mark: #16266A;
    --voice-system-mark-ink: #C0C3D1;
    --voice-tip-bg: #10215C;
    --voice-tip-line: #2A3564;
    --voice-tip-mark: transparent;
    --voice-tip-mark-ink: #9CA3C0;
    --emoji-azure: #6DB5FF;
    --emoji-azure-deep: #0B4F9E;
    --emoji-slate: #AEB9CB;
    --emoji-slate-deep: #2F3A4D;
    --emoji-violet: #A897FF;
    --emoji-violet-deep: #3F28A8;
    --emoji-lilac: #D3AEFF;
    --emoji-lilac-deep: #6E30B5;
    --emoji-amber: #F8C75C;
    --emoji-amber-deep: #7A4105;
    --emoji-ask: #FF9A55;
    --emoji-ask-deep: #7C2D12;
    --shadow: 0 1px 2px rgba(0,0,0,.22), 0 2px 7px rgba(0,0,0,.15);
    --shadow-pop: 0 1px 4px rgba(0,0,0,.28), 0 8px 22px rgba(0,0,0,.28);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --navy: #2E95FE;
  --navy-hover: #4AA6FF;
  --on-navy: #020F46;
  --on-mark: #020F46;
  --grad-text: linear-gradient(90deg, #56CCFE 0%, #B976FB 100%);
  --ground: #020F46;
  --surface: #0B1A57;
  --raised: #122264;
  --chat-paper: #FFFFFF;
  --chat-ink: #000000;
  --chat-muted: #626C85;
  --provenance-paper: #132462;
  --head-provenance: #0A3A40;
  --kink-provenance: #BFEFEC;
  --ink: #FFFFFF;
  --ink-2: #C0C3D1;
  --ink-3: #9CA3C0;
  --ink-4: #6E77A0;
  --line: #2A3564;
  --line-2: #3A4677;
  --hover: #16266A;
  --press: #1D2E78;
  --scrim: rgba(0,0,0,.55);
  --tip: #F2F3F5;
  --tip-ink: #26272B;
  --ok: #5FD08A;
  --ok-bg: #0F3324;
  --ok-line: #296645;
  --ok-dot: #34C77B;
  --ask: #FFD3A8;
  --ask-bg: #3A2412;
  --ask-line: #795C42;
  --err: #F08AA1;
  --err-bg: #3A1422;
  --err-line: #753A4B;
  --info: #8CC4FF;
  --info-bg: #15286E;
  --destroy-recoverable: #FB923C;
  --destroy-permanent: #F87171;
  --live: #FF6B70;
  --head-help: #4C230D;
  --ink-help: #FFB891;
  --head-inbox: #4D2311;
  --ink-inbox: #E8DA82;
  --head-mail: #4C230D;
  --ink-mail: #E8DA82;
  --head-draft: #4B2409;
  --ink-draft: #E8DA82;
  --head-clips: #4A2604;
  --ink-clips: #E8DA82;
  --head-notes: #492701;
  --ink-notes: #E8DA82;
  --head-ads: #003B38;
  --ink-ads: #9BE0DB;
  --head-narrative: #003B3A;
  --ink-narrative: #9AE0DD;
  --head-intelligence: #003B3C;
  --ink-intelligence: #9AE0E0;
  --head-xlive: #003A3E;
  --ink-xlive: #99E0E2;
  --head-swot: #003A3F;
  --ink-swot: #99DFE5;
  --head-workspace: #003A41;
  --ink-workspace: #9ADFE7;
  --head-code: #003942;
  --ink-code: #9ADEE9;
  --head-jobs: #003944;
  --ink-jobs: #9ADEEB;
  --head-deliverables: #003945;
  --ink-deliverables: #9BDEED;
  --head-partners: #003847;
  --ink-partners: #9CDDEF;
  --head-geo: #003849;
  --ink-geo: #9DDCF1;
  --head-lines: #00374A;
  --ink-lines: #9EDCF3;
  --head-doors: #00374B;
  --ink-doors: #A0DBF4;
  --head-view: #043450;
  --ink-view: #A5D8FF;
  --head-dashboard: #083351;
  --ink-dashboard: #A9D7FF;
  --head-reporting: #0D3252;
  --ink-reporting: #ACD6FF;
  --head-decisions: #113252;
  --ink-decisions: #AFD5FF;
  --head-library: #143153;
  --ink-library: #B2D4FF;
  --head-sheet: #173053;
  --ink-sheet: #B4D3FF;
  --head-image: #1A3053;
  --ink-image: #B7D2FF;
  --head-assets: #1D2F53;
  --ink-assets: #BAD2FF;
  --head-browser: #1F2E54;
  --ink-browser: #BCD1FF;
  --head-shelf: #222E54;
  --ink-shelf: #BED0FF;
  --head-knowledge: #242D53;
  --ink-knowledge: #C1CFFF;
  --head-bots: #2E2A52;
  --ink-bots: #B7A6FF;
  --head-chat: #322950;
  --ink-chat: #D1C9FF;
  --head-blocks: #38264D;
  --ink-blocks: #DDC4FF;
  --head-settings: #243143;
  --ink-settings: #C8D2DF;
  --head-admin: #243143;
  --ink-admin: #C8D2DF;
  --head-terminal: #243143;
  --ink-terminal: #C8D2DF;
  --head-usage: #243143;
  --ink-usage: #C8D2DF;
  --head-promote: #243143;
  --ink-promote: #C8D2DF;
  --voice-edith-bg: linear-gradient(90deg, #00364E 0%, #103155 35%, #2E2954 70%, #39254E 100%);
  --voice-edith-line: #4B4A86;
  --voice-edith-mark: linear-gradient(90deg, #0074DA 0%, #765AF2 100%);
  --voice-edith-mark-ink: #FFFFFF;
  --voice-advice-bg: linear-gradient(90deg, #482800 0%, #4F1E25 50%, #501E23 100%);
  --voice-advice-line: #6E4A3A;
  --voice-advice-mark: linear-gradient(135deg, #FCD34D, #FDA4AF);
  --voice-advice-mark-ink: #020F46;
  --voice-offer-bg: #003C25;
  --voice-offer-line: #1F5E47;
  --voice-offer-mark: #34D399;
  --voice-offer-mark-ink: #020F46;
  --voice-ask-bg: #3A2412;
  --voice-ask-line: #795C42;
  --voice-ask-mark: #FFD3A8;
  --voice-ask-mark-ink: #020F46;
  --voice-system-bg: #122264;
  --voice-system-line: #3A4677;
  --voice-system-mark: #16266A;
  --voice-system-mark-ink: #C0C3D1;
  --voice-tip-bg: #10215C;
  --voice-tip-line: #2A3564;
  --voice-tip-mark: transparent;
  --voice-tip-mark-ink: #9CA3C0;
  --emoji-azure: #6DB5FF;
  --emoji-azure-deep: #0B4F9E;
  --emoji-slate: #AEB9CB;
  --emoji-slate-deep: #2F3A4D;
  --emoji-violet: #A897FF;
  --emoji-violet-deep: #3F28A8;
  --emoji-lilac: #D3AEFF;
  --emoji-lilac-deep: #6E30B5;
  --emoji-amber: #F8C75C;
  --emoji-amber-deep: #7A4105;
  --emoji-ask: #FF9A55;
  --emoji-ask-deep: #7C2D12;
  --shadow: 0 1px 2px rgba(0,0,0,.22), 0 2px 7px rgba(0,0,0,.15);
  --shadow-pop: 0 1px 4px rgba(0,0,0,.28), 0 8px 22px rgba(0,0,0,.28);
}

/* Names the app used before the design system (design/system/app-tokens.json). Aliases follow the design system,
   light and dark; legacy names keep their 16 Sep value until the restyle retires them. */
:root {
  --border: var(--line);
  --border-strong: var(--line-2);
  --text-primary: var(--ink);
  --text-secondary: var(--ink-2);
  --text-tertiary: var(--ink-3);
  --bg-surface: var(--surface);
  --bg-page: var(--ground);
  --bg-subtle: var(--hover);
  --bg-wash: var(--hover);
  --accent: var(--navy);
  --accent-bg: var(--info-bg);
  --radius-pill: var(--r-pill);
  --radius-sm: var(--r-btn-sm);
  --radius-md: var(--r-btn);
  --radius-lg: var(--r-card);
  --success: var(--ok);
  --shadow-sm: var(--shadow);
  --ground-frame: #ececee;
  --accent-hover: #4f5bbf;
  --warning: #f59e0b;
  --danger: #dc2626;
  --wm-speccing: #f59e0b;
  --wm-approved: #0284c7;
  --wm-implementing: #5e6ad2;
  --wm-verifying: #0d9488;
  --wm-shipped: #16a34a;
  --wm-blocked: #dc2626;
  --pad-hair: 2px;
  --pad-dot: 3px;
  --title-h: 64px;
  --ui-zoom: 1.21;
  --panel-row-zoom: 1;
  --row-pad-top: 40px;
  --shadow-md: 0 8px 24px rgba(15, 23, 42, 0.12);
  --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.14);
  --radius-xs: 4px;
  --radius-xl: 12px;
  --radius-bubble: 14px;
  --panel-pill-w: 24px;
  --panel-header-h: 28px;
  --panel-gap: 8px;
  --panel-min-bots: 200px;
  --panel-min-chat: 420px;
  --panel-min-mail: 320px;
  --panel-min-notes: 240px;
  --panel-min-view: 300px;
  --panel-min-stage: var(--panel-min-view);
  --panel-min-terminal: 320px;
  --panel-min-code: 380px;
  --icon-rail-w: 52px;
  --spot-field-h: 34px;
  --menu-w: 220px;
  --sticky-w: 272px;
  --sticky-h: 188px;
  --ctl-h-sm: 20px;
  --ctl-h: 22px;
  --ctl-h-md: 24px;
  --ctl-h-lg: 26px;
  --icon: 14px;
  --icon-sm: 11px;
  --head-stage: var(--head-view);
  --head-fade: #ffffff;
  --head-text: var(--text-primary);
  --pill-fade-stop: 30%;
  --pill-bots: var(--head-bots);
  --pill-chat: var(--head-chat);
  --pill-mail: var(--head-mail);
  --pill-notes: var(--head-notes);
  --pill-view: var(--head-view);
  --pill-stage: var(--pill-view);
  --pill-terminal: var(--head-terminal);
  --pill-code: var(--head-code);
  --pill-ink: var(--text-secondary);
  --project-lumiere: #5e6ad2;
  --project-norvant: #16a34a;
  --project-okapi: #d97706;
  --project-colour: var(--project-lumiere);
  --ground-alpha-1: 10%;
  --ground-alpha-2: 7%;
  --ground-alpha-3: 5%;
  --ground-blur-r: 46%;
  --note-pastel-butter: #fef3c7;
  --note-pastel-gold: #fde68a;
  --note-pastel-peach: #ffedd5;
  --note-pastel-lemon: #fef9c3;
  --notes-ground: var(--note-pastel-butter);
  --note-draft: var(--text-tertiary);
  --note-ready: var(--wm-approved);
  --note-read: var(--success);
  --note-tasked: var(--wm-implementing);
  --note-conflict: var(--danger);
  --font-badge: "Archivo Black", "Inter", sans-serif;
  --fs-micro: 9px;
  --fs-cost: 9.5px;
  --fs-small: 11px;
  --fs-body: 12px;
  --fs-body-lg: 12.5px;
  --fs-name: 13px;
  --fs-title: 14px;
  --fs-display: 26px;
  --fs-code: 12px;
  --fs-badge: 12px;
  --lh-chat: 1.28;
  --lh-note: 1.5;
  --lh-code: 1.45;
  --shade: 0;
  --shade-fill: #000000;
  --dur-cascade-step: 22ms;
  --dur-rise: 250ms;
  --dur-pulse: 1600ms;
  --dur-blink: 1000ms;
  --dur-tint: 600ms;
}
[data-theme="dark"] {
  --ground-frame: #0f172a;
  --accent-hover: #7c86db;
  --warning: #f59e0b;
  --danger: #dc2626;
  --wm-speccing: #f59e0b;
  --wm-approved: #0284c7;
  --wm-implementing: #5e6ad2;
  --wm-verifying: #0d9488;
  --wm-shipped: #16a34a;
  --wm-blocked: #dc2626;
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
  --head-fade: #1b1d29;
  --head-text: var(--text-primary);
  --note-pastel-butter: #1e293b;
  --note-pastel-gold: #1e293b;
  --note-pastel-peach: #1e293b;
  --note-pastel-lemon: #1e293b;
}

/* Design system sizes inside the zoomed panel interiors: screen value / --ui-zoom, so they measure true on screen. */
.app-shell, .hb-zoomed {
  --fs-label: calc(11px / var(--ui-zoom));
  --fs-meta: calc(12px / var(--ui-zoom));
  --fs-ui-sm: calc(13px / var(--ui-zoom));
  --fs-ui: calc(14px / var(--ui-zoom));
  --fs-prompt: calc(15px / var(--ui-zoom));
  --fs-lg: calc(14px / var(--ui-zoom));
  --fs-panel-title: calc(12px / var(--ui-zoom));
  --fs-section: calc(19px / var(--ui-zoom));
  --fs-dialog: calc(18px / var(--ui-zoom));
  --fs-page: calc(30px / var(--ui-zoom));
  --h-sm: calc(26px / var(--ui-zoom));
  --h: calc(30px / var(--ui-zoom));
  --h-lg: calc(38px / var(--ui-zoom));
  --h-field: calc(32px / var(--ui-zoom));
  --h-row: calc(28px / var(--ui-zoom));
  --h-cmd: calc(30px / var(--ui-zoom));
  --h-chip: calc(24px / var(--ui-zoom));
  --h-send: calc(30px / var(--ui-zoom));
  --h-badge: calc(20px / var(--ui-zoom));
  --h-panel-head: calc(30px / var(--ui-zoom));
  --pad-btn-sm: calc(9px / var(--ui-zoom));
  --pad-btn: calc(12px / var(--ui-zoom));
  --pad-btn-lg: calc(16px / var(--ui-zoom));
  --pad-field: calc(10px / var(--ui-zoom));
  --pad-chip: calc(9px / var(--ui-zoom));
  --pad-seg: calc(2px / var(--ui-zoom));
  --pad-tab: calc(6px / var(--ui-zoom)) 0 calc(8px / var(--ui-zoom));
  --pad-panel-head: 0 calc(6px / var(--ui-zoom)) 0 calc(12px / var(--ui-zoom));
  --pad-li: calc(8px / var(--ui-zoom)) calc(12px / var(--ui-zoom));
  --pad-cell: calc(8px / var(--ui-zoom)) calc(12px / var(--ui-zoom));
  --r-btn-sm: calc(7px / var(--ui-zoom));
  --r-btn: calc(9px / var(--ui-zoom));
  --r-btn-lg: calc(10px / var(--ui-zoom));
  --r-field: calc(9px / var(--ui-zoom));
  --r-chat: calc(18px / var(--ui-zoom));
  --r-card: calc(12px / var(--ui-zoom));
  --r-panel: calc(12px / var(--ui-zoom));
  --r-pop: calc(14px / var(--ui-zoom));
  --r-dialog: calc(16px / var(--ui-zoom));
  --r-pill: calc(999px / var(--ui-zoom));
  --pad-1: calc(4px / var(--ui-zoom));
  --pad-2: calc(6px / var(--ui-zoom));
  --pad-3: calc(8px / var(--ui-zoom));
  --pad-4: calc(10px / var(--ui-zoom));
  --pad-5: calc(12px / var(--ui-zoom));
  --pad-6: calc(16px / var(--ui-zoom));
  --pad-7: calc(24px / var(--ui-zoom));
  --pad-8: calc(32px / var(--ui-zoom));
  --shadow: 0 calc(1px / var(--ui-zoom)) calc(2px / var(--ui-zoom)) rgba(2,15,70,.035), 0 calc(1px / var(--ui-zoom)) calc(5px / var(--ui-zoom)) rgba(2,15,70,.03);
  --shadow-pop: 0 calc(1px / var(--ui-zoom)) calc(3px / var(--ui-zoom)) rgba(2,15,70,.05), 0 calc(6px / var(--ui-zoom)) calc(18px / var(--ui-zoom)) rgba(2,15,70,.065);
  --focus-offset: calc(2px / var(--ui-zoom));
}
:root[data-density="comfortable"] .app-shell, :root[data-density="comfortable"] .hb-zoomed {
  --h-sm: calc(30px / var(--ui-zoom));
  --h: calc(36px / var(--ui-zoom));
  --h-lg: calc(44px / var(--ui-zoom));
  --h-field: calc(38px / var(--ui-zoom));
  --h-row: calc(32px / var(--ui-zoom));
  --h-cmd: calc(36px / var(--ui-zoom));
  --h-chip: calc(28px / var(--ui-zoom));
  --h-send: calc(34px / var(--ui-zoom));
  --h-badge: calc(22px / var(--ui-zoom));
  --h-panel-head: calc(34px / var(--ui-zoom));
  --pad-btn-sm: calc(10px / var(--ui-zoom));
  --pad-btn: calc(14px / var(--ui-zoom));
  --pad-btn-lg: calc(18px / var(--ui-zoom));
  --pad-field: calc(12px / var(--ui-zoom));
  --pad-chip: calc(10px / var(--ui-zoom));
  --pad-seg: calc(3px / var(--ui-zoom));
  --pad-tab: calc(8px / var(--ui-zoom)) 0 calc(10px / var(--ui-zoom));
  --pad-panel-head: 0 calc(8px / var(--ui-zoom)) 0 calc(14px / var(--ui-zoom));
  --pad-li: calc(10px / var(--ui-zoom)) calc(14px / var(--ui-zoom));
  --pad-cell: calc(10px / var(--ui-zoom)) calc(12px / var(--ui-zoom));
  --r-btn-sm: calc(8px / var(--ui-zoom));
  --r-btn: calc(10px / var(--ui-zoom));
  --r-btn-lg: calc(12px / var(--ui-zoom));
  --r-field: calc(10px / var(--ui-zoom));
  --fs-lg: calc(15px / var(--ui-zoom));
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .app-shell, :root:not([data-theme="light"]) .hb-zoomed {
    --shadow: 0 calc(1px / var(--ui-zoom)) calc(2px / var(--ui-zoom)) rgba(0,0,0,.22), 0 calc(2px / var(--ui-zoom)) calc(7px / var(--ui-zoom)) rgba(0,0,0,.15);
    --shadow-pop: 0 calc(1px / var(--ui-zoom)) calc(4px / var(--ui-zoom)) rgba(0,0,0,.28), 0 calc(8px / var(--ui-zoom)) calc(22px / var(--ui-zoom)) rgba(0,0,0,.28);
  }
}
:root[data-theme="dark"] .app-shell, :root[data-theme="dark"] .hb-zoomed {
  --shadow: 0 calc(1px / var(--ui-zoom)) calc(2px / var(--ui-zoom)) rgba(0,0,0,.22), 0 calc(2px / var(--ui-zoom)) calc(7px / var(--ui-zoom)) rgba(0,0,0,.15);
  --shadow-pop: 0 calc(1px / var(--ui-zoom)) calc(4px / var(--ui-zoom)) rgba(0,0,0,.28), 0 calc(8px / var(--ui-zoom)) calc(22px / var(--ui-zoom)) rgba(0,0,0,.28);
}

/* Live app zoom. On .app-shell only, never html (see MANUAL / verify/EVIDENCE). */
.app-shell {
  zoom: var(--ui-zoom);
  min-height: calc(100vh / var(--ui-zoom));
}

/* The ground. A layer behind the panel row, over --bg-page.
   position: ABSOLUTE, deliberately, not fixed. Measured (verify/EVIDENCE.md finding 2):
   inside zoom 1.21 a position:fixed child sizes to the real viewport. Mount this on a
   position:relative shell root. */
.hb-ground {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(60% 50% at 18% 12%,
      color-mix(in oklab, var(--project-colour) var(--ground-alpha-1), transparent),
      transparent var(--ground-blur-r)),
    radial-gradient(55% 45% at 82% 28%,
      color-mix(in oklab, var(--project-colour) var(--ground-alpha-2), transparent),
      transparent var(--ground-blur-r)),
    radial-gradient(70% 55% at 50% 100%,
      color-mix(in oklab, var(--project-colour) var(--ground-alpha-3), transparent),
      transparent var(--ground-blur-r)),
    var(--bg-page);
}

@media (prefers-reduced-motion: reduce) {
  :root,
  [data-theme="dark"] {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-arrive: 0ms;
    --dur-panel: 0ms;
    --dur-slow: 0ms;
    --dur-cascade-step: 0ms;
    --dur-rise: 0ms;
    --dur-pulse: 0ms;
    --dur-blink: 0ms;
    --dur-tint: 0ms;
  }
}
