:root {
  --color-accent:          #fd2c5e;
  --color-accent-hover:    #ff527b;
  --color-accent-active:   #e01e4d;
  --color-accent-soft:     rgba(253, 44, 94, 0.10);
  --color-accent-ring:     rgba(253, 44, 94, 0.22);
  --color-navy:            #00182e;
  --color-chart-current:      var(--color-accent);
  --color-chart-current-fill: var(--color-accent-soft);
  --color-chart-compare:      #00182e;
  --color-chart-grid:         rgba(0, 0, 0, 0.06);

  --color-bg:              #f5f5f5;
  --color-surface:         #ffffff;
  --color-surface-alt:     #fafafa;
  --color-surface-sunken:  #f0f1f3;
  --color-surface-hover:   #fbfbfc;
  --color-surface-sub-1:   #fbfbfc;
  --color-surface-sub-2:   #f6f6f8;
  --color-surface-sub-3:   #f1f1f4;

  --color-border:          #e5e5e5;
  --color-border-light:    #f0f0f0;
  --color-border-strong:   #d4d4d4;

  --color-text:            #1a1a1a;
  --color-text-muted:      #666666;
  --color-text-subtle:     #999999;
  --color-text-faint:      #aaaaaa;
  --color-text-on-accent:  #ffffff;

  --color-overlay-scrim:   rgba(0, 0, 0, 0.55);
  --color-scroll-shade:    rgba(0, 0, 0, 0.16);

  --color-topbar:          #00182e;
  --color-topbar-surface:  #00223f;
  --color-topbar-text:     #ffffff;
  --color-topbar-border:   rgba(255, 255, 255, 0.10);
  --color-topbar-border-strong: rgba(255, 255, 255, 0.25);

  --color-success:         #059669;
  --color-success-soft:    #ecfdf5;
  --color-error:           #dc2626;
  --color-error-soft:      #fef2f2;
  --color-warning:         #d97706;
  --color-info:            #0284c7;

  --font-sans:  "Sora", system-ui, -apple-system, sans-serif;
  --font-display: "Jesaya", "Sora", system-ui, sans-serif;
  --font-mono:  "Azeret Mono", ui-monospace, "SFMono-Regular", monospace;

  --text-xs:    11px;
  --text-sm:    13px;
  --text-base:  14px;
  --text-md:    16px;
  --text-lg:    18px;
  --text-xl:    22px;
  --text-2xl:   28px;
  --text-input-min: 0px;

  --weight-normal:   400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-extra:    800;

  --space-hair: 2px;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;

  --icon-xs: 10px;
  --icon-sm: 12px;
  --icon-md: 14px;
  --icon-lg: 16px;
  --icon-xl: 20px;
  --indent-step: 18px;

  --space-section: var(--space-8);
  --space-note:    var(--space-3);
  --space-grid:    var(--space-4);
  --space-stack:   var(--space-3);
  --space-toolbar: var(--space-4);
  --space-label:   var(--space-1);
  --space-field:   var(--space-4);
  --space-check:   var(--space-2);
  --space-label-inline: var(--space-2);
  --space-gutter:  var(--space-8);
  --space-card:    var(--space-5);
  --space-card-gap: var(--space-3);
  --space-card-stack: var(--space-4);
  --cell-pad-x:    var(--space-4);

  --field-inline:  12.5rem;
  --field-inline-sm: 8.5rem;
  --field-label:   9.375rem;

  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-lg:   16px;
  --radius-pill: 999px;

  --control-h:          36px;
  --control-h-sm:       28px;
  --control-h-touch:    40px;
  --control-h-touch-sm: 32px;
  --control-check:      16px;

  --shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md:  0 4px 12px rgba(0, 0, 0, 0.06);
  --shadow-lg:  0 12px 32px rgba(0, 0, 0, 0.10);
  --shadow-accent: 0 6px 18px rgba(253, 44, 94, 0.18);
  --shadow-accent-sm: 0 2px 8px var(--color-accent-soft);
  --shadow-accent-md: 0 4px 12px var(--color-accent-soft);
  --ring-focus:       0 0 0 3px var(--color-accent-ring);

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:    120ms;

  --sidebar-width:   256px;
  --chart-h:         clamp(220px, 40vh, 340px);
  --content-max:     1400px;
  --content-narrow:  54rem;
  --z-base:    1;
  --z-dropdown: 100;
  --z-modal:   300;
  --z-tip:     350;
  --spot-color: var(--color-accent-soft);
  --spot-size: 24rem;
}

@media (pointer: coarse) {
  :root {
    --text-input-min: var(--text-md);
  }
}

@media (max-width: 768px) {
  :root {
    --space-section: var(--space-6);
    --space-grid:    var(--space-3);
    --space-gutter:  var(--space-4);
    --space-card:    var(--space-4);
    --cell-pad-x:    var(--space-3);
  }
}