/* DIXI design system tokens v1.2, 5 Nov 2026. https://www.dixi.agency/client-portal/design-system
   Light is the default. Dark: add class="dk" or data-theme="dark" to <html>, or let the system setting decide
   (remove the media query below if you only want the manual switch). Fonts: Geist and Geist Mono (Google Fonts). */
:root{
  --dx-gray-0:#FFFFFF;
  --dx-gray-50:#F6F6F7;
  --dx-gray-100:#ECECEE;
  --dx-gray-200:#DCDCE0;
  --dx-gray-300:#CDCFD6;
  --dx-gray-400:#9C9EA6;
  --dx-gray-500:#7E8088;
  --dx-gray-600:#62646A;
  --dx-gray-700:#3A3B41;
  --dx-gray-800:#24242B;
  --dx-gray-850:#1A1A20;
  --dx-gray-900:#111113;
  --dx-gray-950:#08080A;
  --dx-blue-50:#F3F5FF;
  --dx-blue-100:#D7DEFF;
  --dx-blue-200:#B3C0FF;
  --dx-blue-300:#8C9CFF;
  --dx-blue-400:#7088FF;
  --dx-blue-500:#4461F0;
  --dx-blue-600:#364DCC;
  --dx-blue-700:#2A3EAD;
  --dx-blue-800:#203090;
  --dx-blue-900:#162374;
  --dx-blue-950:#0F195C;
  --dx-sky-50:#EDF8FF;
  --dx-sky-100:#E1F2FF;
  --dx-sky-200:#C7E8FF;
  --dx-sky-300:#A3DAFF;
  --dx-sky-400:#6CC7FF;
  --dx-sky-500:#12B2FD;
  --dx-sky-600:#0090CE;
  --dx-sky-700:#0072A5;
  --dx-sky-800:#00577F;
  --dx-sky-900:#003D5B;
  --dx-sky-950:#00273D;
  --dx-violet-50:#F7F4FF;
  --dx-violet-100:#EAE2FF;
  --dx-violet-200:#D8C9FF;
  --dx-violet-300:#C3A9FF;
  --dx-violet-400:#9E7DF0;
  --dx-violet-500:#7A4FE0;
  --dx-violet-600:#653DBE;
  --dx-violet-700:#5330A1;
  --dx-violet-800:#432486;
  --dx-violet-900:#34196B;
  --dx-violet-950:#281155;
  --dx-green-50:#EEF9F0;
  --dx-green-100:#CCF2D4;
  --dx-green-200:#A1E3B2;
  --dx-green-300:#6FD08C;
  --dx-green-400:#52C274;
  --dx-green-500:#2FB45A;
  --dx-green-600:#279549;
  --dx-green-700:#237A3B;
  --dx-green-800:#165E2B;
  --dx-green-900:#09431B;
  --dx-green-950:#032D0F;
  --dx-amber-50:#FBF5E8;
  --dx-amber-100:#FEEABF;
  --dx-amber-200:#F9D78C;
  --dx-amber-300:#F0C04A;
  --dx-amber-400:#E8B130;
  --dx-amber-500:#E0A100;
  --dx-amber-600:#BB8200;
  --dx-amber-700:#9A6700;
  --dx-amber-800:#754D00;
  --dx-amber-900:#513400;
  --dx-amber-950:#331F00;
  --dx-red-50:#FFF2F1;
  --dx-red-100:#FFDAD6;
  --dx-red-200:#FFB7AF;
  --dx-red-300:#FF8A80;
  --dx-red-400:#F36B66;
  --dx-red-500:#E5484D;
  --dx-red-600:#CB3432;
  --dx-red-700:#B42318;
  --dx-red-800:#8E160E;
  --dx-red-900:#690A05;
  --dx-red-950:#490402;
  --dx-font-sans:'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --dx-font-mono:'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --dx-font-display-lg:600 54px/1.02 var(--dx-font-sans);
  --dx-tracking-display-lg:-0.04em;
  --dx-font-display:600 46px/1.02 var(--dx-font-sans);
  --dx-tracking-display:-0.04em;
  --dx-font-title-1:600 40px/1.05 var(--dx-font-sans);
  --dx-tracking-title-1:-0.035em;
  --dx-font-title-2:600 32px/1.05 var(--dx-font-sans);
  --dx-tracking-title-2:-0.035em;
  --dx-font-title-3:600 24px/1.15 var(--dx-font-sans);
  --dx-tracking-title-3:-0.025em;
  --dx-font-headline:600 18px/1.3 var(--dx-font-sans);
  --dx-tracking-headline:-0.015em;
  --dx-font-body-lg:400 16px/1.6 var(--dx-font-sans);
  --dx-tracking-body-lg:0em;
  --dx-font-body:400 15px/1.5 var(--dx-font-sans);
  --dx-tracking-body:0em;
  --dx-font-label:500 14.5px/1.2 var(--dx-font-sans);
  --dx-tracking-label:0em;
  --dx-font-callout:400 14px/1.5 var(--dx-font-sans);
  --dx-tracking-callout:0em;
  --dx-font-subhead:400 13.5px/1.45 var(--dx-font-sans);
  --dx-tracking-subhead:0em;
  --dx-font-footnote:500 12.5px/1.4 var(--dx-font-sans);
  --dx-tracking-footnote:0em;
  --dx-font-caption:600 11.5px/1.35 var(--dx-font-sans);
  --dx-tracking-caption:0.04em;
  --dx-font-mono:500 13px/1.5 var(--dx-font-mono);
  --dx-tracking-mono:0em;
  --dx-space-2:2px;
  --dx-space-4:4px;
  --dx-space-6:6px;
  --dx-space-8:8px;
  --dx-space-10:10px;
  --dx-space-12:12px;
  --dx-space-16:16px;
  --dx-space-20:20px;
  --dx-space-24:24px;
  --dx-space-28:28px;
  --dx-space-32:32px;
  --dx-space-40:40px;
  --dx-space-48:48px;
  --dx-space-64:64px;
  --dx-space-gutter:var(--dx-space-12);
  --dx-space-inset-card:var(--dx-space-24);
  --dx-space-inset-tile:var(--dx-space-16);
  --dx-space-stack-section:var(--dx-space-40);
  --dx-space-stack-text:var(--dx-space-8);
  --dx-space-page:var(--dx-space-12);
  --dx-radius-xs:4px;
  --dx-radius-sm:10px;
  --dx-radius-md:12px;
  --dx-radius-field:14px;
  --dx-radius-tile:16px;
  --dx-radius-card-sm:22px;
  --dx-radius-card:24px;
  --dx-radius-panel:28px;
  --dx-radius-full:999px;
  --dx-duration-fast:200ms;
  --dx-duration-base:250ms;
  --dx-duration-slow:350ms;
  --dx-duration-slower:500ms;
  --dx-duration-slowest:600ms;
  --dx-ease-standard:cubic-bezier(0.2,0.7,0.2,1);
  --dx-ease-spring:cubic-bezier(0.2,0.9,0.3,1.2);
  --dx-ease-in-out:cubic-bezier(0.4,0,0.2,1);
  --dx-ease-linear:cubic-bezier(0,0,1,1);
  --dx-ease-overshoot:cubic-bezier(0.3,1.4,0.5,1);
  --dx-z-base:0;
  --dx-z-sticky:5;
  --dx-z-toast:50;
  --dx-z-overlay:60;
  --dx-z-modal:70;
  --dx-opacity-disabled:0.45;
  --dx-opacity-loading:0.5;
  --dx-accent-gradient:linear-gradient(135deg, #12B2FD 0%, #4461F0 100%)
}

:root,[data-theme="light"],.ltz{
  --dx-bg-canvas:#FFFFFF;
  --dx-bg-surface:#F6F6F7;
  --dx-bg-raised:#FFFFFF;
  --dx-bg-sunken:#ECECEE;
  --dx-bg-inverse:#111113;
  --dx-bg-hero:#08080A;
  --dx-border-subtle:#ECECEE;
  --dx-border-default:#DCDCE0;
  --dx-border-strong:#111113;
  --dx-border-focus:#12B2FD;
  --dx-text-primary:#111113;
  --dx-text-secondary:#3A3B41;
  --dx-text-tertiary:#62646A;
  --dx-text-disabled:#9C9EA6;
  --dx-text-inverse:#FFFFFF;
  --dx-text-on-accent:#FFFFFF;
  --dx-accent-default:#364DCC;
  --dx-accent-solid:#4461F0;
  --dx-accent-solid-hover:#364DCC;
  --dx-accent-subtle:rgba(68, 97, 240, 0.1);
  --dx-action-primary-bg:#111113;
  --dx-action-primary-bg-hover:#364DCC;
  --dx-action-primary-fg:#FFFFFF;
  --dx-success-fg:#237A3B;
  --dx-success-bg:rgba(47, 180, 90, 0.1);
  --dx-success-solid:#2FB45A;
  --dx-warning-fg:#754D00;
  --dx-warning-bg:rgba(224, 161, 0, 0.14);
  --dx-warning-solid:#E0A100;
  --dx-danger-fg:#B42318;
  --dx-danger-bg:rgba(180, 35, 24, 0.08);
  --dx-danger-solid:#E5484D;
  --dx-info-fg:#364DCC;
  --dx-info-bg:rgba(68, 97, 240, 0.1);
  --dx-data-1:#4461F0;
  --dx-data-2:#12B2FD;
  --dx-data-3:#7A4FE0;
  --dx-data-4:#E0A100;
  --dx-data-5:#2FB45A;
  --dx-data-grid:#ECECEE;
  --dx-shadow-none:none;
  --dx-shadow-ring:inset 0 0 0 1px #ECECEE;
  --dx-shadow-raised:0 1px 2px rgba(17, 17, 19, 0.05), 0 12px 32px -18px rgba(17, 17, 19, 0.22);
  --dx-shadow-overlay:0 0 0 1px #DCDCE0, 0 24px 60px -20px rgba(17, 17, 19, 0.35), 0 8px 20px -12px rgba(17, 17, 19, 0.2);
  --dx-shadow-modal:0 0 0 1px rgba(17, 17, 19, 0.06), 0 40px 80px -24px rgba(17, 17, 19, 0.45);
  --dx-button-height-sm:36px;
  --dx-button-height-md:42px;
  --dx-button-height-lg:50px;
  --dx-button-padding-x-sm:14px;
  --dx-button-padding-x-md:18px;
  --dx-button-padding-x-lg:24px;
  --dx-button-radius:var(--dx-radius-full);
  --dx-button-primary-bg:var(--dx-action-primary-bg);
  --dx-button-primary-bg-hover:var(--dx-action-primary-bg-hover);
  --dx-field-height-md:42px;
  --dx-field-height-lg:50px;
  --dx-field-radius:var(--dx-radius-field);
  --dx-field-border:var(--dx-border-default);
  --dx-field-border-focus:var(--dx-accent-solid);
  --dx-chip-height-md:38px;
  --dx-chip-height-sm:32px;
  --dx-badge-height:26px;
  --dx-badge-height-sm:22px;
  --dx-nav-item-height:42px;
  --dx-nav-item-radius:var(--dx-radius-md);
  --dx-switch-width:44px;
  --dx-switch-height:26px;
  --dx-checkbox-size:20px;
  --dx-card-radius:var(--dx-radius-card);
  --dx-card-padding:var(--dx-space-inset-card);
  --dx-stat-value-size:34px;
  --dx-table-row-height:44px;
  --dx-table-row-height-compact:36px;
  --dx-dialog-width-sm:420px;
  --dx-dialog-width-md:560px;
  --dx-tooltip-radius:var(--dx-radius-md);
  --dx-toast-height:44px;
  --dx-icon-size-sm:16px;
  --dx-icon-size-md:18px;
  --dx-icon-size-lg:24px;
  --dx-icon-stroke:1.6;
  --dx-icon-accent:var(--dx-accent-default);
  --dx-icon-dash:2.1 2.5;
  --dx-cta-height-xs:36px;
  --dx-cta-height-sm:42px;
  --dx-cta-height-md:48px;
  --dx-cta-height-lg:54px;
  --dx-cta-padding-x-xs:14px;
  --dx-cta-padding-x-sm:16px;
  --dx-cta-padding-x-md:20px;
  --dx-cta-padding-x-lg:26px;
  --dx-cta-font-size-xs:13.5px;
  --dx-cta-font-size-sm:14px;
  --dx-cta-font-size-md:15px;
  --dx-cta-font-size-lg:16px;
  --dx-cta-border:1.5px;
  --dx-cta-dark-top:#3B3C42;
  --dx-cta-dark-mid:#1D1E21;
  --dx-cta-dark-bottom:#111113;
  --dx-cta-light-top:#FFFFFF;
  --dx-cta-light-bottom:#F0F1F3;
  --dx-cta-beam-start:#12B2FD;
  --dx-cta-beam-peak:#FFFFFF;
  --dx-cta-beam-end:#4461F0;
  --dx-cta-beam-duration:3.4s;
  --dx-cta-glow-opacity:0.55;
  --dx-cta-focus:#12B2FD
}

[data-theme="dark"],.dk,.dkz{
  --dx-bg-canvas:#08080A;
  --dx-bg-surface:#111113;
  --dx-bg-raised:#1A1A20;
  --dx-bg-sunken:#24242B;
  --dx-bg-inverse:#F6F6F7;
  --dx-bg-hero:#08080A;
  --dx-border-subtle:rgba(255, 255, 255, 0.08);
  --dx-border-default:rgba(255, 255, 255, 0.16);
  --dx-border-strong:#F6F6F7;
  --dx-border-focus:#12B2FD;
  --dx-text-primary:#F6F6F7;
  --dx-text-secondary:#CDCFD6;
  --dx-text-tertiary:#9C9EA6;
  --dx-text-disabled:#62646A;
  --dx-text-inverse:#111113;
  --dx-text-on-accent:#08080A;
  --dx-accent-default:#8C9CFF;
  --dx-accent-solid:#8C9CFF;
  --dx-accent-solid-hover:#B3C0FF;
  --dx-accent-subtle:rgba(112, 136, 255, 0.14);
  --dx-action-primary-bg:#F6F6F7;
  --dx-action-primary-bg-hover:#364DCC;
  --dx-action-primary-fg:#08080A;
  --dx-success-fg:#6FD08C;
  --dx-success-bg:rgba(111, 208, 140, 0.12);
  --dx-success-solid:#2FB45A;
  --dx-warning-fg:#F0C04A;
  --dx-warning-bg:rgba(240, 192, 74, 0.14);
  --dx-warning-solid:#E0A100;
  --dx-danger-fg:#FF8A80;
  --dx-danger-bg:rgba(255, 138, 128, 0.1);
  --dx-danger-solid:#E5484D;
  --dx-info-fg:#8C9CFF;
  --dx-info-bg:rgba(112, 136, 255, 0.14);
  --dx-data-1:#7088FF;
  --dx-data-2:#6CC7FF;
  --dx-data-3:#C3A9FF;
  --dx-data-4:#F0C04A;
  --dx-data-5:#6FD08C;
  --dx-data-grid:#1A1A20;
  --dx-shadow-none:none;
  --dx-shadow-ring:inset 0 0 0 1px rgba(255, 255, 255, 0.08);
  --dx-shadow-raised:0 0 0 1px rgba(255, 255, 255, 0.06), 0 18px 40px -20px rgba(0, 0, 0, 0.9);
  --dx-shadow-overlay:0 0 0 1px rgba(255, 255, 255, 0.16), 0 24px 60px -20px rgba(0, 0, 0, 0.75);
  --dx-shadow-modal:0 0 0 1px rgba(255, 255, 255, 0.1), 0 40px 80px -24px rgba(0, 0, 0, 0.9)
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(.lt) {
  --dx-bg-canvas:#08080A;
    --dx-bg-surface:#111113;
    --dx-bg-raised:#1A1A20;
    --dx-bg-sunken:#24242B;
    --dx-bg-inverse:#F6F6F7;
    --dx-bg-hero:#08080A;
    --dx-border-subtle:rgba(255, 255, 255, 0.08);
    --dx-border-default:rgba(255, 255, 255, 0.16);
    --dx-border-strong:#F6F6F7;
    --dx-border-focus:#12B2FD;
    --dx-text-primary:#F6F6F7;
    --dx-text-secondary:#CDCFD6;
    --dx-text-tertiary:#9C9EA6;
    --dx-text-disabled:#62646A;
    --dx-text-inverse:#111113;
    --dx-text-on-accent:#08080A;
    --dx-accent-default:#8C9CFF;
    --dx-accent-solid:#8C9CFF;
    --dx-accent-solid-hover:#B3C0FF;
    --dx-accent-subtle:rgba(112, 136, 255, 0.14);
    --dx-action-primary-bg:#F6F6F7;
    --dx-action-primary-bg-hover:#364DCC;
    --dx-action-primary-fg:#08080A;
    --dx-success-fg:#6FD08C;
    --dx-success-bg:rgba(111, 208, 140, 0.12);
    --dx-success-solid:#2FB45A;
    --dx-warning-fg:#F0C04A;
    --dx-warning-bg:rgba(240, 192, 74, 0.14);
    --dx-warning-solid:#E0A100;
    --dx-danger-fg:#FF8A80;
    --dx-danger-bg:rgba(255, 138, 128, 0.1);
    --dx-danger-solid:#E5484D;
    --dx-info-fg:#8C9CFF;
    --dx-info-bg:rgba(112, 136, 255, 0.14);
    --dx-data-1:#7088FF;
    --dx-data-2:#6CC7FF;
    --dx-data-3:#C3A9FF;
    --dx-data-4:#F0C04A;
    --dx-data-5:#6FD08C;
    --dx-data-grid:#1A1A20;
    --dx-shadow-none:none;
    --dx-shadow-ring:inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    --dx-shadow-raised:0 0 0 1px rgba(255, 255, 255, 0.06), 0 18px 40px -20px rgba(0, 0, 0, 0.9);
    --dx-shadow-overlay:0 0 0 1px rgba(255, 255, 255, 0.16), 0 24px 60px -20px rgba(0, 0, 0, 0.75);
    --dx-shadow-modal:0 0 0 1px rgba(255, 255, 255, 0.1), 0 40px 80px -24px rgba(0, 0, 0, 0.9)
  }
}
/* Migration aliases: the names the portal and site used before v1. Remove once nothing reads them. */
:root,.dk,.ltz,.dkz,[data-theme] {
  --bg: var(--dx-bg-canvas);
  --s1: var(--dx-bg-surface);
  --s2: var(--dx-bg-raised);
  --s3: var(--dx-bg-sunken);
  --ink: var(--dx-text-primary);
  --ink2: var(--dx-text-secondary);
  --mut: var(--dx-text-tertiary);
  --soft: var(--dx-text-tertiary);
  --line: var(--dx-border-subtle);
  --line2: var(--dx-border-default);
  --ok: var(--dx-success-fg);
  --okbg: var(--dx-success-bg);
  --bad: var(--dx-danger-fg);
  --badbg: var(--dx-danger-bg);
  --acc: var(--dx-accent-default);
  --ser: var(--dx-data-1);
  --sera: var(--dx-accent-subtle);
  --grid: var(--dx-data-grid);
  --tip: var(--dx-bg-inverse);
  --tipi: var(--dx-text-inverse);
  --sh: var(--dx-shadow-raised);
}