/* Orym design tokens — extracted from v2.1.1 mockups (index.html canonical) */

:root {
    --font: 'Poppins', sans-serif;

    /* Orym Type Grid */
    --fs-h1: clamp(40px, 5.5vw, 72px);
    --fs-h2: clamp(28px, 3.2vw, 42px);
    --fs-h3: clamp(22px, 2.4vw, 32px);
    --fs-lead: clamp(18px, 1.6vw, 22px);
    --fs-body: 15px;
    --fs-small: 13px;
    --fs-label: 13px;
    --fs-data: 10px;
    --fs-data-xs: 9px;

    --teal-2: #0089B4;

    /* Page rhythm */
    --orym-page-max: 1280px;
    --orym-page-pad-x: 64px;
    --orym-page-pad-x-mid: 32px;
    --orym-page-pad-x-sm: 20px;
}

[data-theme="dark"] {
    --bg: #0f1c20;
    --bg-2: #16252A;
    --bg-panel: #1c2f36;
    --bg-lift: #1f333a;
    --fg: #FFFBF4;
    --fg-muted: rgba(255, 251, 244, 0.80);
    --fg-faint: rgba(255, 251, 244, 0.58);
    --hairline: rgba(255, 251, 244, 0.07);
    --teal-1: #1BA09B;
    --amber: #FFAC6B;
    --s-verified: #78BE41;
    --s-partial: #FFC107;
    --s-mismatch: #FF9800;
    --s-missing: #F44336;
    --nav-bg: rgba(15, 28, 32, 0.93);
    --radial: rgba(27, 160, 155, 0.06);
    --page-accent: #142a30;
    --scrollbar: #0f1c20;
}

[data-theme="light"] {
    --bg: #f0ece4;
    --bg-2: #FFFBF4;
    --bg-panel: #e8e4dc;
    --bg-lift: #ddd9d1;
    --fg: #16252A;
    --fg-muted: rgba(22, 37, 42, 0.82);
    --fg-faint: rgba(22, 37, 42, 0.55);
    --hairline: rgba(22, 37, 42, 0.10);
    --teal-1: #1490A0;
    --teal-2: #0E7585;
    --amber: #C47A2E;
    --s-verified: #3E8C36;
    --s-partial: #B8741A;
    --s-mismatch: #C46200;
    --s-missing: #B83030;
    --nav-bg: rgba(240, 236, 228, 0.96);
    --radial: rgba(27, 160, 155, 0.06);
    --page-accent: #FFFBF4;
    --scrollbar: #FFFBF4;
}

/* Status chip utilities (reference product.html) */
.orym-chip-verified,
.chip.green {
    background: rgba(120, 190, 65, 0.10);
    border: 1px solid rgba(120, 190, 65, 0.35);
    color: var(--s-verified);
}

.orym-chip-partial,
.chip.amber {
    background: rgba(255, 193, 7, 0.10);
    border: 1px solid rgba(255, 193, 7, 0.35);
    color: var(--s-partial);
}

.orym-chip-mismatch {
    background: rgba(255, 152, 0, 0.10);
    border: 1px solid rgba(255, 152, 0, 0.35);
    color: var(--s-mismatch);
}

.orym-chip-missing,
.chip.red {
    background: rgba(244, 67, 54, 0.10);
    border: 1px solid rgba(244, 67, 54, 0.35);
    color: var(--s-missing);
}

.orym-chip-teal,
.chip.teal {
    background: rgba(27, 160, 155, 0.10);
    border: 1px solid rgba(27, 160, 155, 0.35);
    color: var(--teal-1);
}

.orym-chip-ghost,
.chip.ghost {
    background: transparent;
    border: 1px solid var(--hairline);
    color: var(--fg-faint);
}

[data-theme="light"] .orym-chip-verified,
[data-theme="light"] .chip.green {
    background: rgba(62, 140, 54, 0.10);
    border-color: rgba(62, 140, 54, 0.35);
    color: #2E7A28;
}

[data-theme="light"] .orym-chip-teal,
[data-theme="light"] .chip.teal {
    background: rgba(20, 144, 160, 0.10);
    border-color: rgba(20, 144, 160, 0.35);
    color: var(--teal-1);
}

[data-theme="light"] .orym-chip-partial,
[data-theme="light"] .chip.amber {
    background: rgba(184, 116, 26, 0.10);
    border-color: rgba(184, 116, 26, 0.35);
    color: #B8741A;
}

[data-theme="light"] .orym-chip-missing,
[data-theme="light"] .chip.red {
    background: rgba(184, 48, 48, 0.10);
    border-color: rgba(184, 48, 48, 0.35);
    color: #B83030;
}

[data-theme="light"] .orym-chip-ghost,
[data-theme="light"] .chip.ghost {
    border-color: rgba(22, 37, 42, 0.18);
    color: rgba(22, 37, 42, 0.5);
}