/* Public V1 appearance tokens, adapted from .design-v2/public/assets/shell.css.
 * Dark colors remain the literal fallbacks in their owning component files.
 * No OS color-scheme inference; only an explicit V1 browser preference selects light.
 */
:root { color-scheme: dark; }
:root[data-theme="light"] {
    color-scheme: light;
    --bg-dark: #f3f5f7;
    --card-bg: #fff;
    --accent-gold: #225f99;
    --text-main: #18232d;
    --text-light: #18232d;
    --text-muted: #57616a;
    --fh-ink: #18232d;
    --fh-muted: #57616a;
    --fh-accent: #225f99;
    --fh-surface: #fff;
    --fh-raised: #e9edf1;
    --fh-rule: #c7cfd6;
    --fh-control-border: #7b8792;
    --fh-accent-rule: #5281a8;
    --fh-action-ink: #0a0e12;
    --fh-success: #246b35;
    --fh-info: #225f99;
    --fh-danger: #a52b35;
    --fh-purple: #783db2;
    --fh-warning: #806018;
    --fh-warning-rule: #9c783c;
    --fh-orange: #9a4a13;
    --fh-chart-highlight: #8fc8ff;
    --fh-shadow: #18232d18;
    --fh-text-shadow: transparent;
}
/* The V2 moon/sun control, sized independently of V1's existing nav links. */
.fh-theme-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; flex: none; margin-left: 12px; padding: 8px;
    border: 1px solid transparent; border-radius: 4px;
    background: transparent; color: var(--accent-gold); cursor: pointer;
}
.fh-theme-toggle[hidden] { display: none; }
.fh-theme-toggle:hover { background: var(--fh-raised, #202428); border-color: var(--fh-control-border, #626a72); }
.fh-theme-toggle:focus-visible { outline: 2px solid var(--accent-gold); outline-offset: 3px; }
.fh-theme-toggle[aria-pressed="true"] { background: #e4f1ff; border-color: #5281a8; }
.fh-theme-toggle svg { display:block; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.fh-theme-toggle .fh-theme-sun { display: none; }
:root[data-theme="light"] .fh-theme-toggle .fh-theme-moon { display: none; }
:root[data-theme="light"] .fh-theme-toggle .fh-theme-sun { display: block; }
/* Explicit Light brand choice: original rating blue, with dark action text. */
:root[data-theme="light"] :is(.primary, .btn.primary, .btn-gold) { background: #8fc8ff; color: #0a0e12; }
:root[data-theme="light"] :is(button, input, select, textarea):focus-visible { outline: 2px solid #225f99; outline-offset: 3px; }
/* Original numeric rating hues stay on compact dark grounds. No recalculation or recoloring. */
:root[data-theme="light"] :is(.rating-red,.rating-orange,.rating-yellow,.rating-green,.rating-blue,.rating-purple,.wr-value,.wr-good,.wr-warm,.wr-muted) {
    background-color: #18232d; border-radius: 3px; box-shadow: 0 0 0 2px #18232d;
}
/* White game silhouettes retain their pixels and their small dark icon mount, as in V2. */
:root[data-theme="light"] :is(.ship-feature-icon,.ship-class-icon,.ship-type-icon,.hp-top-class img,.ship-badge-icon) {
    background-color: #18232d; border-radius: 4px;
}
/* Use the V2 light shell hierarchy, without changing any V1 geometry. */
:root[data-theme="light"] .main-nav { background: rgba(243,245,247,.97); }
:root[data-theme="light"] footer { background-color: #e9edf1; }
:root[data-theme="light"] :is(input, select, textarea) { color-scheme: light; }
/* A readable blue title over the original photographic hero. */
:root[data-theme="light"] .hero-title-industrial {
    background: none; -webkit-text-fill-color: #225f99; color: #225f99; text-shadow: none;
}
@media (prefers-contrast: more) {
    :root[data-theme="light"] { --text-muted:#35434f; --fh-muted:#35434f; --fh-rule:#667582; --fh-control-border:#53616d; }
}
@media (forced-colors: active) {
    .fh-theme-toggle { border: 1px solid ButtonText; }
}

:root[data-theme="light"] {
    --fh-surface-0: rgba(243,245,247,0);
    --fh-surface-2: rgba(243,245,247,0.02);
    --fh-surface-4: rgba(243,245,247,0.04);
    --fh-surface-6: rgba(243,245,247,0.06);
    --fh-surface-8: rgba(243,245,247,0.08);
    --fh-surface-10: rgba(243,245,247,0.1);
    --fh-surface-18: rgba(243,245,247,0.18);
    --fh-surface-20: rgba(243,245,247,0.2);
    --fh-surface-25: rgba(243,245,247,0.25);
    --fh-surface-30: rgba(243,245,247,0.3);
    --fh-surface-35: rgba(243,245,247,0.35);
    --fh-surface-48: rgba(243,245,247,0.48);
    --fh-surface-55: rgba(243,245,247,0.55);
    --fh-surface-62: rgba(243,245,247,0.62);
    --fh-surface-70: rgba(243,245,247,0.7);
    --fh-surface-72: rgba(243,245,247,0.72);
    --fh-surface-78: rgba(243,245,247,0.78);
    --fh-surface-82: rgba(243,245,247,0.82);
    --fh-surface-85: rgba(243,245,247,0.85);
    --fh-surface-92: rgba(243,245,247,0.92);
    --fh-surface-96: rgba(243,245,247,0.96);
    --fh-surface-100: rgba(243,245,247,1);
}

/* Translucent radar area leaves the grid readable; label halos match the card. */
:root[data-theme="light"] { --fh-chart-area: rgba(34,95,153,.14); }
:root[data-theme="light"] .player-radar-area { filter: none; }
:root[data-theme="light"] .image-lightbox { --accent-gold: #c5a059; }

:root[data-theme="light"] { --fh-chart-reference:#57616a; --fh-chart-reference-area:rgba(87,97,106,.06); }
:root[data-theme="light"] .ship-meta-radar-area-player { filter: none; }
/* Keep numeric rating mounts compact inside the existing metric cells. */
:root[data-theme="light"] .ship-stats strong:is(.rating-red,.rating-orange,.rating-yellow,.rating-green,.rating-blue,.rating-purple) { width:fit-content; max-width:100%; }

/* Baby-blue accent washes; Dark retains the original gold fallbacks. */
:root[data-theme="light"] {
    --fh-accent-tint-4: rgba(143,200,255,0.04);
    --fh-accent-tint-5: rgba(143,200,255,0.05);
    --fh-accent-tint-6: rgba(143,200,255,0.06);
    --fh-accent-tint-7: rgba(143,200,255,0.07);
    --fh-accent-tint-8: rgba(143,200,255,0.08);
    --fh-accent-tint-9: rgba(143,200,255,0.09);
    --fh-accent-tint-10: rgba(143,200,255,0.1);
    --fh-accent-tint-11: rgba(143,200,255,0.11);
    --fh-accent-tint-12: rgba(143,200,255,0.12);
    --fh-accent-tint-13: rgba(143,200,255,0.13);
    --fh-accent-tint-14: rgba(143,200,255,0.14);
    --fh-accent-tint-16: rgba(143,200,255,0.16);
    --fh-accent-tint-18: rgba(143,200,255,0.18);
    --fh-accent-tint-20: rgba(143,200,255,0.2);
    --fh-accent-tint-22: rgba(143,200,255,0.22);
    --fh-accent-tint-24: rgba(143,200,255,0.24);
    --fh-accent-tint-25: rgba(143,200,255,0.25);
    --fh-accent-tint-28: rgba(143,200,255,0.28);
    --fh-accent-tint-30: rgba(143,200,255,0.3);
    --fh-accent-tint-35: rgba(143,200,255,0.35);
    --fh-accent-tint-38: rgba(143,200,255,0.38);
    --fh-accent-tint-40: rgba(143,200,255,0.4);
    --fh-accent-tint-45: rgba(143,200,255,0.45);
    --fh-accent-tint-48: rgba(143,200,255,0.48);
    --fh-accent-tint-50: rgba(143,200,255,0.5);
    --fh-accent-tint-80: rgba(143,200,255,0.8);
    --fh-accent-tint-90: rgba(143,200,255,0.9);
}