:root {
    --ui-background: #f5f8ff;
    --ui-panel: #fff;
    --ui-text: #0b1026;
    --ui-muted: #606b8a;
    --ui-border: #dce5fa;
    --ui-link: #6d28d9;
    --ui-soft: #f2ecff;
    color-scheme: light;
}
:root[data-appearance="dark"] {
    --ui-background: #0b1026;
    --ui-panel: #151d35;
    --ui-text: #eaf2ff;
    --ui-muted: #acb9d5;
    --ui-border: #33415f;
    --ui-link: #c4a5ff;
    --ui-soft: #282040;
    --theme-surface: var(--ui-panel);
    --theme-text: var(--ui-text);
    color-scheme: dark;
}
.sighting-app { background: var(--ui-background); color: var(--ui-text); }
.sighting-app .site-header, .sighting-app .site-footer { background: #fff; color: var(--ui-text); border-color: var(--ui-border); }
[data-appearance="dark"] .site-header, [data-appearance="dark"] .site-footer { background: #0b1026; }
.site-nav a:not(.button):not(.nav-register), .account-menu, .account-dropdown button { color: var(--ui-text); }
.account-dropdown { background: var(--ui-panel); border-color: var(--ui-border); }
.account-dropdown form, .footer-bottom { border-color: var(--ui-border); }
.site-footer a, .information-page a { color: var(--ui-link); }
.footer-placeholder { color: var(--ui-muted); }
.footer-socials > * { border-color: var(--ui-border); }
.footer-socials > span { color: var(--ui-muted); background: var(--ui-panel); }
.policy-draft { background: var(--ui-soft); }
 .profile-appearance { margin-block: 28px; }
.profile-appearance[hidden] { display: none; }
.appearance-options { display: flex; gap: 10px; }
.appearance-options button { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 10px; background: var(--ui-panel); color: var(--ui-text); border: 2px solid var(--ui-border); border-radius: 10px; cursor: pointer; }
.appearance-options svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.appearance-options button[aria-pressed="true"] { background: var(--ui-soft); color: var(--ui-link); border-color: var(--ui-link); }
.appearance-options button:focus-visible { outline: 2px solid var(--brand-violet); outline-offset: 3px; }
[data-appearance="dark"] .hero:not(.hero-with-background) { background: linear-gradient(120deg, #151d35, #172747 50%, #302047); }
[data-appearance="dark"] .hero:not(.hero-with-background) p { color: var(--ui-muted); }
[data-appearance="dark"] .hero .search-form input { background: var(--ui-panel); color: var(--ui-text); border-color: var(--ui-border); }
[data-appearance="dark"] .celebrity-card, [data-appearance="dark"] .auth-card { background: var(--ui-panel); border-color: var(--ui-border); color: var(--ui-text); }
[data-appearance="dark"] .celebrity-card h3 a { color: var(--ui-text); }
[data-appearance="dark"] .celebrity-card p, [data-appearance="dark"] .card-source, [data-appearance="dark"] .auth-card .helptext, [data-appearance="dark"] .auth-card ul { color: var(--ui-muted); }
[data-appearance="dark"] .celebrity-card .category { color: var(--ui-link); }
[data-appearance="dark"] .view-all, [data-appearance="dark"] .carousel-arrow { background: var(--ui-soft); color: var(--ui-link); border-color: var(--ui-border); }
[data-appearance="dark"] .auth-card input { background: var(--ui-background); color: var(--ui-text); border-color: var(--ui-border); }
[data-appearance="dark"] .auth-card a, [data-appearance="dark"] .account-page a:not(.button) { color: var(--ui-link); }
[data-appearance="dark"] .account-dropdown a:hover, [data-appearance="dark"] .account-dropdown button:hover { background: var(--ui-soft); color: var(--ui-link); }
/* Creator presets stay independent of the visitor's overall appearance. */
.fan-site { color-scheme: light; }
.fan-site.theme-midnight { color-scheme: dark; }
[data-appearance="dark"] .fan-site.theme-classic {
    --theme-surface: var(--ui-panel);
    --theme-text: var(--ui-text);
    color-scheme: dark;
}
[data-appearance="dark"] .theme-classic .management-panel,
[data-appearance="dark"] .theme-classic .summary-card { background: var(--theme-surface); color: var(--theme-text); border-color: var(--ui-border); }
[data-appearance="dark"] .theme-classic .management-panel-header,
[data-appearance="dark"] .theme-classic .member-row,
[data-appearance="dark"] .theme-classic .post-card,
[data-appearance="dark"] .theme-classic .community-settings,
[data-appearance="dark"] .theme-classic .content-panel,
[data-appearance="dark"] .theme-classic .panel-header,
[data-appearance="dark"] .theme-classic .chat-panel { border-color: var(--ui-border); }
[data-appearance="dark"] .theme-classic .summary-card span,
[data-appearance="dark"] .theme-classic .site-overview-details dt,
[data-appearance="dark"] .theme-classic .empty-state p { color: var(--ui-muted); }
[data-appearance="dark"] .theme-classic .back-link { color: var(--ui-link); }
[data-appearance="dark"] .theme-classic .celebrity-hero-with-banner .back-link { color: #fff; }
[data-appearance="dark"] .theme-classic .chat-author-0 { color: #ff83bd; }
[data-appearance="dark"] .theme-classic .chat-author-1 { color: #72b7ff; }
[data-appearance="dark"] .theme-classic .chat-author-2 { color: #bc91ff; }
[data-appearance="dark"] .theme-classic .chat-author-3 { color: #62dfa3; }
[data-appearance="dark"] .theme-classic .chat-author-4 { color: #ffb36b; }
[data-appearance="dark"] .theme-classic .chat-author-5 { color: #d6df68; }
[data-appearance="dark"] .theme-classic .chat-author-6 { color: #6edce5; }
[data-appearance="dark"] .theme-classic .chat-author-7 { color: #ff9393; }
.leaflet-container { color-scheme: light; }
@media (max-width: 520px) { .appearance-options { right: auto; left: 0; } }
[data-appearance="dark"] .information-lead { color: var(--ui-link); }
[data-appearance="dark"] .celebrity-stats { border-color: var(--ui-border); }
[data-appearance="dark"] .celebrity-card .stat strong { color: var(--ui-text); }
[data-appearance="dark"] .celebrity-card .stat span { color: var(--ui-muted); }
[data-appearance="dark"] .hero .search-form input::placeholder { color: var(--ui-muted); }

.location-choice-actions { display: flex; align-items: stretch; gap: 8px; margin-block: 12px; }
.location-choice-actions .button { margin: 0; min-width: 0; }
.location-choice-actions .button[hidden] { display: none; }
.fan-site .location-choice-actions .location-choice-outline {
    background: transparent;
    color: var(--theme-text, var(--ui-text));
    border: 1px solid currentColor;
    box-shadow: none;
}
@media (max-width: 768px) {
    .location-choice-actions .button { flex: 1; padding: 12px 8px; font-size: 14px; }
}