/* The original palette remains unchanged until a different theme is chosen. */
:root{--accent-soft:#a277ff18;--accent-line:#a277ff40;--on-accent:#120d1e;--on-lime:#17200c;--theme-input:#1b1626;--theme-player:#2b2138ef;--theme-nav:#17111fef;--theme-good:#d5ff7112;--theme-danger:#ff548d20;--theme-danger-ink:#ff96bb}
:root[data-theme=light]{color-scheme:light;--bg:#f7f6fb;--surface:#fff;--surface-2:#efebf6;--ink:#251b36;--muted:#696075;--line:#35224724;--violet:#7040b6;--navy:#7040b6;--gold:#7040b6;--gold-light:#8254c4;--lime:#466d1b;--green:#466d1b;--pink:#b51d5a;--burgundy:#b51d5a;--accent-soft:#7040b610;--accent-line:#7040b640;--on-accent:#fff;--on-lime:#fff;--theme-input:#faf9fd;--theme-player:#fffffffa;--theme-nav:#f4f1faf5;--theme-good:#466d1b0f;--theme-danger:#b51d5a0d;--theme-danger-ink:#a21950}
:root[data-theme=saudi]{color-scheme:dark;--bg:#071e17;--surface:#0c2a20;--surface-2:#13392b;--ink:#f0f7f0;--muted:#adc5b6;--line:#d7ead921;--violet:#70d49f;--navy:#70d49f;--gold:#dfd08c;--gold-light:#eee0a7;--lime:#dfd08c;--green:#b6ddb4;--pink:#ed93a7;--burgundy:#ed93a7;--accent-soft:#70d49f16;--accent-line:#70d49f40;--on-accent:#052316;--on-lime:#231e0b;--theme-input:#092319;--theme-player:#12392df5;--theme-nav:#08271cf5;--theme-good:#dfd08c12;--theme-danger:#ed93a715;--theme-danger-ink:#f3a5b6}
.theme-picker{display:block;min-width:0;border:0;border-bottom:1px solid var(--line);padding:0 0 24px;margin-bottom:22px}
.theme-picker legend{font-size:18px;font-weight:600;color:var(--ink);padding:0}.theme-picker>p{color:var(--muted);margin:8px 0 18px;font-size:14px}
.theme-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.theme-option{position:relative;display:flex;flex-direction:column;gap:7px;border:1px solid var(--line);border-radius:16px;padding:12px;background:var(--surface);cursor:pointer;min-width:0;text-align:start}
.theme-option:has(input:checked){border:2px solid var(--violet);padding:11px;background:var(--accent-soft)}
.theme-option:focus-within{outline:2px solid var(--violet);outline-offset:3px}
.theme-option input{position:absolute;top:18px;inset-inline-end:18px;width:18px;height:18px;accent-color:var(--violet);z-index:1}
.theme-option b{font-size:14px;color:var(--ink)}.theme-option small{font-size:12px;line-height:1.7;color:var(--muted)}
.theme-swatch{display:grid;grid-template-columns:20px 1fr;gap:5px;height:75px;border-radius:9px;padding:12px;background:#0e0c16;border:1px solid #ffffff20;direction:ltr}
.theme-swatch i{background:#a277ff;border-radius:4px}.theme-swatch i:first-child{grid-row:span 2}.theme-swatch i:nth-child(2){background:#201a2e}.theme-swatch i:last-child{width:60%;background:#d5ff71}
[data-theme-option=light] .theme-swatch{background:#f7f6fb;border-color:#35224724}[data-theme-option=light] .theme-swatch i:first-child{background:#7040b6}[data-theme-option=light] .theme-swatch i:nth-child(2){background:#ded6ed}[data-theme-option=light] .theme-swatch i:last-child{background:#466d1b}
[data-theme-option=saudi] .theme-swatch{background:#071e17}[data-theme-option=saudi] .theme-swatch i:first-child{background:#70d49f}[data-theme-option=saudi] .theme-swatch i:nth-child(2){background:#13392b}[data-theme-option=saudi] .theme-swatch i:last-child{background:#dfd08c}
.avatar-picker{min-width:0;border:0;padding:0}.avatar-picker legend{font-size:15px;font-weight:600;color:var(--ink)}.avatar-picker>p{margin:8px 0 14px}.avatar-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:12px}
.avatar-options button{position:relative;padding:4px;border:2px solid transparent;border-radius:20px;background:var(--surface-2)}.avatar-options img{width:100%;height:auto;aspect-ratio:1;border-radius:15px}.avatar-options button[aria-pressed=true]{border-color:var(--violet);background:var(--accent-soft)}.avatar-options button>span{position:absolute;bottom:7px;inset-inline-end:7px;width:24px;height:24px;display:none;place-items:center;background:var(--violet);color:var(--on-accent);border-radius:50%}.avatar-options button[aria-pressed=true]>span{display:grid}.avatar-options .icon{width:16px;height:16px}.avatar-options button:focus-visible{outline:2px solid var(--violet);outline-offset:3px}
@media(max-width:430px){.theme-options{gap:8px}.theme-option{padding:8px;border-radius:12px}.theme-option:has(input:checked){padding:7px}.theme-option b{font-size:13px}.theme-option input{top:14px;inset-inline-end:12px}.theme-swatch{padding:9px;grid-template-columns:14px 1fr;height:65px}}
@media(max-width:340px){.theme-options{grid-template-columns:1fr}.theme-option{display:grid;grid-template-columns:80px 1fr}.theme-swatch{grid-row:span 2}.theme-option input{top:auto;bottom:10px;inset-inline-end:10px}}

/* Shared interface surfaces, on both phone and desktop layouts. */
html[data-theme]:not([data-theme=default]) :is(body,#app,.phone-screen,.native-header){background:var(--bg);color:var(--ink)}
html[data-theme]:not([data-theme=default]) :is(.panel,.work-card,.creator-card,.opportunity-card,.project-row,.invitation,.stat-card,.creator-metric,.identity-role,.share-preview,.urab-preview,.preview-box){background:var(--surface);border-color:var(--line);color:var(--ink)}
html[data-theme]:not([data-theme=default]) :is(dialog:not(.app-welcome),.pdf-controls){background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) .mobile-nav{background:var(--theme-nav);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) .player{background:var(--theme-player);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) :is(.mobile-nav button,.social-actions button,.tab,.creator-info>p,.discover-greeting>p,.discover-greeting>span,.work-body>p,.profile-bio,.profile-head-info>p,.comment p,.lyrics,.preview-box p,.stat-card p,.creator-metric>p,.check-label,.auth-consent,.auth-footnote,.auth-brand>span,.otp-info,.sample-note,.share-hint,.share-private,.share-copy input,.recorder-caption,.preview-label,.full-seek>div,.full-volume,.audio-strip>.mono,.experience-note,.profile-work-caption>span:first-child,.followers-total,.form-step,.launch-center>p,.launch-copyright){color:var(--muted)}
html[data-theme]:not([data-theme=default]) :is(.field label,.field-label,.creator-identity>legend,.profile-identity-line>span:first-child,.followers-total>bdi){color:var(--ink)}
html[data-theme]:not([data-theme=default]) :is(.field input,.field textarea,.field select,.comment-form input,.phone-input,.otp-box,.search,.discovery-filters select,.share-copy){background:var(--theme-input);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) .search input{color:var(--ink)}
html[data-theme]:not([data-theme=default]) :is(input,textarea)::placeholder{color:var(--muted);opacity:.8}
html[data-theme]:not([data-theme=default]) .phone-input>span{color:var(--muted);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) :is(.btn.outline,.btn.light,.role-option,.chip,.follow.on){background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) :where(.btn:not(.outline):not(.light):not(.text-btn):not(.danger)){color:var(--on-accent)}
html[data-theme]:not([data-theme=default]) :is(.auth-primary,.mobile-create){background:linear-gradient(110deg,var(--violet),var(--gold-light));color:var(--on-accent)}
html[data-theme]:not([data-theme=default]) :is(.btn.gold,.play-main,.cover-play,.preview-play,.identity-role>i,.creator-choice>i){color:var(--on-lime)}
html[data-theme]:not([data-theme=default]) :is(.chip.active,.message-bubble.mine){background:var(--violet);color:var(--on-accent)}
html[data-theme]:not([data-theme=default]) .message-bubble.mine>small{color:var(--on-accent);opacity:.8}
html[data-theme]:not([data-theme=default]) :is(.tab.active,.identity-role.selected,.role-option:has(input:checked),.mobile-nav button.active,.faq-categories .selected,.rank-table .current){background:var(--accent-soft);color:var(--violet);border-color:var(--accent-line)}
html[data-theme]:not([data-theme=default]) :is(.mobile-nav button.active>.icon,.mobile-nav button.active>span:last-of-type,.mobile-nav button:hover,.audio-label,.completed-tag,.feed-author>.icon-btn,.full-controls>.icon-btn:not(.play-main),.form-step.active,.otp-symbol>.icon){color:var(--violet)}
html[data-theme]:not([data-theme=default]) :is(.follow,.note,.mini-need,.status,.profile-role>span,.demo-feature,.saved-account,.inbox-person,.account-menu-button,.player-collab,.share-copy>button,.stat-icon,.creator-metric>span,.support-history article){background:var(--accent-soft);color:var(--violet);border-color:var(--accent-line)}
html[data-theme]:not([data-theme=default]) :is(.ustars-badge,.status.green,.collab-tag,.needed-tags span,.autofill-code,.ustars-explainer>span){background:var(--theme-good);color:var(--lime);border-color:var(--accent-line)}
html[data-theme]:not([data-theme=default]) :is(.btn.danger,.profile-logout,.status.purple){background:var(--theme-danger);color:var(--theme-danger-ink);border-color:var(--theme-danger-ink)}
html[data-theme]:not([data-theme=default]) :is(.auth-error,.form-error){color:var(--theme-danger-ink)}
html[data-theme]:not([data-theme=default]) :is(.tabs,.message-bubble,.share-preview,.form-step>span){background:var(--surface-2);color:var(--ink)}
html[data-theme]:not([data-theme=default]) :is(.message-bubble>small,.dialog-intro){color:var(--muted)}
html[data-theme]:not([data-theme=default]) :is(.nav-selection,.empty,.branch-end,.upload-zone,.poem-file-box){background:var(--accent-soft);border-color:var(--accent-line)}
html[data-theme]:not([data-theme=default]) :is(.callout,.urab-recorder){background:linear-gradient(130deg,var(--surface-2),var(--surface));border-color:var(--accent-line)}
html[data-theme]:not([data-theme=default]) .urab-recorder [data-action=record]{color:var(--on-accent)}
html[data-theme]:not([data-theme=default]) .urab-recorder.recording [data-action=record]{color:var(--on-lime)}
html[data-theme]:not([data-theme=default]) :is(.sound-wave>i,.switch,.auth-step span){background:var(--muted)}
html[data-theme]:not([data-theme=default]) :is(.sound-wave>i.active,.auth-step span.active){background:var(--violet)}
html[data-theme]:not([data-theme=default]) .switch:checked{background:var(--violet)}
html[data-theme]:not([data-theme=default]) :is(.social-actions,.form-footer,.project-row>.inline-actions,.profile-stats,.settings-row,.thread-heading,.notification,.reward-list>div,.rank-table>div,.saved-accounts,.faq-item,.faq-contact){border-color:var(--line)}
html[data-theme]:not([data-theme=default]) :is(.row-progress,.mini-progress,.split-bar,.profile-work-tabs>.tab>span){background:var(--line)}
html[data-theme]:not([data-theme=default]) .creator-choice{background:var(--surface);color:var(--ink)!important;border-color:var(--line)}
html[data-theme]:not([data-theme=default]) .creator-choice:has(input:checked){background:var(--accent-soft);color:var(--violet)!important;border-color:var(--violet)}
html[data-theme]:not([data-theme=default]) .avatar[data-presence]::after{border-color:var(--surface)}
html[data-theme]:not([data-theme=default]) .avatar-empty{background:var(--surface-2);color:var(--muted);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) :is(.icon-btn:hover,.dialog-head .icon-btn,.tab:not(.active):hover,.chip:not(.active):hover){background:var(--accent-soft)}
html[data-theme]:not([data-theme=default]) :is(.launch-screen,.star-celebration){background:radial-gradient(ellipse at center,var(--accent-soft),transparent),var(--bg);border-color:var(--accent-line)}
html[data-theme]:not([data-theme=default]) .launch-skip{background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=default]) #toast{background:var(--ink);color:var(--bg);border-color:var(--line)}

/* Photos keep their original colors and readable captions in every theme. */
html[data-theme]:not([data-theme=default]) :is(.featured-card,.feed-art,.profile-cover,.story-slide,.landing-film,.landing-finale,.app-welcome,.app-entry){--lime:#d5ff71;--on-lime:#17200c;color:#fff}
html[data-theme=saudi] :is(.featured-card,.feed-art,.landing-film,.landing-finale,.app-welcome,.app-entry){--lime:#dfd08c;--on-lime:#231e0b}
html[data-theme]:not([data-theme=default]) :is(.feature-copy p,.feature-copy small,.story-body p){color:#e5d7ef}
html[data-theme]:not([data-theme=default]) :is(.feed-art .cover-play,.featured-card .cover-play){background:var(--lime);color:var(--on-lime)}
html[data-theme]:not([data-theme=default]) .profile-cover>.icon-btn{background:#16102177;color:white}
html[data-theme]:not([data-theme=default]) :is(.app-entry,.app-welcome,.landing-film,.landing-header,.landing-finale) .btn.outline{background:#100c1960;color:#fff;border-color:#ffffff50}
html[data-theme]:not([data-theme=default]) :is(.app-entry-header,.app-welcome-header,.landing-header) .language-toggle{color:#fff;background:#100c1960}
html[data-theme]:not([data-theme=default]) .landing-actions .btn:first-child{color:var(--on-lime)}
html[data-theme]:not([data-theme=default]) :is(.community-welcome .auth-main,.landing-cinematic,.landing){background:var(--bg)}
html[data-theme]:not([data-theme=default]) .landing-body{color:var(--ink)}
html[data-theme]:not([data-theme=default]) :is(.landing-body p,.landing-example,.landing-footer p){color:var(--muted)}
html[data-theme]:not([data-theme=default]) :is(.landing-section,.landing-footer,.landing-tags span,.landing-story-scene .landing-step){border-color:var(--line)}
html[data-theme]:not([data-theme=default]) .landing-story-scene .landing-step{color:var(--ink);background:transparent}
html[data-theme]:not([data-theme=default]) .landing-story-scene .landing-step>span{color:var(--violet)}
html[data-theme]:not([data-theme=default]) .landing-finale p{color:#e6dcef}
html[data-theme]:not([data-theme=default]) .landing-header{color:#fff}
html[data-theme]:not([data-theme=default]) .landing-film-chapter p{color:#f0e8f5}
html[data-theme]:not([data-theme=default]) .landing-finale .landing-demo{color:#e6dcef}
html[data-theme]:not([data-theme=default]) :is(.verified,.form-step.active>span,.story-ring>i){color:var(--on-accent)}
html[data-theme]:not([data-theme=default]) .skip-link{color:var(--on-lime)}
html[data-theme]:not([data-theme=default]) .player-art>span{color:white}

/* Light surfaces and image overlays have distinct foregrounds. */
html[data-theme=light] .landing-actions .btn[data-action=auth-guest]{background:var(--lime);color:var(--on-lime);border-color:var(--lime)}
html[data-theme=light] .app-entry-actions .btn.text-btn{color:#f6f3ff;background:#100c1980;border-color:#ffffff60}
html[data-theme=light] .app-entry-actions .btn.text-btn:hover{background:#100c19c0}
html[data-theme=light] :is(.landing-audience-photo span,.landing-story-photo figcaption,.landing-story-label){color:#f6f3ff}
html[data-theme=light] :is(.field input,.field textarea,.field select,.phone-input,.otp-box,.search,.discovery-filters select){border-color:#8a7e99}
html[data-theme=light] :is(input,textarea)::placeholder{color:var(--muted);opacity:1}
html[data-theme=light] .identity-role b{color:var(--ink)}
html[data-theme=light] .identity-role.selected b{color:var(--violet)}
html[data-theme=light] .identity-role small{color:var(--muted)}
html[data-theme=light] .landing-story-scene .landing-step{opacity:1}
html[data-theme=light] .landing-story-scene .landing-step.is-current{border-color:var(--violet)}
html[data-theme=light] :is(.landing-actions,.app-entry-actions) .btn:focus-visible{outline:3px solid #fff;outline-offset:4px;box-shadow:0 0 0 6px #251b36}