/* ═══════════════════════════════════════════════════════════════════════════
   LIAISON DESIGN SYSTEM · TOKENS · COLOUR (v1, approved 2026-09-24)
   The single source of truth. Generated from the approved palette; do not
   hand-edit values here. Change the source and regenerate.

   Switch context with two attributes on <html>:
     data-theme     = "dark" | "light"
     data-workspace = "liaison" | "conduit" | "portal" | "labs" | "keep" | "braza"
   Components use ROLE names only. Never a hex, never a --pal-* name.
   Every text role passes 4.5:1 on every surface in every theme and workspace,
   except --text-4 (disabled controls and decoration only).
   scripts/check_contrast.py proves it; run it after any change.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Palette: the raw ramps, taken from the product marks. Reference only. ── */
:root{
  --pal-liaison-900:#0A1547;--pal-liaison-700:#0537B6;--pal-liaison-500:#1A54E8;--pal-liaison-300:#6699FF;--pal-liaison-100:#B8D6FF;
  --pal-conduit-900:#A8780F;--pal-conduit-700:#E0A41C;--pal-conduit-500:#FBBF24;--pal-conduit-300:#FFD45E;--pal-conduit-100:#FFE8A8;
  --pal-portal-900:#1A0F2E;--pal-portal-700:#4D2F9C;--pal-portal-500:#7C4AE8;--pal-portal-300:#A78BFA;--pal-portal-100:#E0D2FF;
  --pal-labs-900:#2A303B;--pal-labs-700:#6B7384;--pal-labs-500:#A3ACBB;--pal-labs-300:#CBD2DC;--pal-labs-100:#EEF1F5;
  --pal-keep-900:#0F6E4B;--pal-keep-700:#1A9466;--pal-keep-500:#34D399;--pal-keep-300:#5FE6AC;--pal-keep-100:#BAF5DC;
  --pal-braza-900:#8A3A10;--pal-braza-700:#C2410C;--pal-braza-500:#FF6B35;--pal-braza-300:#FF8A5C;--pal-braza-100:#FFD9CC;
  --pal-airis-900:#155E75;--pal-airis-700:#0891B2;--pal-airis-500:#22D3EE;--pal-airis-300:#67E8F9;--pal-airis-100:#CFFAFE;
}

/* ── Info is neutral in every context: no hue, the icon does the work. ── */
:root{--info-fg:var(--text-2);--info-tint:var(--surface-3);--info-fill:var(--text-2);--info-on:var(--surface-1)}

/* ── Topic colours: the fixed hue of a Toolkit card's tile and glow (conduit-dashboard.html,
   conduit-toolkit.html), the same in every theme and workspace. Decoration only, never text:
   a tile's icon mixes its topic toward --text-1 in dark and toward --topic-ink in light.
   Airis cyan, Envoy Activity gold, money green (Owner's Draw, earnings), Leaderboard violet,
   Analytics blue (added for S4 of the redesign, 2026-09-29), and a partner application's violet
   (business-partners.html: its pill, avatar and sheet tint; added for S7, 2026-09-29). ── */
:root{--topic-airis:#06B6D4;--topic-envoys:#E0A41C;--topic-money:#22C55E;--topic-leaderboard:#8B5CF6;--topic-analytics:#1A54E8;--topic-application:#8B5CF6;--topic-streak:#F97316;--confetti-gold:#FBBF24;--topic-ink:#000000}

/* ── Finance's two inks (business-finance.html, added for S6 of the redesign, 2026-09-29).
   --badge-ink: the count on a --warning-fill badge (a sub-tab's "2 need you"), dark in every
   theme as the specimen draws it. --accruing-fg: the Accruing pill's text on a
   --topic-leaderboard tint (16%), deeper in light, lighter in dark. ── */
:root{--badge-ink:#2A1D05;--accruing-fg:#C4B5FD}
html[data-theme="light"]{--accruing-fg:#6D28D9}

/* ── Chart series: the fixed hues of Analytics' charts and split bars (business-analytics.html), the
   same in every theme and workspace. Decoration only, never text: a series is always named in a
   legend or a row beside it. Revenue blue, tax slate, expenses orange, owner's draws pink (money);
   retainers and fees (revenue by type); where leads came from: the website form, partners, partner
   applications and leads added by hand. Added for S8 of the redesign, 2026-09-29. ── */
:root{--series-revenue:#5B8AF5;--series-tax:#94A3B8;--series-expenses:#FB923C;--series-draws:#E879F9;--series-retainers:#1A54E8;--series-fees:#14B8A6;--series-web:#D99A2B;--series-partner:#2F5BD8;--series-referral:#8B5CF6;--series-manual:#94A3B8;--series-current:#7FA6FF}

/* liaison, dark */
:root,html[data-theme="dark"][data-workspace="liaison"]{--ground:#020408;--surface-1:#0D1321;--surface-2:#151D30;--surface-3:#1B253D;--text-1:#F0F4FF;--text-2:#C0C4CE;--text-3:#9A9EA6;--text-4:#61646B;--line-1:#1F2126;--line-2:#323439;--line-3:#7E8188;--accent-fill:#1A54E8;--accent-hover:#3366F0;--accent-on:#FFFFFF;--accent-fg:#7FA6FF;--accent-tint:#061230;--success-fg:#4ADE80;--success-fill:#22C55E;--success-on:#052E16;--success-tint:#102F2B;--warning-fg:#FB923C;--warning-fill:#FB923C;--warning-on:#3A1703;--warning-tint:#332725;--danger-fg:#F87171;--danger-fill:#DC2626;--danger-on:#FFFFFF;--danger-tint:#2E1622;--airis-fg:#22D3EE;--airis-fill:#06B6D4;--airis-on:#032A33;--accent-glow:#1A54E8}

/* liaison, light */
html[data-theme="light"][data-workspace="liaison"]{--ground:#F2F5FA;--surface-1:#FFFFFF;--surface-2:#F6F8FE;--surface-3:#E6EAF1;--text-1:#0A1547;--text-2:#2F3964;--text-3:#545D80;--text-4:#959BB2;--line-1:#DBDFE8;--line-2:#C8CDDA;--line-3:#707896;--accent-fill:#0537B6;--accent-hover:#0A2C8C;--accent-on:#FFFFFF;--accent-fg:#0537B6;--accent-tint:#E4EAFC;--success-fg:#146C34;--success-fill:#15803D;--success-on:#FFFFFF;--success-tint:#E8F2EC;--warning-fg:#9A4507;--warning-fill:#B45309;--warning-on:#FFFFFF;--warning-tint:#F8EEE6;--danger-fg:#B91C1C;--danger-fill:#B91C1C;--danger-on:#FFFFFF;--danger-tint:#F8E8E8;--airis-fg:#0B6478;--airis-fill:#0E7490;--airis-on:#FFFFFF;--accent-glow:#1A54E8}

/* conduit, dark */
html[data-theme="dark"][data-workspace="conduit"]{--ground:#070502;--surface-1:#1F190D;--surface-2:#2E2615;--surface-3:#3B311B;--text-1:#FBF3E4;--text-2:#CAC3B7;--text-3:#A39D93;--text-4:#69645C;--line-1:#24221D;--line-2:#38352F;--line-3:#868178;--accent-fill:#FBBF24;--accent-hover:#FFD45E;--accent-on:#2A1D05;--accent-fg:#FBBF24;--accent-tint:#2E2207;--success-fg:#4ADE80;--success-fill:#22C55E;--success-on:#052E16;--success-tint:#1F351A;--warning-fg:#FB923C;--warning-fill:#FB923C;--warning-on:#3A1703;--warning-tint:#422C15;--danger-fg:#F87171;--danger-fill:#DC2626;--danger-on:#FFFFFF;--danger-tint:#3D1B11;--airis-fg:#22D3EE;--airis-fill:#06B6D4;--airis-on:#032A33;--accent-glow:#E0A41C}

/* conduit, light */
html[data-theme="light"][data-workspace="conduit"]{--ground:#F7F1E6;--surface-1:#FFFFFF;--surface-2:#FEFBF6;--surface-3:#EDE7DB;--text-1:#2A2113;--text-2:#4B4235;--text-3:#6C6457;--text-4:#A59E92;--line-1:#E2DCD1;--line-2:#D2CCC0;--line-3:#847D70;--accent-fill:#E0A41C;--accent-hover:#C98F0E;--accent-on:#2A1D05;--accent-fg:#7F5300;--accent-tint:#FBF4E4;--success-fg:#146C34;--success-fill:#15803D;--success-on:#FFFFFF;--success-tint:#E8F2EC;--warning-fg:#9A4507;--warning-fill:#B45309;--warning-on:#FFFFFF;--warning-tint:#F8EEE6;--danger-fg:#B91C1C;--danger-fill:#B91C1C;--danger-on:#FFFFFF;--danger-tint:#F8E8E8;--airis-fg:#0B6478;--airis-fill:#0E7490;--airis-on:#FFFFFF;--accent-glow:#E0A41C}

/* portal, dark */
html[data-theme="dark"][data-workspace="portal"]{--ground:#05030B;--surface-1:#171124;--surface-2:#211B32;--surface-3:#2B223F;--text-1:#F3F0FF;--text-2:#C3C1CE;--text-3:#9D9BA7;--text-4:#64626D;--line-1:#221F28;--line-2:#35323C;--line-3:#817E8A;--accent-fill:#7C4AE8;--accent-hover:#6B3BDB;--accent-on:#FFFFFF;--accent-fg:#B79CFF;--accent-tint:#1A1033;--success-fg:#4ADE80;--success-fill:#22C55E;--success-on:#052E16;--success-tint:#192E2D;--warning-fg:#FB923C;--warning-fill:#FB923C;--warning-on:#3A1703;--warning-tint:#3B2628;--danger-fg:#F87171;--danger-fill:#DC2626;--danger-on:#FFFFFF;--danger-tint:#371424;--airis-fg:#22D3EE;--airis-fill:#06B6D4;--airis-on:#032A33;--accent-glow:#7C4AE8}

/* portal, light */
html[data-theme="light"][data-workspace="portal"]{--ground:#F4F1FB;--surface-1:#FFFFFF;--surface-2:#FAF8FE;--surface-3:#EAE6F1;--text-1:#241B3A;--text-2:#453D59;--text-3:#675F78;--text-4:#A19BAE;--line-1:#DFDCE8;--line-2:#CFCAD8;--line-3:#80798F;--accent-fill:#6234C4;--accent-hover:#4F27A6;--accent-on:#FFFFFF;--accent-fg:#5B2EC7;--accent-tint:#EFE9FC;--success-fg:#146C34;--success-fill:#15803D;--success-on:#FFFFFF;--success-tint:#E8F2EC;--warning-fg:#9A4507;--warning-fill:#B45309;--warning-on:#FFFFFF;--warning-tint:#F8EEE6;--danger-fg:#B91C1C;--danger-fill:#B91C1C;--danger-on:#FFFFFF;--danger-tint:#F8E8E8;--airis-fg:#0B6478;--airis-fill:#0E7490;--airis-on:#FFFFFF;--accent-glow:#7C4AE8}

/* labs, dark */
html[data-theme="dark"][data-workspace="labs"]{--ground:#040507;--surface-1:#181A1D;--surface-2:#26262A;--surface-3:#303236;--text-1:#F2F4F7;--text-2:#C2C4C7;--text-3:#9C9EA1;--text-4:#636567;--line-1:#212224;--line-2:#343537;--line-3:#808184;--accent-fill:#D5DBE4;--accent-hover:#E8ECF1;--accent-on:#0E1320;--accent-fg:#7FA6FF;--accent-tint:#212327;--success-fg:#4ADE80;--success-fill:#22C55E;--success-on:#052E16;--success-tint:#1A3527;--warning-fg:#FB923C;--warning-fill:#FB923C;--warning-on:#3A1703;--warning-tint:#3C2D22;--danger-fg:#F87171;--danger-fill:#DC2626;--danger-on:#FFFFFF;--danger-tint:#371C1E;--airis-fg:#22D3EE;--airis-fill:#06B6D4;--airis-on:#032A33;--accent-glow:#1A54E8}

/* labs, light */
html[data-theme="light"][data-workspace="labs"]{--ground:#F3F4F6;--surface-1:#FFFFFF;--surface-2:#FBFCFC;--surface-3:#E8E9EB;--text-1:#171A21;--text-2:#3A3D43;--text-3:#5D6065;--text-4:#9B9DA1;--line-1:#DDDEE1;--line-2:#CBCDD0;--line-3:#787A7F;--accent-fill:#3A4250;--accent-hover:#2A303B;--accent-on:#FFFFFF;--accent-fg:#0537B6;--accent-tint:#F4F5F7;--success-fg:#146C34;--success-fill:#15803D;--success-on:#FFFFFF;--success-tint:#E8F2EC;--warning-fg:#9A4507;--warning-fill:#B45309;--warning-on:#FFFFFF;--warning-tint:#F8EEE6;--danger-fg:#B91C1C;--danger-fill:#B91C1C;--danger-on:#FFFFFF;--danger-tint:#F8E8E8;--airis-fg:#0B6478;--airis-fill:#0E7490;--airis-on:#FFFFFF;--accent-glow:#1A54E8}

/* keep, dark */
html[data-theme="dark"][data-workspace="keep"]{--ground:#020705;--surface-1:#0D1C16;--surface-2:#152820;--surface-3:#1C332A;--text-1:#EEFBF5;--text-2:#BFCAC5;--text-3:#99A39F;--text-4:#606965;--line-1:#1E2422;--line-2:#313835;--line-3:#7D8682;--accent-fill:#34D399;--accent-hover:#5FE6AC;--accent-on:#04241A;--accent-fg:#5FE6AC;--accent-tint:#072419;--success-fg:#4ADE80;--success-fill:#22C55E;--success-on:#052E16;--success-tint:#103722;--warning-fg:#FB923C;--warning-fill:#FB923C;--warning-on:#3A1703;--warning-tint:#332F1C;--danger-fg:#F87171;--danger-fill:#DC2626;--danger-on:#FFFFFF;--danger-tint:#2E1E19;--airis-fg:#22D3EE;--airis-fill:#06B6D4;--airis-on:#032A33;--accent-glow:#1FA875}

/* keep, light */
html[data-theme="light"][data-workspace="keep"]{--ground:#F1F7F4;--surface-1:#FFFFFF;--surface-2:#F6FCF9;--surface-3:#E6EDE9;--text-1:#0F2A20;--text-2:#334B42;--text-3:#576C64;--text-4:#97A59F;--line-1:#DAE2DF;--line-2:#C8D2CE;--line-3:#72847D;--accent-fill:#0F6E4B;--accent-hover:#0A5A3D;--accent-on:#FFFFFF;--accent-fg:#0B6443;--accent-tint:#E4F5EE;--success-fg:#146C34;--success-fill:#15803D;--success-on:#FFFFFF;--success-tint:#E8F2EC;--warning-fg:#9A4507;--warning-fill:#B45309;--warning-on:#FFFFFF;--warning-tint:#F8EEE6;--danger-fg:#B91C1C;--danger-fill:#B91C1C;--danger-on:#FFFFFF;--danger-tint:#F8E8E8;--airis-fg:#0B6478;--airis-fill:#0E7490;--airis-on:#FFFFFF;--accent-glow:#1FA875}

/* braza, dark */
html[data-theme="dark"][data-workspace="braza"]{--ground:#020408;--surface-1:#1D1514;--surface-2:#2E1F1C;--surface-3:#3B2824;--text-1:#FFF2EC;--text-2:#CCC2BE;--text-3:#A49C9A;--text-4:#676363;--line-1:#202123;--line-2:#353436;--line-3:#86807F;--accent-fill:#FF6B35;--accent-hover:#FF8A5C;--accent-on:#2A0F04;--accent-fg:#FF8A5C;--accent-tint:#301710;--success-fg:#4ADE80;--success-fill:#22C55E;--success-on:#052E16;--success-tint:#1E3120;--warning-fg:#FB923C;--warning-fill:#FB923C;--warning-on:#3A1703;--warning-tint:#41291A;--danger-fg:#F87171;--danger-fill:#DC2626;--danger-on:#FFFFFF;--danger-tint:#3C1817;--airis-fg:#22D3EE;--airis-fill:#06B6D4;--airis-on:#032A33;--accent-glow:#FF6B35}

/* braza, light */
html[data-theme="light"][data-workspace="braza"]{--ground:#F8F3F0;--surface-1:#FFFFFF;--surface-2:#FFF9F7;--surface-3:#EEE8E5;--text-1:#2A140C;--text-2:#4B3830;--text-3:#6C5B55;--text-4:#A69A95;--line-1:#E3DDD9;--line-2:#D3CBC7;--line-3:#857670;--accent-fill:#C2410C;--accent-hover:#A3360A;--accent-on:#FFFFFF;--accent-fg:#B23A0B;--accent-tint:#FFEDE7;--success-fg:#146C34;--success-fill:#15803D;--success-on:#FFFFFF;--success-tint:#E8F2EC;--warning-fg:#9A4507;--warning-fill:#B45309;--warning-on:#FFFFFF;--warning-tint:#F8EEE6;--danger-fg:#B91C1C;--danger-fill:#B91C1C;--danger-on:#FFFFFF;--danger-tint:#F8E8E8;--airis-fg:#0B6478;--airis-fill:#0E7490;--airis-on:#FFFFFF;--accent-glow:#FF6B35}

/* ── Record colours (partners, clients, stages) are set at runtime per element by
   assets/record-colour.js: --rec, --rec-tint, --rec-fg, --rec-on, --rec-line.
   See references/colour.md. They never feed a button, tab or focus ring. ── */


/* ═══════════════════════════════════════════════════════════════════════════
   TYPOGRAPHY (v1, approved 2026-09-24)
   Two faces. Fifteen styles on ten sizes. Sizes in rem so they follow the
   phone's text-size setting. Components use a style, never a raw size.
   Use either the class (.t-body) or the pair of variables:
     font: var(--type-body); letter-spacing: var(--track-body);
   @font-face rules live in references/typography.md (paths differ per app).
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --font-sans:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-mono:'DM Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --type-display:800 clamp(2.75rem,1.6rem + 5vw,4.5rem)/1.02 var(--font-sans); --track-display:-0.035em;
  --type-title-1:800 2rem/1.1 var(--font-sans);        --track-title-1:-0.03em;
  --type-title-2:800 1.5rem/1.15 var(--font-sans);     --track-title-2:-0.025em;
  --type-title-3:700 1.25rem/1.25 var(--font-sans);    --track-title-3:-0.015em;
  --type-headline:700 1.0625rem/1.3 var(--font-sans);  --track-headline:-0.01em;
  --type-body:400 0.9375rem/1.55 var(--font-sans);     --track-body:0;
  --type-body-strong:600 0.9375rem/1.55 var(--font-sans); --track-body-strong:0;
  --type-callout:500 0.875rem/1.45 var(--font-sans);   --track-callout:0;
  --type-button:700 0.875rem/1 var(--font-sans);       --track-button:0;
  --type-footnote:400 0.8125rem/1.45 var(--font-sans); --track-footnote:0;
  --type-caption:500 0.75rem/1.35 var(--font-sans);    --track-caption:0.01em;
  --type-label:500 0.6875rem/1.2 var(--font-mono);     --track-label:0.08em;
  --type-code:400 0.8125rem/1.45 var(--font-mono);     --track-code:0;
  --type-stat-1:800 2rem/1 var(--font-sans);           --track-stat-1:-0.03em;
  --type-stat-2:800 1.25rem/1.1 var(--font-sans);      --track-stat-2:-0.02em;
  --measure:68ch;
}
.t-display{font:var(--type-display);letter-spacing:var(--track-display)}
.t-title-1{font:var(--type-title-1);letter-spacing:var(--track-title-1)}
.t-title-2{font:var(--type-title-2);letter-spacing:var(--track-title-2)}
.t-title-3{font:var(--type-title-3);letter-spacing:var(--track-title-3)}
.t-headline{font:var(--type-headline);letter-spacing:var(--track-headline)}
.t-body{font:var(--type-body);letter-spacing:var(--track-body)}
.t-body-strong{font:var(--type-body-strong);letter-spacing:var(--track-body-strong)}
.t-callout{font:var(--type-callout);letter-spacing:var(--track-callout)}
.t-button{font:var(--type-button);letter-spacing:var(--track-button)}
.t-footnote{font:var(--type-footnote);letter-spacing:var(--track-footnote)}
.t-caption{font:var(--type-caption);letter-spacing:var(--track-caption)}
.t-label{font:var(--type-label);letter-spacing:var(--track-label);text-transform:uppercase}
.t-code{font:var(--type-code);letter-spacing:var(--track-code)}
.t-stat-1{font:var(--type-stat-1);letter-spacing:var(--track-stat-1);font-variant-numeric:tabular-nums}
.t-stat-2{font:var(--type-stat-2);letter-spacing:var(--track-stat-2);font-variant-numeric:tabular-nums}
.num{font-variant-numeric:tabular-nums}
/* Inputs never below 16px on touch screens, or iPhone zooms the page on focus. */
@media (pointer:coarse){input,select,textarea{font-size:max(1rem,16px)}}


/* ═══════════════════════════════════════════════════════════════════════════
   SPACE, SHAPE, DEPTH, LAYERS (v1, approved 2026-09-24)
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  /* Spacing: a 4px grid, twelve steps. Padding, margin and gap use only these. */
  --space-0-5:.125rem; --space-1:.25rem; --space-1-5:.375rem; --space-2:.5rem;
  --space-3:.75rem;    --space-4:1rem;   --space-5:1.25rem;   --space-6:1.5rem;
  --space-8:2rem;      --space-10:2.5rem; --space-12:3rem;    --space-16:4rem;
  --gutter:var(--space-5);                       /* page side margin: 20px phone */
  --tap:44px;                                    /* minimum tap target */

  /* Corners: six sizes. Inner corner = outer corner minus the padding between. */
  --radius-xs:6px; --radius-sm:10px; --radius-md:14px; --radius-lg:20px; --radius-xl:28px; --radius-pill:999px;

  /* Layers: pick by name, never a raw z-index. */
  --z-raised:1; --z-sticky:10; --z-chrome:100; --z-scrim:200; --z-sheet:300; --z-popover:400; --z-toast:500; --z-splash:900;

  /* Depth, dark theme defaults */
  --edge:rgba(255,255,255,.07);                  /* bright top edge on raised surfaces */
  --shadow-1:0 8px 24px -14px rgba(0,0,0,.7);    /* cards */
  --shadow-2:0 14px 36px -14px rgba(0,0,0,.75);  /* floating chrome */
  --shadow-3:0 28px 70px -18px rgba(0,0,0,.8);   /* sheets, menus, dialogs */
  --scrim:rgba(0,0,0,.5);
  --bloom-strength:.72;
}
@media (min-width:768px){:root{--gutter:var(--space-8)}}
@media (min-width:1200px){:root{--gutter:var(--space-12)}}
html[data-theme="light"]{
  --edge:rgba(255,255,255,.75);
  --shadow-1:0 1px 2px rgba(10,21,71,.05),0 8px 24px -14px rgba(10,21,71,.18);
  --shadow-2:0 14px 36px -14px rgba(10,21,71,.22);
  --shadow-3:0 28px 70px -18px rgba(10,21,71,.28);
  --scrim:rgba(10,21,71,.22);
  --bloom-strength:.5;
}
/* Gold is the brightest glow: capped so text over it still passes 4.5:1. */
html[data-theme="dark"][data-workspace="conduit"]{--bloom-strength:.62}

/* Glass: three weights. Never glass on glass.
   glass-card    cards: today's see-through panels, so the background glows show through (kept at his request, 2026-09-24)
   glass-regular floating bars: tab bar, floating buttons. Today's tab bar exactly: 33% tint, 24px blur, colour x2
   glass-thick   sheets, menus, dialogs, side panels. Today's sheets exactly: 62% tint, 60px blur, colour x2 */
:root{--card-tint:var(--accent-glow)}
html[data-workspace="labs"]{--card-tint:#A3ACBB} /* Labs: platinum carries the cards; blue stays for glows and accents */
.glass-card{background:linear-gradient(135deg,color-mix(in srgb,var(--card-tint) 12%,transparent),color-mix(in srgb,var(--card-tint) 6%,transparent));-webkit-backdrop-filter:blur(8px) saturate(180%);backdrop-filter:blur(8px) saturate(180%);box-shadow:inset 0 1px 0 var(--edge),var(--shadow-1)}
html[data-theme="light"] .glass-card{background:color-mix(in srgb,var(--surface-1) 92%,transparent)}
.glass-regular{background:color-mix(in srgb,var(--surface-1) 33%,transparent);-webkit-backdrop-filter:blur(24px) saturate(200%);backdrop-filter:blur(24px) saturate(200%);box-shadow:inset 0 1px 0 var(--edge),var(--shadow-2)}
.glass-thick{background:color-mix(in srgb,var(--surface-1) 62%,transparent);-webkit-backdrop-filter:blur(60px) saturate(200%);backdrop-filter:blur(60px) saturate(200%);box-shadow:inset 0 1px 0 var(--edge),var(--shadow-3)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass-card,.glass-regular,.glass-thick{background:var(--surface-1)}}
@media (prefers-reduced-transparency:reduce){.glass-card,.glass-regular,.glass-thick{background:var(--surface-1);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (prefers-contrast:more){.glass-card,.glass-regular,.glass-thick{background:var(--surface-1);-webkit-backdrop-filter:none;backdrop-filter:none;outline:1px solid var(--line-2)}}

/* Bloom: today's four-layer aurora, workspace glow by default.
   Set --pb (and optionally --pb2, --pb3) to identity colours for a partner bloom. */
.bloom{position:relative;overflow:hidden;isolation:isolate}
.bloom::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;
  background:
    radial-gradient(ellipse 60% 55% at 25% 110%,var(--pb,var(--accent-glow)) 0%,transparent 75%),
    radial-gradient(ellipse 55% 60% at 60% 110%,color-mix(in srgb,var(--pb2,var(--pb,var(--accent-glow))) 80%,#000) 0%,transparent 75%),
    radial-gradient(ellipse 50% 55% at 90% 106%,color-mix(in srgb,var(--pb3,var(--pb,var(--accent-glow))) 68%,#fff) 0%,transparent 75%),
    radial-gradient(ellipse 80% 22% at 50% 118%,color-mix(in srgb,var(--pb,var(--accent-glow)) 32%,#fff) 0%,transparent 70%);
  filter:blur(22px) saturate(1.15);opacity:var(--bloom-strength);animation:liaison-bloom-drift 16s ease-in-out infinite}
@keyframes liaison-bloom-drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-3%,-2%) scale(1.05)}66%{transform:translate(3%,1%) scale(1.03)}}
@media (prefers-reduced-motion:reduce){.bloom::after{animation:none}}

/* Partner lifecycle pills: today's colours, kept by decision (2026-09-24). Named exception to "status never borrows a hue". */
:root{--life-ramp:#62CCE6;--life-ramp-ends:#ECBC48}
html[data-theme="light"]{--life-ramp:#0B6478;--life-ramp-ends:#8A5B00}
.pill-ramp{background:color-mix(in srgb,var(--life-ramp) 14%,transparent);color:var(--life-ramp);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--life-ramp) 45%,transparent)}
.pill-ramp-ends{background:color-mix(in srgb,var(--life-ramp-ends) 14%,transparent);color:var(--life-ramp-ends);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--life-ramp-ends) 45%,transparent)}

/* ===== Motion (design section: Motion, awaiting approval) =====
   Springs are the default for anything that moves in space; see assets/motion.js.
   These CSS values cover the few places a plain transition is right (press, fades, colour). */
:root{
  --motion-press:100ms;            /* scale to .97 on touch-down, spring back */
  --motion-fade-in:150ms;
  --motion-fade-out:120ms;
  --motion-fade-reduced:200ms;     /* the reduced-motion swap for slides and growth */
  --motion-colour:400ms;           /* lens and status colour cross-fades */
  --motion-stagger:30ms;           /* first 5 items only */
  --motion-number:600ms;           /* a value that changes while you're looking */
  --motion-chart-draw:700ms;
  --motion-toast-hold:2800ms;      /* 5000ms when the toast has Undo */
  --motion-skeleton-delay:300ms;   /* no skeleton for faster loads */
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  /* Springs (response in seconds, damping ratio): standard .35/1 · snappy .25/1 · gentle .5/1 · flick .35/.8 */
}
@media (prefers-reduced-motion:reduce){:root{--motion-stagger:0ms;--motion-number:0ms;--motion-chart-draw:0ms}}