/* Breezely design tokens — default static palette only. */
:root {
    /* Typography */
    --font-family-base: "Ubuntu", sans-serif;
    --font-family-system: system-ui, -apple-system, sans-serif;
    --font-family-fallback: sans-serif;
    --font-size-root: 16px;
    --font-size-xs: 0.85rem;
    --font-size-sm: 0.95rem;
    --font-size-base: 1rem;
    --font-size-md: 1.1rem;
    --font-size-lg: 1.2rem;
    --font-size-xl: 1.5rem;
    --font-size-2xl: 1.75rem;
    --font-size-3xl: 2rem;
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --line-height-base: 1.55;

    /* Layout and spacing */
    --header-height: 96px;
    --layout-width: 95%;
    --space-1: 4px;
    --space-2: 5px;
    --space-3: 8px;
    --space-4: 10px;
    --space-5: 12px;
    --space-6: 15px;
    --space-7: 20px;
    --space-8: 25px;
    --space-9: 30px;
    --space-10: 35px;
    --space-11: 40px;
    --space-12: 50px;

    /* Shape, elevation, and motion */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 15px;
    --radius-xl: 18px;
    --radius-pill: 25px;
    --radius-round: 50%;
    --border-width-thin: 1px;
    --border-width-medium: 1.5px;
    --border-width-thick: 2px;
    --shadow-focus: 0 0 0 4px rgba(30, 64, 175, 0.35);
    --shadow-floating: 0 15px 25px -5px rgba(0, 0, 0, 0.25), 0 -15px 25px -5px rgba(0, 0, 0, 0.25);
    --shadow-drawer: -5px 0 25px rgba(0, 0, 0, 0.15);
    --shadow-navbar: 0 8px 6px -6px rgba(0, 0, 0, 0.3);
    --transition-fast: 0.1s ease-in-out;
    --transition-base: 0.15s ease-in-out;
    --transition-medium: 0.2s ease-in-out;
    --transition-slow: 0.3s ease-in-out;

    /* Default Breezely palette — the future theme layer will override roles. */
    --color-white: #ffffff;
    --color-text-default: #000;
    --color-text-on-dark: var(--color-white);
    --color-text-muted: #676767;
    --color-text-secondary: #4a5568;
    --color-text-brand-muted: rgb(69 82 134);
    --color-text-footer-muted: rgb(238 243 252);
    --color-text-footer-soft: rgb(237 234 246);
    --color-text-footer-subtle: rgb(198 210 234);
    --color-surface-page: rgb(255, 250, 250);
    --color-surface-primary: var(--color-white);
    --color-surface-subtle: #f9fafb;
    --color-surface-muted: rgb(243, 241, 238);
    --color-surface-info: #E5F2FF;
    --color-surface-info-strong: rgb(217 238 253);
    --color-surface-search-hover: rgb(242, 208, 241);
    --color-surface-forecast: #f1f8fe;
    --color-surface-today: rgb(254 249 240);
    --color-surface-today-label: rgb(255 236 196);
    --color-surface-aqi: rgb(208, 230, 239);
    --color-surface-aqi-mobile: #faf4f4;
    --color-surface-success: rgb(204, 247, 204);
    --color-surface-message: rgb(235, 234, 225);
    --color-surface-danger: rgb(253, 228, 228);
    --color-surface-modal: rgb(235, 235, 250);
    --color-surface-settings: rgb(251 250 252);
    --color-surface-settings-selected: #F8F9FF;
    --color-surface-mobile-nav: rgb(246, 246, 246);
    --color-surface-mobile-content: rgb(244, 253, 253);
    --color-surface-hover: #f0f1f2;
    --color-surface-hover-soft: rgb(234, 235, 238);
    --color-surface-hover-muted: rgb(233, 233, 233);
    --color-surface-hover-cool: #eaeef4;
    --color-surface-hover-blue: #d8e0e8;
    --color-surface-particle-description: #dbdddf;
    --color-surface-hover-danger: rgb(244, 221, 221);
    --color-surface-clear-button: #f3f4f6;
    --color-surface-clear-button-hover: #e5e7eb;
    --color-border-strong: rgb(1, 1, 42);
    --color-border-default: rgb(120, 111, 111);
    --color-border-muted: rgb(176, 176, 176);
    --color-border-light: #d1d5db;
    --color-border-softer: rgb(231 235 245);
    --color-border-search: rgb(118, 118, 118);
    --color-border-input-hover: rgb(31, 41, 55);
    --color-border-dark: #000;
    --color-border-aqi: rgb(64, 63, 63);
    --color-border-divider: rgb(216 220 222);
    --color-border-saved: rgb(153 158 175);
    --color-border-danger: rgb(249 218 218);
    --color-border-radio: #C0C0C0;
    --color-accent: #3B66F5;
    --color-accent-dark: #1A3BB0;
    --color-accent-focus: #1e40af;
    --color-accent-hover: #7cb5ef;
    --color-accent-weather: rgb(31, 90, 249);
    --color-hero-fallback: #e0f2fe;
    --color-hero-start: #1b85e7;
    --color-hero-middle: #7eb8ff;
    --color-hero-end: #b3d7ff;
    --color-sunrise-start: #a805c9;
    --color-sunrise-end: #ffffff;
    --color-table: #1e3a8a;
    --color-footer: rgb(1 21 52);
    --color-footer-divider: rgb(6, 43, 98);
    --color-footer-heading: rgb(75 172 255);
    --color-status-good: rgb(132 226 138);
    --color-status-moderate: rgb(254 210 137);
    --color-status-moderate-text: rgb(139 87 4);
    --color-status-high: rgb(225, 111, 70);
    --color-status-sensitive: rgb(255, 184, 51);
    --color-status-unhealthy: rgb(243, 47, 47);
    --color-status-very-unhealthy: rgb(143, 2, 143);
    --color-status-hazardous: maroon;
    --color-status-unhealthy-text: rgb(253, 253, 253);
    --color-guide-good-border: rgb(154 192 147);
    --color-guide-good-bg: rgb(216 235 213);
    --color-guide-moderate-border: rgb(249 196 92);
    --color-guide-moderate-bg: rgb(251 233 171);
    --color-guide-sensitive-border: rgb(221 149 103);
    --color-guide-sensitive-bg: rgb(246 205 170);
    --color-guide-sensitive-text: rgb(161 52 11);
    --color-guide-unhealthy-border: rgb(215 104 109);
    --color-guide-unhealthy-bg: rgb(251 188 188);
    --color-guide-unhealthy-text: rgb(177 19 25);
    --color-guide-very-unhealthy-border: rgb(202 196 226);
    --color-guide-very-unhealthy-bg: rgb(235 230 244);
    --color-guide-very-unhealthy-text: rgb(85 57 134);
    --color-guide-hazardous-border: rgb(239 222 230);
    --color-guide-hazardous-bg: rgb(145 70 105);
    --color-guide-hazardous-text: rgb(238 220 229);
    --color-overlay: rgba(7, 7, 7, 0.721);
    --color-shadow: rgba(0, 0, 0, 0.25);
    --color-shadow-soft: rgba(0, 0, 0, 0.15);
    --color-shadow-navbar: rgba(0, 0, 0, 0.3);
    --color-shadow-weather-icon: rgba(0, 0, 0, 0.5);
    --color-shadow-icon-highlight: rgba(255, 255, 255, 0.4);
    --color-glow-sun: rgba(255, 200, 0, 0.6);
    --color-accent-focus-shadow: rgba(30, 64, 175, 0.35);
    --color-border-modal: #e0e0e0;
    --color-border-recent-search: rgb(18 18 18);
    --color-border-today: rgb(253 232 190);
    --color-danger-strong: rgb(242 35 19);
    --color-danger-text: rgb(202, 64, 64);
    --color-danger-warning: rgb(191, 3, 3);
    --color-footer-control: rgb(16 38 72);
    --color-guide-tagline: rgb(43 71 131);
    --color-shadow-danger: rgb(232, 218, 218);
    --color-shadow-subtle: rgba(0, 0, 0, 0.05);
    --color-status-aqi-moderate: rgb(253, 217, 151);
    --color-status-aqi-moderate-text: rgb(154, 101, 2);
    --color-sun: rgb(248, 161, 0);
    --color-sun-icon: rgb(199, 199, 34);
    --color-surface-danger-button: rgb(251 244 245);
    --color-surface-recent-search: rgb(245 245 245);
    --color-text-clear-button: #4b5563;
    --color-text-country: rgb(70 80 131);
    --color-text-dark: #111827;
    --color-text-legacy-muted: rgb(59, 58, 58);
    --color-text-modal-muted: rgb(81 91 111);
    --color-text-sun-timing: #1a2a3a;
}