:root {
  --color-page: #eef4f8; --color-shell: #f9fcff; --color-surface: #ffffff; --color-surface-soft: #edf5fb;
  --color-surface-blue: #e4f1fa; --color-line: #bfd0dc; --color-line-soft: rgba(73,112,140,.18);
  --color-text: #19344a; --color-text-soft: #496274; --color-text-muted: #607687;
  --color-blue: #2777ad; --color-blue-deep: #1f5f8d; --color-blue-light: #8bc8ed; --color-blue-pale: #e6f4fc;
  --color-silver: #dce5eb; --color-silver-strong: #aebfcb; --color-success: #2f7b5a; --color-warning: #9a6814; --color-error: #b33a35;
  --focus-ring: 0 0 0 3px rgba(39,119,173,.25); --font-family-base: "Segoe UI", Inter, system-ui, sans-serif;
  --font-size-body: 1rem; --line-height: 1.55; --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.4rem; --space-6:2rem; --space-7:2.8rem;
  --radius-sm:6px; --radius-md:9px; --radius-lg:13px; --shadow-shell:0 18px 55px rgba(32,71,98,.17); --shadow-soft:0 8px 22px rgba(35,78,108,.09); --shadow-button:0 3px 8px rgba(34,80,112,.16);
  --button-radius:7px; --button-secondary-border:#9db8ca; --button-secondary-background:linear-gradient(180deg, #fff, #e8f1f7); --button-secondary-color:var(--color-blue-deep);
  --content-width:1180px; --shell-width:1280px; --z-header:100; --z-dropdown:180; --z-overlay:240; --z-sidebar:260;
}

html[data-theme="dark"] {
  --color-page: #0d2638;
  --color-shell: #14354b;
  --color-surface: #173d56;
  --color-surface-soft: #1d4862;
  --color-surface-blue: #245873;
  --color-line: #4d7892;
  --color-line-soft: rgba(170, 208, 232, 0.18);
  --color-text: #edf7fc;
  --color-text-soft: #c4dce9;
  --color-text-muted: #9ebdcd;
  --color-blue: #8bc8ed;
  --color-blue-deep: #b7ddf4;
  --color-blue-light: #8bc8ed;
  --color-blue-pale: #234f68;
  --color-silver: #8aa7b8;
  --color-silver-strong: #b4c9d5;
  --shadow-shell: 0 18px 55px rgba(0, 10, 18, 0.36);
  --shadow-soft: 0 8px 22px rgba(0, 12, 22, 0.24);
  --shadow-button: 0 3px 8px rgba(0, 12, 22, 0.25);
  --button-secondary-border: var(--color-line);
  --button-secondary-background: var(--color-surface-soft);
  --button-secondary-color: var(--color-text);
}
