/* Xpenstack design tokens: Calm Ledger, the only look for now.
   Light is the default. Dark follows the system setting unless data-theme="light"
   is set on <html>, and data-theme="dark" forces it. The two dark blocks must stay
   identical; tests/tokens.test.js checks this and every text/background pair
   against WCAG AA. A later look is only new value sets under :root[data-look="..."].
   Fonts are self-hosted from design/fonts/, never Google's CDN (see DESIGN-SYSTEM.md).
   Latin-ext is needed for Polish letters such as the ł in zł. */

@font-face { font-family: 'Nunito'; font-weight: 400; font-display: swap; src: url('fonts/nunito-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nunito'; font-weight: 400; font-display: swap; src: url('fonts/nunito-latin-ext-400-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nunito'; font-weight: 600; font-display: swap; src: url('fonts/nunito-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nunito'; font-weight: 600; font-display: swap; src: url('fonts/nunito-latin-ext-600-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nunito'; font-weight: 700; font-display: swap; src: url('fonts/nunito-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nunito'; font-weight: 700; font-display: swap; src: url('fonts/nunito-latin-ext-700-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nunito'; font-weight: 800; font-display: swap; src: url('fonts/nunito-latin-800-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nunito'; font-weight: 800; font-display: swap; src: url('fonts/nunito-latin-ext-800-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* Calm Ledger, light, plus shared scales */
:root {
  color-scheme: light;

  /* Colour */
  --color-bg: #F8FAFC;
  --color-surface: #FFFFFF;
  --color-text: #0F172A;
  --color-muted: #475569;
  --color-primary: #1E40AF;
  --color-on-primary: #FFFFFF;
  --color-primary-glow: #2557D6;
  --color-positive: #047857;
  --color-warning: #B45309;
  --color-danger: #B91C1C;
  --color-on-danger: #FFFFFF;
  --color-line: #E2E8F0;
  --color-border-strong: #64748B;
  --color-ring: #1E40AF;
  --color-muted-bg: #F1F5F9;
  --color-primary-soft: #DBEAFE;
  --color-raised: #FFFFFF;
  --color-hero-from: #2557D6;
  --color-hero-to: #172554;
  --color-on-hero: #FFFFFF;
  --color-on-hero-muted: #EFF6FF;

  /* Type */
  --font-head: 'Nunito', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Nunito', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --leading-body: 1.5;
  --leading-head: 1.2;
  --weight-regular: 400;
  --weight-bold: 700;
  --weight-head: 700;
  --weight-heavy: 800;

  /* Spacing (4px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --tap-min: 44px;

  /* Shape */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 1px 2px rgb(15 23 42 / 0.08);
  --shadow-md: 0 4px 12px rgb(15 23 42 / 0.10);
  --shadow-card: 0 1px 2px rgb(15 23 42 / 0.06), 0 8px 24px -12px rgb(15 23 42 / 0.14);

  /* Motion */
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --ease-out: cubic-bezier(0.2, 0, 0, 1);

  /* Frosted glass for bars and sheets: surface at this opacity plus blur. tokens.test.js checks labels
     still pass over solid text, the worst thing that can scroll behind. */
  --glass-opacity: 82%;
  --glass-blur: 16px;
  --hero-glass-opacity: 10%;
  --card-glass-opacity: 70%;
  --wash-blob-alpha: 10%;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-bg: #0B1220;
    --color-surface: #131C2E;
    --color-text: #F1F5F9;
    --color-muted: #94A3B8;
    --color-primary: #60A5FA;
    --color-on-primary: #0B1220;
    --color-primary-glow: #93C5FD;
    --color-positive: #34D399;
    --color-warning: #FBBF24;
    --color-danger: #F87171;
    --color-on-danger: #0B1220;
    --color-line: #24304A;
    --color-border-strong: #7C8BA1;
    --color-ring: #60A5FA;
    --color-muted-bg: #1B2638;
    --color-primary-soft: #172B4A;
    --color-raised: #172B4A;
    --color-hero-from: #1E40AF;
    --color-hero-to: #0B1630;
    --color-on-hero: #FFFFFF;
    --color-on-hero-muted: #DBEAFE;
    --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.40);
    --shadow-md: 0 4px 12px rgb(0 0 0 / 0.50);
    --shadow-card: 0 1px 2px rgb(0 0 0 / 0.40), 0 8px 24px -12px rgb(0 0 0 / 0.60);
    --glass-opacity: 88%;
    --hero-glass-opacity: 12%;
    --card-glass-opacity: 55%;
    --wash-blob-alpha: 16%;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #0B1220;
  --color-surface: #131C2E;
  --color-text: #F1F5F9;
  --color-muted: #94A3B8;
  --color-primary: #60A5FA;
  --color-on-primary: #0B1220;
  --color-primary-glow: #93C5FD;
  --color-positive: #34D399;
  --color-warning: #FBBF24;
  --color-danger: #F87171;
  --color-on-danger: #0B1220;
  --color-line: #24304A;
  --color-border-strong: #7C8BA1;
  --color-ring: #60A5FA;
  --color-muted-bg: #1B2638;
  --color-primary-soft: #172B4A;
  --color-raised: #172B4A;
  --color-hero-from: #1E40AF;
  --color-hero-to: #0B1630;
  --color-on-hero: #FFFFFF;
  --color-on-hero-muted: #DBEAFE;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.40);
  --shadow-md: 0 4px 12px rgb(0 0 0 / 0.50);
  --shadow-card: 0 1px 2px rgb(0 0 0 / 0.40), 0 8px 24px -12px rgb(0 0 0 / 0.60);
  --glass-opacity: 88%;
  --hero-glass-opacity: 12%;
  --card-glass-opacity: 55%;
  --wash-blob-alpha: 16%;
}

@media (prefers-reduced-motion: reduce) {
  :root { --duration-fast: 0ms; --duration-base: 0ms; }
}