/* Shared appearance tokens. Media and the story canvas retain their own colors. */
:root {
    --surface-color: #101010;
    --surface-raised: #18181c;
    --surface-hover: rgba(255,255,255,.06);
    --theme-overlay: rgba(0,0,0,.8);
    --theme-shadow: 0 12px 36px rgba(0,0,0,.22);
}
.theme-toggle {
    display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
    width:44px; height:44px; padding:0; border:1px solid var(--border-color, #555);
    border-radius:50%; background:var(--glass-bg, #181818); color:var(--text-glow, #eee);
    cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.theme-toggle:hover { background:var(--surface-hover); }
.theme-toggle:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.theme-icon { flex-shrink:0; pointer-events:none; }
.theme-icon-moon { display:none; }
html[data-theme="light"] .theme-icon-sun { display:none; }
html[data-theme="light"] .theme-icon-moon { display:block; }
.theme-toggle--floating { position:fixed; top:max(16px, env(safe-area-inset-top)); right:16px; z-index:100; }
.theme-toggle--nav { border:0; background:transparent; width:28px; min-width:28px; height:44px; min-height:44px; padding:0; margin-inline:-5px; flex:0 0 28px; }
.theme-toggle--nav:hover { background:transparent; }
.theme-toggle--nav .theme-icon { filter:drop-shadow(0 0 4px currentColor); transition:filter .2s ease, transform .2s ease; }
.theme-toggle--nav:hover .theme-icon { filter:drop-shadow(0 0 7px currentColor); transform:scale(1.08); }

html[data-theme="light"] {
    color-scheme:light;
    --bg-color:#f3f1eb; --text-color:#373833; --text-glow:#1d211d;
    --blur-text-color:#62665d; --accent:#62665d;
    --border-color:rgba(35,42,30,.2); --glass-border:rgba(35,42,30,.16);
    --glass-bg:rgba(255,255,252,.88); --surface-color:#fffefa; --surface-raised:#eeece5;
    --surface-hover:rgba(42,48,35,.07); --theme-overlay:rgba(40,43,36,.35);
    --theme-shadow:0 12px 36px rgba(37,43,30,.12);
    /* Standalone confirmation and administration pages. */
    --bg:#f3f1eb; --paper:#292b24; --muted:#62665d; --line:#b8b7ac;
    --bg-base:#f3f1eb; --bg-surface:#fffefa; --bg-panel:rgba(255,255,252,.88);
    --bg-panel-hover:rgba(42,48,35,.07); --text-primary:#1d211d; --text-secondary:#62665d;
    --accent-primary:#292e25; --accent-secondary:#555d50; --success-color:#157341; --warning-color:#785b0b;
}
html[data-theme="light"] body { background-color:var(--bg-color); color:var(--text-color); }
html[data-theme="light"] :is(h1,h2,h3,.logo) { text-shadow:none; }
html[data-theme="light"] a:hover { text-shadow:none; }
html[data-theme="light"] #grain { opacity:.025; }
html[data-theme="light"] #stars-container > * { background-color:#7d806c !important; box-shadow:none !important; }
html[data-theme="light"] :is(.glass,.fragment,.discovery-section,.feed-action-box) { background:var(--glass-bg); border-color:var(--glass-border); }
html[data-theme="light"] :is(.fragment:hover,.feed-action-box:hover,.discovery-item:hover,.song-result-item:hover,.search-result-item:hover) { background:var(--surface-raised); }
html[data-theme="light"] :is(.btn:hover,.reaction-btn:hover) { background:var(--surface-hover); border-color:var(--border-color); }
html[data-theme="light"] .feed-action-box:hover :is(.feed-action-btn,.feed-action-icon) { color:var(--text-glow); }
html[data-theme="light"] :is(.reaction-badge,.chat-msg-reaction-pill) { background:var(--surface-raised) !important; color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.echo,.echoes-container,.friend-list-item) { border-color:var(--border-color) !important; }
html[data-theme="light"] :is(.loading-skeleton,.song-result-item:hover) { background-color:var(--surface-raised); }
html[data-theme="light"] :is(.global-search-container input,.echo-input,.auth-input,.custom-modal textarea) { color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.toast,.custom-modal,.composer-modal-dialog,.modal-content,.profile-avatar-options,.personal-event,#avatar-crop-dialog) { background:var(--surface-color) !important; color:var(--text-color); border-color:var(--border-color); box-shadow:var(--theme-shadow); }
html[data-theme="light"] :is(.custom-modal-overlay,.composer-modal,.edit-modal) { background:var(--theme-overlay); }
html[data-theme="light"] :is(#notif-dropdown,#global-search-results,#mentions-dropdown,#fragment-reactions-popup,#chat-reactions-popup,#profile-friends-dropdown,#profile-mutual-dropdown) { background:var(--surface-color) !important; color:var(--text-color); border-color:var(--border-color) !important; box-shadow:var(--theme-shadow) !important; }
html[data-theme="light"] :is(.composer-textarea,.composer-privacy-select,.custom-search-input,.custom-modal textarea,.modal-content input,.modal-content textarea,.modal-content select) { color:var(--text-color); background-color:var(--surface-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.composer-modal-header,.composer-modal-footer,.composer-privacy-select,.composer-user-chip,.custom-user-row,.composer-attach-btn,.composer-remove-img-btn) { border-color:var(--border-color); }
html[data-theme="light"] :is(.composer-submit-btn,.custom-modal .btn-confirm) { background:var(--text-glow); color:var(--bg-color); }
html[data-theme="light"] .composer-modal-backdrop { background:var(--theme-overlay); }
html[data-theme="light"] :is(.composer-textarea,.chat-input-field)::placeholder { color:var(--blur-text-color); }
html[data-theme="light"] .composer-privacy-select option { background:var(--surface-color); color:var(--text-color); }
html[data-theme="light"] .composer-attach-btn:hover { color:var(--text-glow); background:var(--surface-hover); }
html[data-theme="light"] .composer-modal-footer { background:var(--surface-raised); }
html[data-theme="light"] :is(.composer-draft-indicator,.composer-status-text) { color:var(--blur-text-color); }
html[data-theme="light"] :is(#nav-chat-badge,#notif-badge) { background:var(--text-glow) !important; color:var(--bg-color) !important; box-shadow:none !important; }
html[data-theme="light"] .chat-nav-link:hover svg { stroke:currentColor; filter:none; }
html[data-theme="light"] .composer-submit-btn:disabled { background:var(--surface-raised); color:var(--blur-text-color); }
html[data-theme="light"] :is(.personal-event h3,.personal-event a) { color:var(--text-glow); }
html[data-theme="light"] .birthday-surprise { background:radial-gradient(ellipse at top right,#f2dce7,var(--surface-color) 70%) !important; }

/* The cover fade adapts to the active theme; cover photos stay unchanged. */
html[data-theme="light"] .profile-header { background:var(--surface-color); }
html[data-theme="light"] .profile-cover:not(.has-cover) { background:linear-gradient(135deg,#e8e9e2 0%,#daddd2 48%,#f3f1eb 100%); }
html[data-theme="light"] .profile-cover::after { display:block; background:linear-gradient(to bottom,transparent 42%,rgba(243,241,235,.12) 58%,rgba(243,241,235,.72) 82%,var(--surface-color,#fffefa) 100%); }
html[data-theme="light"] .profile-cover.is-composed:not(.is-clean-cover)::after { display:block; background:linear-gradient(to bottom,transparent 38%,rgba(243,241,235,.14) 58%,rgba(243,241,235,.74) 82%,var(--surface-color,#fffefa) 100%); }
html[data-theme="light"] .profile-cover-empty-message { color:#45483f; text-shadow:0 1px 8px rgba(255,255,255,.8); }
html[data-theme="light"] :is(.profile-cover-action,.profile-archive-trigger) { background:rgba(255,254,250,.9); border-color:rgba(35,42,30,.2); color:#242920; }
html[data-theme="light"] :is(.profile-cover-action,.profile-archive-trigger):hover { background:#fffefa; }
html[data-theme="light"] .profile-body .profile-avatar { background:var(--surface-color); box-shadow:0 0 0 5px var(--surface-color); outline-color:var(--surface-color); }
html[data-theme="light"] .profile-avatar-add::before { background:var(--surface-color); border-color:#6b7262; box-shadow:0 0 0 3px var(--surface-color); }
html[data-theme="light"] .profile-avatar-add { color:var(--text-glow); }
html[data-theme="light"] .profile-player { background:transparent; border-color:transparent; }
html[data-theme="light"] .profile-email-verification { background:#fff0ed; color:#88372f; border-color:#c88276; }
html[data-theme="light"] .profile-email-verification :is(h3,.btn) { color:#88372f; }
html[data-theme="light"] :is(.highlight-manage-dialog,.highlights-manage-modal,.profile-friends-toggle) { color:var(--text-color); }

/* Chat chrome and messages. Photo/video surfaces keep their original colors. */
html[data-theme="light"] :is(.chat-container,.chat-inbox,.chat-area,.chat-header,.chat-input-area,.chat-dropdown-content,.chat-msg-music-player) { background:var(--surface-color) !important; color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] .chat-container { box-shadow:var(--theme-shadow); }
html[data-theme="light"] .inbox-item { box-shadow:none; }
html[data-theme="light"] .message { box-shadow:0 2px 8px rgba(37,43,30,.07); }
html[data-theme="light"] :is(.inbox-item.active,.inbox-item:hover,.chat-msg-music-btn,.chat-attach-btn,.chat-input-field) { background:var(--surface-raised); border-color:var(--border-color); }
html[data-theme="light"] :is(.inbox-username,.chat-header-username,.chat-typing-indicator,.chat-msg-music-title,.chat-input-field,.chat-attach-btn,.chat-msg-music-btn) { color:var(--text-glow); }
html[data-theme="light"] :is(.inbox-last-msg,.chat-status-text,.chat-msg-music-artist,.chat-msg-time,.chat-reaction-btn,.chat-msg-action-btn) { color:var(--blur-text-color) !important; }
html[data-theme="light"] .typing-wave span { background:var(--text-color); }
html[data-theme="light"] .message.sent { background:#e0e6d8; color:#263021; border-color:#b8c3ad; }
html[data-theme="light"] .message.received { background:#fffefa; color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.chat-send-btn,.unread-badge) { background:#303b29; color:#fffefa; }
html[data-theme="light"] :is(.chat-send-btn,.chat-msg-music-btn):hover { background:#45543b; color:#fffefa; }
html[data-theme="light"] .chat-dropdown-content :is(a,button) { color:var(--text-color); }

/* Editors: only the UI changes. The composited scene, text and filters are media. */
html[data-theme="light"] :is(.creator-container,.chat-creator-container,.modal-card,.chat-modal-card) { background:var(--surface-color); color:var(--text-color); border-color:var(--border-color); box-shadow:var(--theme-shadow); }
html[data-theme="light"] :is(.creator-bottom-bar,.chat-creator-bottom-bar,.filter-dock,.chat-filter-dock) { background:var(--surface-color); color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.creator-btn,.chat-creator-btn,.chat-creator-top-btn,.filter-chip,.chat-filter-chip) { background:var(--surface-color); color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.editor-modal,.chat-sub-modal,.chat-media-modal-backdrop) { background:var(--theme-overlay); }
html[data-theme="light"] :is(.modal-card,.chat-modal-card) :is(input,textarea,select) { background:var(--surface-raised) !important; color:var(--text-color) !important; border-color:var(--border-color) !important; }
html[data-theme="light"] :is(.modal-card,.chat-modal-card) :is(h3,label) { color:var(--text-glow) !important; }
html[data-theme="light"] :is(.modal-card,.chat-modal-card,#story-archive-modal,#story-add-highlight-drawer,#story-privacy-modal,#story-insights-drawer,#story-viewers-modal,#story-question-drawer,#modal-highlight-manage) :is([style*="color:#fff"],[style*="color: #fff"]) { color:var(--text-glow) !important; }
html[data-theme="light"] :is(#story-add-highlight-drawer,#story-privacy-modal,#story-insights-drawer,#story-viewers-modal,#story-question-drawer) input { background:var(--surface-raised) !important; color:var(--text-color) !important; border-color:var(--border-color) !important; }
html[data-theme="light"] :is(.music-track-item,.chat-music-track-item,.privacy-user-item) { border-color:var(--border-color); color:var(--text-color); }
html[data-theme="light"] .chat-caption-input-wrap input { background:var(--surface-raised); color:var(--text-color); border-color:var(--border-color); }
html[data-theme="light"] :is(.itunes-result-title,.itunes-row-title,.music-track-item .music-title,.chat-music-track-item .music-title) { color:var(--text-glow); }
html[data-theme="light"] :is(.itunes-result-artist,.itunes-row-artist,.archive-kpi-label) { color:var(--blur-text-color); }
html[data-theme="light"] .archive-kpi-value { color:#157341; }
html[data-theme="light"] :is(.music-play-btn,.chat-music-play-btn) { background:var(--surface-raised); color:var(--text-color); border-color:var(--border-color); }

/* Story/archive drawers are UI; the story stage and its overlays stay untouched. */
html[data-theme="light"] #story-archive-modal { background:var(--theme-overlay) !important; }
html[data-theme="light"] :is(#story-archive-modal > .glass,#story-privacy-modal,#story-insights-drawer,#story-add-highlight-drawer,#story-viewers-modal,#story-reactions-modal,#story-question-drawer) { background:var(--surface-color) !important; color:var(--text-color); border-color:var(--border-color) !important; }
html[data-theme="light"] :is(#story-archive-modal,#story-privacy-modal,#story-insights-drawer,#story-add-highlight-drawer,#story-viewers-modal,#story-reactions-modal,#story-question-drawer,#modal-highlight-manage) :is(h2,h3,p,label) { color:var(--text-color) !important; }
html[data-theme="light"] :is(.archive-kpi-card,.archive-filter-pill) { background:var(--surface-raised); color:var(--text-color); border-color:var(--border-color); }

/* Daylight version of the door: preserve the opening animation and geometry. */
html[data-theme="light"] .guest-moon { filter:drop-shadow(0 0 2px #b09a63); }
html[data-theme="light"] .guest-moon::before { background:#897136; }
html[data-theme="light"] .guest-door-frame { border-color:#81755b; background:#f7f0d9; box-shadow:0 0 24px #d5c69d; }
html[data-theme="light"] .guest-door-panel { background:linear-gradient(100deg,#d7d2c5,#e9e5db); border-color:#a69d89; }
html[data-theme="light"] .guest-door-label { color:#34382d; text-shadow:none; }
html[data-theme="light"] .guest-door-handle { background:#5f614f; box-shadow:0 0 5px #b8b28e; }
html[data-theme="light"] .guest-door-light { background:linear-gradient(to bottom,rgba(175,149,85,.24),rgba(175,149,85,.1) 45%,transparent 100%); }
html[data-theme="light"] .guest-atmosphere span { background:#8c805e; box-shadow:none; }

@media (prefers-reduced-motion:no-preference) {
    .theme-toggle .theme-icon { animation:theme-icon-in .2s ease-out; }
    @keyframes theme-icon-in { from { opacity:0; transform:rotate(-25deg) scale(.8); } to { opacity:1; transform:none; } }
}

html[data-theme="light"] .stage-placeholder { color:#babbb2; }
html[data-theme="light"] .stage-placeholder svg { color:#babbb2; }
html[data-theme="light"] .chat-stage-placeholder { color:#babbb2; }