:root {
  color-scheme: light;
  --color-background: #f8f3e9;
  --color-surface: #fffdf8;
  --color-surface-elevated: #fff;
  --color-surface-subtle: #eaf3f5;
  --color-surface-warm: #efe5d4;
  --color-surface-sun: #fff1b8;
  --color-text: #173040;
  --color-text-muted: #526975;
  --color-border: #ccd9db;
  --color-border-strong: #9fb5ba;
  --color-primary: #0b476e;
  --color-primary-hover: #09618f;
  --color-primary-contrast: #fff;
  --color-accent-yellow: #e4c91f;
  --color-accent-blue: #2a82aa;
  --color-success: #176b4b;
  --color-success-surface: #e5f3eb;
  --color-warning: #6f5800;
  --color-warning-surface: #fff2bc;
  --color-danger: #99333d;
  --color-danger-surface: #fbe9e9;
  --color-info: #155f8b;
  --color-info-surface: #e5f2f8;
  --gradient-hero: linear-gradient(132deg, #f8f3e9 0%, #edf4f2 58%, #f6e8b9 100%);
  --gradient-deep: linear-gradient(138deg, #0d2e44 0%, #164f69 67%, #327c8e 100%);
  --gradient-warm: linear-gradient(135deg, #fff8e5 0%, #f3e5be 100%);
  --font-family-body: Aptos, "Segoe UI", system-ui, sans-serif;
  --font-family-heading: Aptos, "Segoe UI", system-ui, sans-serif;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6.5rem;
  --space-10: 9rem;
  --density-card-padding: 1rem;
  --density-section-gap: 1.25rem;
  --density-control-height: 2.7rem;
  --radius-small: .5rem;
  --radius-medium: .8rem;
  --radius-large: 1.75rem;
  --shadow-small: 0 .5rem 1.5rem rgb(19 54 73 / .1);
  --shadow-medium: 0 1.5rem 4rem rgb(19 54 73 / .16);
  --glass-edge-top: rgb(255 255 255 / .96);
  --glass-edge-side: color-mix(in srgb, var(--color-accent-blue) 38%, var(--color-border));
  --glass-edge-low: color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
  --glass-card-shadow: inset 0 1px 0 var(--glass-edge-top), inset 1px 0 0 rgb(255 255 255 / .52), inset -1px 0 0 var(--glass-edge-side), inset 0 -1px 0 var(--glass-edge-low), 0 .9rem 2.4rem rgb(19 54 73 / .11);
  --glass-card-shadow-quiet: inset 0 1px 0 rgb(255 255 255 / .76), inset 1px 0 0 rgb(255 255 255 / .34), inset -1px 0 0 var(--glass-edge-side), inset 0 -1px 0 var(--glass-edge-low), 0 .45rem 1.3rem rgb(19 54 73 / .07);
  --glass-button-shadow: inset 0 1px 0 rgb(255 255 255 / .46), inset 1px 0 0 rgb(255 255 255 / .22), inset -1px 0 0 rgb(7 35 52 / .2), inset 0 -1px 0 rgb(7 35 52 / .26), 0 .4rem 1rem rgb(19 54 73 / .14);
  --content-width: 78rem;
  --content-narrow: 47rem;
  --header-height: 4.75rem;
  --focus-ring: 0 0 0 .18rem var(--color-background), 0 0 0 .38rem #4ca4c9;
  --motion-duration-fast: 160ms;
  --motion-duration-normal: 240ms;
  --motion-duration-slow: 650ms;
  --motion-ease-standard: cubic-bezier(.2, .8, .2, 1);
  --motion-ease-enter: cubic-bezier(.16, 1, .3, 1);
  --motion-ease-exit: cubic-bezier(.4, 0, 1, 1);
  --motion-distance-small: .5rem;
  --motion-distance-medium: 1.25rem;
  --motion-distance-large: 2.5rem;
}

[data-theme="dark"] {
  color-scheme: dark;
  --color-background: #0d1b25;
  --color-surface: #132733;
  --color-surface-elevated: #19313d;
  --color-surface-subtle: #193943;
  --color-surface-warm: #302e2b;
  --color-surface-sun: #413b20;
  --color-text: #f0f3ef;
  --color-text-muted: #b9c7c8;
  --color-border: #37505a;
  --color-border-strong: #5c737a;
  --color-primary: #80c1df;
  --color-primary-hover: #aad9eb;
  --color-primary-contrast: #102735;
  --color-accent-yellow: #dec95f;
  --color-accent-blue: #67b1d2;
  --color-success: #8bd8b2;
  --color-success-surface: #173b30;
  --color-warning: #ead783;
  --color-warning-surface: #3c351c;
  --color-danger: #f2a4aa;
  --color-danger-surface: #47262b;
  --color-info: #9bd3eb;
  --color-info-surface: #173744;
  --gradient-hero: linear-gradient(132deg, #0d1b25 0%, #15303d 62%, #34361f 100%);
  --gradient-deep: linear-gradient(138deg, #091721 0%, #123849 67%, #285c68 100%);
  --gradient-warm: linear-gradient(135deg, #282b27 0%, #3b351e 100%);
  --shadow-small: 0 .5rem 1.5rem rgb(0 0 0 / .24);
  --shadow-medium: 0 1.5rem 4rem rgb(0 0 0 / .34);
  --glass-edge-top: rgb(226 246 252 / .54);
  --glass-edge-side: color-mix(in srgb, var(--color-accent-blue) 54%, var(--color-border));
  --glass-edge-low: color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
  --glass-card-shadow: inset 0 1px 0 var(--glass-edge-top), inset 1px 0 0 rgb(181 224 238 / .2), inset -1px 0 0 var(--glass-edge-side), inset 0 -1px 0 var(--glass-edge-low), 0 1rem 2.7rem rgb(0 0 0 / .28);
  --glass-card-shadow-quiet: inset 0 1px 0 rgb(226 246 252 / .34), inset 1px 0 0 rgb(181 224 238 / .13), inset -1px 0 0 var(--glass-edge-side), inset 0 -1px 0 var(--glass-edge-low), 0 .5rem 1.4rem rgb(0 0 0 / .2);
  --glass-button-shadow: inset 0 1px 0 rgb(255 255 255 / .34), inset 1px 0 0 rgb(255 255 255 / .14), inset -1px 0 0 rgb(4 18 27 / .34), inset 0 -1px 0 rgb(4 18 27 / .42), 0 .45rem 1.1rem rgb(0 0 0 / .28);
}

@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    color-scheme: dark;
    --color-background: #0d1b25; --color-surface: #132733; --color-surface-elevated: #19313d; --color-surface-subtle: #193943; --color-surface-warm: #302e2b; --color-surface-sun: #413b20;
    --color-text: #f0f3ef; --color-text-muted: #b9c7c8; --color-border: #37505a; --color-border-strong: #5c737a; --color-primary: #80c1df; --color-primary-hover: #aad9eb; --color-primary-contrast: #102735;
    --color-accent-yellow: #dec95f; --color-accent-blue: #67b1d2; --color-success: #8bd8b2; --color-success-surface: #173b30; --color-warning: #ead783; --color-warning-surface: #3c351c; --color-danger: #f2a4aa; --color-danger-surface: #47262b; --color-info: #9bd3eb; --color-info-surface: #173744;
    --gradient-hero: linear-gradient(132deg, #0d1b25 0%, #15303d 62%, #34361f 100%); --gradient-deep: linear-gradient(138deg, #091721 0%, #123849 67%, #285c68 100%); --gradient-warm: linear-gradient(135deg, #282b27 0%, #3b351e 100%); --shadow-small: 0 .5rem 1.5rem rgb(0 0 0 / .24); --shadow-medium: 0 1.5rem 4rem rgb(0 0 0 / .34);
    --glass-edge-top: rgb(226 246 252 / .54); --glass-edge-side: color-mix(in srgb, var(--color-accent-blue) 54%, var(--color-border)); --glass-edge-low: color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
    --glass-card-shadow: inset 0 1px 0 var(--glass-edge-top), inset 1px 0 0 rgb(181 224 238 / .2), inset -1px 0 0 var(--glass-edge-side), inset 0 -1px 0 var(--glass-edge-low), 0 1rem 2.7rem rgb(0 0 0 / .28); --glass-card-shadow-quiet: inset 0 1px 0 rgb(226 246 252 / .34), inset 1px 0 0 rgb(181 224 238 / .13), inset -1px 0 0 var(--glass-edge-side), inset 0 -1px 0 var(--glass-edge-low), 0 .5rem 1.4rem rgb(0 0 0 / .2); --glass-button-shadow: inset 0 1px 0 rgb(255 255 255 / .34), inset 1px 0 0 rgb(255 255 255 / .14), inset -1px 0 0 rgb(4 18 27 / .34), inset 0 -1px 0 rgb(4 18 27 / .42), 0 .45rem 1.1rem rgb(0 0 0 / .28);
  }
}