.theme-button{display:grid;place-items:center;width:44px;height:44px;padding:10px;flex:none;background:#ffffff06;color:var(--gold);border:1px solid var(--ui-border);border-radius:12px}.theme-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
#ritm-theme-settings{width:min(380px,calc(100vw - 32px));padding:24px;background:#1a1418;color:#f5f5f5;border:1px solid #ffffff24;border-radius:20px}#ritm-theme-settings::backdrop{background:#0009}#ritm-theme-settings h2{margin:0 0 20px}#ritm-theme-settings label{display:block;margin-bottom:8px}#ritm-theme-settings select{width:100%;min-height:48px;border-radius:12px}#ritm-theme-settings p{color:var(--mu);font-size:14px}#ritm-theme-settings button{min-height:44px;width:100%;border:1px solid #ffffff24;border-radius:12px;background:#ffffff08;color:inherit;font:inherit}
html[data-theme=light]{color-scheme:light;--bg:#fafafa;--card:#ffffff;--tx:#171717;--mu:#626262;--gold:#b12238;--red:#b42336;--ui-border:#17171726;--ac:#b42336}
html[data-theme=dark]{color-scheme:dark}
html[data-theme=light] body,html[data-theme=light] .vw{background:#fafafa;color:var(--tx)}html[data-theme=light] .bg{display:none}
html[data-theme=light] .hero{box-shadow:0 12px 35px #17171712}html[data-theme=light] .hero:before{background:linear-gradient(90deg,#fafafaed,#fafafa90),linear-gradient(0deg,#fafafade,transparent)}html[data-theme=light] .hn{text-shadow:none;color:#171717}
html[data-theme=light] .sf,html[data-theme=light] header select,html[data-theme=light] .theme-button,html[data-theme=light] .account-button,html[data-theme=light] .community-admin{background:#ffffff;color:var(--tx);border-color:var(--ui-border)}
html[data-theme=light] .post,html[data-theme=light] .studio-card,html[data-theme=light] #ritm-account,html[data-theme=light] .video-card,html[data-theme=light] .artist-profile-hero,html[data-theme=light] .artist-track,html[data-theme=light] .library-item,html[data-theme=light] .card{background:#ffffff;color:var(--tx);border-color:var(--ui-border);box-shadow:0 8px 22px #17171708}
html[data-theme=light] .studio-quota{background:#eeeeee!important}html[data-theme=light] .studio-section,html[data-theme=light] #arts .at,html[data-theme=light] .at .fb{background:#ffffff;border-color:var(--ui-border)}html[data-theme=light] .studio-section summary{color:var(--tx)}
html[data-theme=light] :is(.studio-card,#ritm-account,.ov) :is(input,textarea,select){background:#fff;color:var(--tx);border-color:#999999}html[data-theme=light] :is(.studio-card,.my-video) button,html[data-theme=light] #ritm-account button:not(.account-close),html[data-theme=light] .video-tabs button,html[data-theme=light] .video-player-actions>*{background:#eeeeee;color:var(--tx);border-color:var(--ui-border)}
html[data-theme=light] .studio-card button[type=submit],html[data-theme=light] #ritm-account button[value=login],html[data-theme=light] #ritm-account button[value=profile],html[data-theme=light] #ritm-account button[value=password]{background:linear-gradient(135deg,#ef4053,#c83245);color:#ffffff}html[data-theme=light] #ritm-account .account-close{color:var(--tx)}
html[data-theme=light] .studio-track-actions button[data-action=remove],html[data-theme=light] .studio-track-actions button[data-action=discard],html[data-theme=light] .my-video [data-video-remove]{background:#b423360c;color:#a51c2d;border-color:#b4233630}
html[data-theme=light] .nav,html[data-theme=light] .mini{background:#fffffff5;color:var(--tx);border-color:var(--ui-border);box-shadow:0 8px 28px #17171718}html[data-theme=light] .nav button,html[data-theme=light] .mini button,html[data-theme=light] .ctl button{color:var(--tx)}html[data-theme=light] .nav button.on{color:#b12238;background:#f0f0f0}html[data-theme=light] .nav button.on:before{background:#b12238}html[data-theme=light] .chip{background:#ffffff;border-color:var(--ui-border);color:var(--tx)}html[data-theme=light] .chip.on,html[data-theme=light] .video-tabs button[aria-pressed=true]{background:#c83245;color:#ffffff}
html[data-theme=light] .full{background:radial-gradient(ellipse at top,#ededed,#fafafa 65%);color:var(--tx)}html[data-theme=light] .full>.amb{opacity:.06}html[data-theme=light] .full>.art{background:#eeeeee;border-color:var(--ui-border);box-shadow:0 16px 40px #17171718}html[data-theme=light] .full :is(#fa,.bar,.top small){color:var(--mu)}html[data-theme=light] .full .ib,html[data-theme=light] .full>.act button{background:#17171708;color:var(--tx);border-color:var(--ui-border)}html[data-theme=light] .full>.ctl .big{background:linear-gradient(135deg,#ef4053,#c83245);color:#ffffff}html[data-theme=light] .full .ctl .ib.on{color:#a51c2d}
html[data-theme=light] .ov,html[data-theme=light] .sh{background:#fafafa;color:var(--tx)}html[data-theme=light] .ov .opt,html[data-theme=light] .ov a{background:#ffffff;color:var(--tx);border-color:var(--ui-border)}html[data-theme=light] .lv,html[data-theme=light] .lv .lf{background:#fafafa;color:var(--tx)}html[data-theme=light] .lyric-text-line{color:#333333}html[data-theme=light] .karaoke-line.active{color:#b12238}html[data-theme=light] .lg,html[data-theme=light] #ritm-video-player,html[data-theme=light] #ritm-theme-settings{background:#ffffff;color:var(--tx)}html[data-theme=light] .lg :is(p,li){color:var(--tx)}html[data-theme=light] #ritm-theme-settings :is(select,button){background:#eeeeee;color:var(--tx);border-color:var(--ui-border)}html[data-theme=light] :is(.video-card,#ritm-video-player,.my-video) small{color:var(--mu)}html[data-theme=light] .ob{background:radial-gradient(ellipse at top,#ededed,#fafafa 70%);color:var(--tx)}html[data-theme=light].account-required #ritm-account::backdrop{background:#fafafa}

/* RITM red marks main actions; red, black and white form the final palette. */
html{--action-red:#c83245;--action-red-text:#fff;--active-red:#ff9aa6;--active-red-bg:#c832452e}
html[data-theme=light]{--active-red:#b12238;--active-red-bg:#f9e3e7}
html[data-theme] .pa,html[data-theme] .obp,html[data-theme] .studio-upload-shortcut,html[data-theme] .studio-card button[type=submit],html[data-theme] #ritm-account button[value=login],html[data-theme] #ritm-account button[value=profile],html[data-theme] #ritm-account button[value=password],html[data-theme] .post .pl,html[data-theme] .full>.ctl .big,html[data-theme] .lv .lf .big,html[data-theme] .studio-track-actions button[data-action=play]{background:var(--action-red);color:var(--action-red-text);border-color:var(--action-red);box-shadow:none}
html[data-theme] .full>.ctl .big{box-shadow:0 8px 28px #c8324528}
html[data-theme] .nav button.on{color:var(--active-red);background:var(--active-red-bg)}
html[data-theme] .nav button.on i{background:transparent}
html[data-theme] .nav button.on:before{background:var(--active-red)}
html[data-theme] .full .ctl .ib.on{color:var(--active-red)}
html[data-theme] .video-thumb>span{background:#c83245;color:#fff;border-color:#ffffff40}
html[data-theme] :is(.pa,.obp,.studio-upload-shortcut,.post .pl,.nav button,.studio-card button[type=submit]):focus-visible{outline:2px solid var(--active-red);outline-offset:3px}

/* Final neutral surfaces and red accents. */
html[data-theme=dark]{--bg:#090909;--card:#171717;--tx:#f5f5f5;--mu:#bdbdbd;--gold:#ff9aa6}
html[data-theme=light]{--bg:#fafafa;--card:#ffffff;--tx:#171717;--mu:#626262;--gold:#b12238}
html[data-theme=dark] body,html[data-theme=dark] .vw{background:#090909}
html[data-theme=dark] :is(.studio-card,.post,#ritm-account,.mini,.nav,.video-card,#ritm-video-player,.ov,.sh,.lg,#ritm-theme-settings){background:#171717}
html[data-theme=dark] .full{background:radial-gradient(ellipse at top,#381018,#090909 65%)}
html[data-theme=dark] .ob{background:radial-gradient(ellipse at top,#381018,#090909 70%)}
html[data-theme=dark] .studio-quota{background:#1c1c1c!important}
html[data-theme] header h1{color:var(--red)}
html[data-theme] .chip.on,html[data-theme] .video-tabs button[aria-pressed=true]{background:#c83245;color:#fff;border-color:#c83245}
html[data-theme=light] .studio-card :is(p,small),html[data-theme=light] .library-sync,html[data-theme=light] .stats-note{color:#626262}

/* Artist pages: readable text on neutral surfaces and white on red actions. */
html[data-theme] .artist-profile-hero{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .artist-profile-hero h1{color:var(--tx)}
html[data-theme] .artist-profile-hero :is(p,small),html[data-theme] .artist-track small{color:var(--mu)}
html[data-theme] .artist-back{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .artist-profile-actions button{background:var(--card);color:var(--tx);border:1px solid var(--ui-border)}
html[data-theme] .artist-profile-actions .artist-play-all,html[data-theme] .artist-profile-actions .fb.on,html[data-theme] .artist-profile-actions [data-share-artist]{background:#c83245;color:#fff;border-color:#c83245}
html[data-theme] .artist-profile-actions .artist-play-all svg,html[data-theme] .artist-profile-actions .artist-play-all svg path{fill:currentColor}
html[data-theme] .artist-rhythms span{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .artist-directory .at{background:var(--card);color:var(--tx);border:1px solid var(--ui-border);border-radius:16px;padding:16px}
html[data-theme] .artist-directory .at small{color:var(--mu)}
html[data-theme] .artist-directory .fb{background:var(--card);color:var(--tx);border:1px solid var(--ui-border)}
html[data-theme] .artist-directory .fb.on{background:#c83245;color:#fff;border-color:#c83245}
html[data-theme] .artist-profile-photo.av{background:#c83245;color:#fff}
html[data-theme] .artist-library-row{color:var(--tx)}
html[data-theme] .artist-track{color:var(--tx)}

/* Shared sheets must resolve their own surface and text in either theme. */
html[data-theme] .sh2{background:var(--card);color:var(--tx);border:1px solid var(--ui-border);box-shadow:0 -12px 40px #0004;max-height:80dvh}
html[data-theme] .sh2::before{background:var(--mu)}
html[data-theme] .sh2 :is(h3,.sr,.shh){color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .sh2 :is(small,.sr>svg){color:var(--mu)}
html[data-theme] .sh2 .player-menu-action{background:transparent}
html[data-theme] .sh2 .sbtn2{background:var(--bg);color:var(--tx);border:1px solid var(--ui-border)}
html[data-theme] .sh2 .sbtn2.on,html[data-theme] .sh2 .ck2{color:var(--gold)}
html[data-theme] .sh2 button:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
html[data-theme] .ov .no{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .ov :is(input,textarea,select){background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .video-player-head button{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] #ritm-account .account-intro,html[data-theme] #account-message{color:var(--mu)}
html[data-theme=light] :is(.studio-stats-button,.library-tools button){background:#eee;color:#171717;border-color:#d1d1d1}
html[data-theme=light] .artist-stat-cards strong,html[data-theme=light] .artist-stat-track>div{color:#626262}
html[data-theme] .toast{background:#171717;color:#fff;border:1px solid #ffffff30;box-shadow:0 6px 20px #0003}

html[data-theme] .sh2 .sheet-close{float:right;background:var(--bg);color:var(--tx);margin:0 0 4px 12px}
html[data-theme] .sh2>h3{min-height:44px;display:flex;align-items:center;margin:0 0 8px}
html[data-theme] .sh2>.shh{padding-right:0}
html[data-theme] .sh2 .sr:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}

/* Studio and analytics inherit the same theme as the rest of the app. */
html[data-theme] #artist-studio{background:var(--bg);color:var(--tx)}
html[data-theme] .studio-head button{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .studio-head h2{color:var(--gold)}
html[data-theme] .studio-card :is(p,small),html[data-theme] .stats-note,html[data-theme] .artist-stat-track>div{color:var(--mu)}
html[data-theme] .artist-stat-cards strong{color:var(--gold)}
html[data-theme] .artist-stat-cards>div{background:var(--bg)}
html[data-theme] .studio-section{background:var(--card);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .studio-section summary{color:var(--tx)}
html[data-theme] .studio-track,html[data-theme] .artist-stat-track{border-color:var(--ui-border)}
html[data-theme] .studio-card input::file-selector-button{background:var(--bg);color:var(--gold)}
html[data-theme] .studio-card button:not([type=submit]):not([data-action=play]):not([data-action=remove]):not([data-action=discard]):not([data-video-remove]){background:var(--bg);color:var(--tx);border-color:var(--ui-border)}
html[data-theme] .studio-card :is(input,textarea,select){background:var(--bg);color:var(--tx);border-color:var(--ui-border)}
