:root {
    /* Typography */
    --font-sans: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont,
        sans-serif;

    /* Resolved tenant brand (set on :root by tenant-branding-styles before this file) */
    --brand-primary: var(--artemis-primary, #881337);
    --brand-primary-hover: var(--primary-hover, color-mix(in srgb, var(--brand-primary) 85%, black));
    --brand-primary-muted: var(--primary-muted, color-mix(in srgb, var(--brand-primary) 12%, transparent));

    /* Brand — Trojan defaults; tenant :root injects --artemis-primary first */
    --primary-color: var(--artemis-primary, #881337);
    --primary-hover: color-mix(in srgb, var(--artemis-primary, #881337) 85%, black);
    --primary-muted: color-mix(in srgb, var(--artemis-primary, #881337) 12%, transparent);
    --accent-gradient: linear-gradient(
        135deg,
        color-mix(in srgb, var(--artemis-primary, #881337) 90%, white) 0%,
        color-mix(in srgb, var(--artemis-primary, #881337) 85%, black) 100%
    );

    /* Neutrals — light UI */
    --color-ink: #0f172a;
    --color-ink-muted: #475569;
    --color-ink-subtle: #64748b;
    --color-border: #e2e8f0;
    --color-border-strong: #cbd5e1;
    --surface-page: #f1f5f9;
    --surface-elevated: #ffffff;
    --surface-muted: #f8fafc;

    /* Legacy aliases (used across existing rules) */
    --primary-text-color: #f8fafc;
    --secondary-text-color: #94a3b8;
    --border-color: #64748b;
    --nav-text-color: #475569;
    --dashboard-cards-title-color: #334155;
    --main-nav-text-color: #475569;
    --activeTab-light-color: #ffffff;
    --active-main-nav-bg-color: #1e293b;
    --activeTab-color: var(--artemis-primary, #881337);
    --activeTab-background-color: color-mix(in srgb, var(--artemis-primary, #881337) 12%, transparent);
    --search-btn-text-color: #0f172a;
    --normal-btn-color: #0f172a;
    --card-background-color: #1e293b;
    --card-background-color-light: #ffffff;
    --secondary-btn-border-color: #e2e8f0;
    --secondary-text-light-color: #475569;
    --selected-swimmer-border-color: #cbd5e1;
    --date-color: #64748b;
    --secondary-btn-bg-color: #f8fafc;
    --black: #0f172a;
    --background-modal-swimmer-profile: #1e293b;
    --white: #ffffff;
    --golden: var(--artemis-primary, #881337);
    --background-color: #0f172a;

    /* Chrome (legacy page nav; app shell uses header-* below) */
    --nav-chrome-bg: rgba(255, 255, 255, 0.88);
    --nav-chrome-blur: 14px;
    --nav-border: rgba(15, 23, 42, 0.08);
    --nav-shadow: 0 1px 0 var(--nav-border);

    /* App header — dark chrome (body may be light or dark) */
    --header-chrome-bg: #0f172a;
    --header-subnav-bg: #020617;
    --header-border: rgba(148, 163, 184, 0.18);
    --header-border-soft: rgba(148, 163, 184, 0.1);
    --header-link: rgba(226, 232, 240, 0.92);
    --header-link-muted: rgba(148, 163, 184, 0.98);
    --header-link-hover: #f8fafc;
    --header-link-hover-bg: rgba(255, 255, 255, 0.08);
    --header-meta-bg: rgba(30, 41, 59, 0.85);
    --header-toggler-bg: rgba(15, 23, 42, 0.65);
    --header-focus-ring: 0 0 0 3px color-mix(in srgb, var(--artemis-primary, #881337) 45%, transparent);

    /* Radii & depth — borders first; shadows kept minimal / tight */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 1px 3px rgba(15, 23, 42, 0.06);
    --shadow-lg: 0 2px 6px rgba(15, 23, 42, 0.07);
    --ring-focus: 0 0 0 3px color-mix(in srgb, var(--artemis-primary, #881337) 25%, transparent);

    --nav-pill-active-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
    --app-header-height: 3.75rem;

    /* Font scale */
    --main-heading-size: 1.625rem;
    --primary-btn-text-size: 0.875rem;
    --fggh: 14px;

    --normal: 400;
    --med: 500;
    --semi: 600;
    --bold: 700;
}