/**** Ansai Design Tokens v2 — Light theme (default/law). Page #F5F8FC, panels #FFFFFF. ****/
:root {
  color-scheme: light;

  /* Color — base surfaces */
  --bg: #F5F8FC;
  --color-bg: #F5F8FC;
  --surface: #FFFFFF;
  --color-surface: #FFFFFF;
  --surface-raised: #FFFFFF;
  --color-surface-raised: #FFFFFF;

  /* Color — ink */
  --ink: #0D1B2A;
  --color-ink: #0D1B2A;
  --ink-muted: #4A5F75;
  --color-ink-muted: #4A5F75;
  --ink-faint: #627791;
  --color-ink-faint: #627791;

  /* Color — azure primary */
  --azure-light: #38BDF8;
  --color-azure-light: #38BDF8;
  --azure: #38BDF8;
  --color-azure: #38BDF8;
  --azure-dark: #2563EB;
  --color-azure-dark: #2563EB;
  --azure-darker: #1D4ED8;
  --color-azure-darker: #1D4ED8;
  --primary: #2563EB;
  --color-primary: #2563EB;
  --primary-hover: #1D4ED8;
  --color-primary-hover: #1D4ED8;
  --azure-bg: #E8F3FE;
  --color-azure-bg: #E8F3FE;

  /* Gradients — brand moments/headers only, not body UI */
  --gradient: linear-gradient(135deg, #38BDF8 0%, #2563EB 100%);
  --gradient-primary: linear-gradient(135deg, #38BDF8 0%, #2563EB 100%);
  --color-gradient: linear-gradient(135deg, #38BDF8 0%, #2563EB 100%);
  --gradient-azure: linear-gradient(135deg, #38BDF8 0%, #2563EB 100%);

  /* Color — gold (fills/borders with ink text; never gold text on white) */
  --gold: #F2C14E;
  --color-gold: #F2C14E;
  --gold-highlight: #FFD97A;
  --color-gold-highlight: #FFD97A;
  --gold-bg: #FFF7DC;
  --color-gold-bg: #FFF7DC;

  /* Color — iris (atmosphere only, never body UI) */
  --iris: #8B7CF6;
  --color-iris: #8B7CF6;
  --gradient-iris: linear-gradient(135deg, #38BDF8 0%, #8B7CF6 100%);

  /* Color — success / mint */
  --mint: #3ECF8E;
  --color-mint: #3ECF8E;
  --mint-ink: #17724C;
  --color-mint-ink: #17724C;
  --success: #3ECF8E;
  --color-success: #3ECF8E;
  --success-ink: #17724C;
  --success-bg: #DEF7EB;
  --color-success-bg: #DEF7EB;

  /* Color — danger */
  --danger: #C62F3B;
  --color-danger: #C62F3B;
  --danger-strong: #A3242E;
  --danger-bg: #FDECEC;
  --color-danger-bg: #FDECEC;

  /* Color — warning */
  --warning: #D97706;
  --color-warning: #D97706;
  --warning-strong: #92400E;
  --warning-bg: #FEF3C7;
  --color-warning-bg: #FEF3C7;

  /* Color — borders (blue-tinted) */
  --border: #D9E4F0;
  --color-border: #D9E4F0;
  --border-subtle: rgba(37, 80, 140, 0.14);
  --color-border-subtle: rgba(37, 80, 140, 0.14);
  --border-strong: #B9CCE2;
  --color-border-strong: #B9CCE2;

  /* Color — focus */
  --focus-ring: rgba(37, 99, 235, 0.4);
  --color-focus-ring: rgba(37, 99, 235, 0.4);

  /* Dark anchors (reference only — kit is LIGHT theme only) */
  --midnight: #05070D;
  --color-midnight: #05070D;
  --navy: #0B1220;
  --color-navy: #0B1220;

  /* Typography — font stack */
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --font-stack: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Typography — sizes (1.25 scale from 16px base) */
  --text-xs: 0.64rem;
  --text-sm: 0.8rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5625rem;
  --text-2xl: 1.9531rem;
  --text-3xl: 2.4414rem;

  /* Typography — line heights */
  --leading-tight: 1.25;
  --leading-snug: 1.375;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.625;

  /* Typography — weights */
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Typography — kicker tracking */
  --tracking-kicker: 0.12em;
  --letter-spacing-kicker: 0.12em;
  --kicker-spacing: 0.12em;

  /* Spacing — 4px base */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-11: 44px;
  --space-12: 48px;

  /* Radii */
  --radius-sm: 8px;
  --radius: 12px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 999px;

  /* Shadows — soft blue-tinted */
  --shadow-sm: 0 1px 2px rgba(37, 80, 140, 0.08), 0 1px 3px rgba(37, 80, 140, 0.06);
  --shadow-md: 0 4px 12px rgba(37, 80, 140, 0.1), 0 2px 4px rgba(37, 80, 140, 0.06);
  --shadow-lg: 0 12px 32px rgba(37, 80, 140, 0.14), 0 4px 12px rgba(37, 80, 140, 0.08);

  /* Z-index */
  --z-base: 0;
  --z-raised: 1;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
  --z-toast: 800;

  /* Transitions */
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Kit aliases (ui-kit.css vocabulary -> palette tokens) */
:root {
  --azure-strong: var(--azure-dark);        /* #2563EB */
  --ring: var(--focus-ring);
  --highlight: var(--gold-highlight);
  --gold-ink: #7A5A00;                       /* dark gold for text on light */
  --stack-gap: var(--space-4);
}