:root {
    /* ---- Color: named palette ---- */
    --sky-deep: #1B3A6B;
    /* base of the gradient sky, dusk-toward-day */
    --sky-mid: #3E72B8;
    --sky-bright: #7FB8F0;
    /* horizon light */
    --sun-glow: #ffbb56;
    /* sunrise/sunset accent, warm instrument light */
    --panel-glass: rgba(255, 255, 255, 0.46);
    --panel-glass-strong: rgba(255, 255, 255, 0.68);
    --panel-border: rgba(255, 255, 255, 0.55);
    --ink: #142240;
    /* primary text, deep navy not black */
    --ink-soft: #4B5A7A;
    /* secondary text */
    --ink-faint: #7C8AA8;
    --danger: #C0432F;
    --danger-bg: rgba(192, 67, 47, 0.12);
    --success: #2F8F6F;

    /* ---- Typography ---- */
    --font-display: "Outfit", "Segoe UI", sans-serif;
    /* headings, temperature */
    --font-body: "Inter", "Segoe UI", sans-serif;
    /* body copy, labels */
    --font-mono: "JetBrains Mono", "Consolas", monospace;
    /* readout numerals */

    --fs-temp: clamp(3.2rem, 7vw, 5.5rem);
    --fs-h1: clamp(1.3rem, 2vw, 1.7rem);
    --fs-h2: 1.05rem;
    --fs-body: 0.95rem;
    --fs-small: 0.8rem;
    --fs-mono-md: 1rem;
    --fs-mono-lg: 1.4rem;

    /* ---- Spacing scale ---- */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 24px;
    --sp-6: 32px;
    --sp-7: 48px;

    /* ---- Radius / shadow / blur ---- */
    --radius-lg: 22px;
    --radius-md: 16px;
    --radius-sm: 10px;
    --shadow-panel: 0 8px 32px rgba(20, 34, 64, 0.18);
    --shadow-soft: 0 4px 14px rgba(20, 34, 64, 0.10);
    --blur-glass: 18px;

    /* ---- Motion ---- */
    --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
    --dur-fast: 150ms;
    --dur-med: 300ms;
    --dur-slow: 550ms;
}