/* UltraMAX DEV shared subpage appearance. Classic has no overrides. */
/* All tokens follow Home: dark charcoal, soft light, brand lavender focus. */
html.um-subpage-dark{
 --bg:#141821;--bg2:#1b202b;--surface:#171d26;--card:#212633;--card-h:#2b3240;
 --card2:#2b3240;--panel:#212633;--panel2:#2b3240;
 --border:#394357;--border2:#465065;--text:#f2f4f8;--muted:#b2bbcd;--faint:#94a1b6;
 --violet:#6255be;--violet2:#b7a4f6;--accent:#6255be;--accent2:#b7a4f6;
 --cyan:#81d7e5;--green:#5ee1b8;color-scheme:dark;
 --um-page-header:#212633;--um-page-soft:#2b3240;--um-page-ink:#f2f4f8;--um-page-muted:#b2bbcd;
}
html.um-subpage-light{
 --bg:#f6f7fa;--bg2:#f0f3f8;--surface:#f0f3f8;--card:#fff;--card-h:#f0f3f8;
 --card2:#f0f3f8;--panel:#fff;--panel2:#f0f3f8;
 --border:#dce3ed;--border2:#cbd5e2;--text:#202b3b;--muted:#5a687d;--faint:#66748a;
 --violet:#6255be;--violet2:#5143a6;--accent:#6255be;--accent2:#5143a6;
 --cyan:#146f88;--green:#177c61;color-scheme:light;
 --um-page-header:#fff;--um-page-soft:#f0f3f8;--um-page-ink:#202b3b;--um-page-muted:#5a687d;
}
html.um-subpage-refined,html.um-subpage-refined body{
 background:var(--bg)!important;background-image:none!important;color:var(--text)!important;
}
html.um-subpage-refined body::before,html.um-subpage-refined body::after,
html.um-subpage-refined #particles,html.um-subpage-refined #cursorGlow,
html.um-subpage-refined .hero-orb{display:none!important;}
html.um-subpage-refined :is(nav,.changelog-page-nav,.header,.app-header,.um-changelog-app-header){
 background:var(--um-page-header)!important;background-image:none!important;
 border-color:var(--border)!important;color:var(--text)!important;box-shadow:none!important;
}
html.um-subpage-refined :is(.nav-logo,.logo,.brand,.header-title,.nav-back,.back-button,.back,.um-changelog-back){
 color:var(--text)!important;
}
html.um-subpage-refined :is(.sub,.intro,.subtitle,.nav-back,.set-meta,.set-url,.count,.card-author,.card-desc,.modal-desc,.desc,.note,.row-sub){
 color:var(--muted)!important;
}
html.um-subpage-refined :is(input,textarea,select,.lang-select){
 background:var(--card)!important;color:var(--text)!important;border-color:var(--border2)!important;
}
html.um-subpage-refined :is(input,textarea,select):focus-visible{
 outline:2px solid var(--violet2)!important;outline-offset:2px!important;
}
html.um-subpage-refined :is(.av,.set-card,.card,.row,.addon-item,.modal,.hero-stats,.howto,.install-box,.featured-kaptain-inner,.note,.home-card){
 background:var(--card)!important;background-image:none!important;
 color:var(--text)!important;border-color:var(--border)!important;
 box-shadow:none!important;
}
html.um-subpage-refined :is(.toolbar,.tabs-wrap){
 background:var(--bg)!important;background-image:none!important;border-color:var(--border)!important;
}
html.um-subpage-refined :is(.tab,.btn-ghost,.back,.action-link,.like-btn,.btn-close-modal){
 color:var(--text)!important;background:var(--card)!important;
 border-color:var(--border2)!important;
}
html.um-subpage-refined :is(.tab.active,.copy-btn,.btn-accent,.featured-kaptain-action,.primary,.btn-download){
 background:var(--violet)!important;background-image:none!important;color:white!important;
}
html.um-subpage-refined :is(.set-name,.row-title,.card-title,.title,.version-title,.addon-name){
 color:var(--text)!important;
}
html.um-subpage-light :is(h1,.hero h1,.install-box h3,.header-title,.um-changelog-title,.card-title,.title){
 color:var(--text)!important;-webkit-text-fill-color:var(--text)!important;
 text-shadow:none!important;
}
html.um-subpage-light :is(h1 span,.hero h1 span:last-child){
 background:none!important;-webkit-background-clip:initial!important;
 -webkit-text-fill-color:var(--violet)!important;color:var(--violet)!important;
}
html.um-subpage-light :is(.set-meta a,.set-url a,.nav-logo span,.logo span){
 color:var(--violet2)!important;
}
html.um-subpage-light .nav-logo span,html.um-subpage-light .logo span{
 background:none!important;-webkit-text-fill-color:var(--violet)!important;
}
/* Avoid modifying images and preview badges: they need their original artwork. */
html.um-subpage-light :is(.set-preview,.badge-img,.av img,.card-cover,.card-cover-grid){
 color:inherit;
}
/* Help landing cards are actual links and need a neutral, readable surface. */
html.um-subpage-refined[data-um-subpage="help"] .card{
 background:var(--card)!important;border-color:var(--border)!important;
}
html.um-subpage-refined[data-um-subpage="help"] :is(.arrow,.brand-copy strong,.brand-copy small){
 color:var(--text)!important;
}
html.um-subpage-light[data-um-subpage="help"] .brand-copy small{color:var(--violet)!important;}
html.um-subpage-refined[data-um-subpage="help"] .card::before{opacity:.055!important;}
/* Gallery copy is not all variable-backed in the original page. */
html.um-subpage-refined[data-um-subpage="gallery"] :is(.card-desc,.modal-desc,.modal-author,.card-author,.featured-kaptain-meta){
 color:var(--muted)!important;
}
html.um-subpage-refined[data-um-subpage="gallery"] .featured-kaptain-inner{
 background:var(--card)!important;
}
html.um-subpage-refined[data-um-subpage="gallery"] .modal,
html.um-subpage-refined[data-um-subpage="gallery"] .submit-modal{
 background:var(--card)!important;color:var(--text)!important;
}
/* Per-page contrast fixes. These are text/surface only, not data widgets. */
html.um-subpage-light[data-um-subpage="avatars"] #nuvioAvatarBanner > div{
 background:#fff!important;background-image:none!important;border-color:var(--border)!important;
}
html.um-subpage-light[data-um-subpage="avatars"] #nuvioAvatarBanner [data-i18n="avatars.banner.linkTitle"]{
 color:var(--text)!important;-webkit-text-fill-color:var(--text)!important;
}
html.um-subpage-light[data-um-subpage="avatars"] #nuvioAvatarBanner input{
 background:var(--card)!important;color:var(--text)!important;
}
html.um-subpage-light[data-um-subpage="gallery"] .featured-kaptain :is(h2,p,.featured-kaptain-meta){
 color:var(--text)!important;-webkit-text-fill-color:var(--text)!important;
}
html.um-subpage-light[data-um-subpage="gallery"] .featured-kaptain :is(p,.featured-kaptain-meta){
 color:var(--muted)!important;-webkit-text-fill-color:var(--muted)!important;
}
html.um-subpage-light[data-um-subpage="gallery"] .featured-kaptain-eyebrow{
 color:var(--violet)!important;-webkit-text-fill-color:var(--violet)!important;
}
html.um-subpage-refined[data-um-subpage="changelog"] .changelog-tabs{
 background:var(--bg)!important;background-image:none!important;
 border-radius:12px!important;
}
html.um-subpage-refined[data-um-subpage="changelog"] .changelog-tabs button{
 background:var(--card)!important;color:var(--text)!important;
 border:1px solid var(--border2)!important;
 -webkit-text-fill-color:var(--text)!important;
}
/* Existing tab controller changes the inline background to var(--accent).
   Match that state rather than introducing a competing click handler. */
html.um-subpage-refined[data-um-subpage="changelog"] .changelog-tabs button:is(.active,[style*="--accent"]){
 background:var(--violet)!important;color:#fff!important;
 -webkit-text-fill-color:#fff!important;border-color:var(--violet)!important;
}
html.um-subpage-light[data-um-subpage="settings"] :is(.row-title,.action-link,.back-button){
 color:var(--text)!important;
}
html.um-subpage-refined[data-um-subpage="settings"] .row{
 border-bottom-color:var(--border)!important;
}
/* FAQ legacy colours used pale text on pale cards in Refined Light. */
html.um-subpage-refined[data-um-subpage="faq"] .quick{
 background:transparent!important;border:0!important;box-shadow:none!important;
}
html.um-subpage-refined[data-um-subpage="faq"] .quick a{
 background:var(--card)!important;color:var(--text)!important;
 border-color:var(--border)!important;
}
html.um-subpage-refined[data-um-subpage="faq"] .faq details{
 background:var(--card)!important;background-image:none!important;
 border-color:var(--border)!important;
}
html.um-subpage-refined[data-um-subpage="faq"] .faq :is(summary,.answer strong){
 color:var(--text)!important;
}
html.um-subpage-refined[data-um-subpage="faq"] .answer{
 color:var(--muted)!important;
}
html.um-subpage-refined[data-um-subpage="faq"] .answer a,
html.um-subpage-refined[data-um-subpage="faq"] .faq summary::after{
 color:var(--violet2)!important;
}
html.um-subpage-refined[data-um-subpage="faq"] .links a{
 color:var(--text)!important;background:var(--card)!important;
 border-color:var(--border)!important;
}
html.um-subpage-refined[data-um-subpage="faq"] footer{
 color:var(--muted)!important;border-color:var(--border)!important;
}
/* Site-wide secondary navigation: keep pinned headers neutral. */
html.um-subpage-refined :is(.topbar,.sidebar,.mobile-menu,.nav-links,.changelog-tabs){
 background:var(--um-page-header)!important;border-color:var(--border)!important;
}
html.um-subpage-light :is(.topbar-title,.card-features,.section-sub,.brand-copy,.field-hint){
 color:var(--muted)!important;
}
/* Landing page keeps its identity and branded hero typography. */
html.um-subpage-light[data-um-subpage="index"] .hero h1 .accent{
 background:linear-gradient(120deg,#6255be,#ad5b9f)!important;
 -webkit-background-clip:text!important;background-clip:text!important;
 -webkit-text-fill-color:transparent!important;
}
html.um-subpage-refined[data-um-subpage="index"] :is(.community-inner,.trending-item,.eco-node){
 border-color:var(--border)!important;
}
html.um-subpage-light[data-um-subpage="index"] :is(.community-inner,.trending-item,.eco-node){
 color:var(--text)!important;background:var(--card)!important;
}
html.um-subpage-light[data-um-subpage="index"] :is(.section-title,.eco-title,.card h3,.community h2){
 color:var(--text)!important;
}
/* Legacy Delete Setup form: readable warning copy in Light. Preserve red action. */
html.um-subpage-light[data-um-subpage="delete-account"] :is(.lead,.small,.back,.brand){
 color:var(--muted)!important;
}
html.um-subpage-light[data-um-subpage="delete-account"] :is(.small a,.brand){
 color:var(--violet)!important;
}
html.um-subpage-refined[data-um-subpage="delete-account"] .warning{
 background:var(--card)!important;
 border-color:rgba(217,69,93,.4)!important;
}
/* Status cards retain red/green genuine statuses; only their surfaces change. */
html.um-subpage-refined[data-um-subpage="status"] :is(.service-item,.overall-bar){
 background:var(--card)!important;background-image:none!important;
 color:var(--text)!important;border:1px solid var(--border)!important;
 box-shadow:none!important;
}
html.um-subpage-refined[data-um-subpage="status"] :is(.service-name,.overall-title){
 color:var(--text)!important;
}
html.um-subpage-refined[data-um-subpage="status"] :is(.service-desc,.overall-sub){
 color:var(--muted)!important;
}
/* Small authentication/verification routes: original hardcoded dark panels. */
html.um-subpage-refined:is([data-um-subpage="reset-password"],
 [data-um-subpage="verify-email"],[data-um-subpage="ultraplay-unlock"]) main{
 background:var(--card)!important;background-image:none!important;
 border:1px solid var(--border)!important;color:var(--text)!important;
 box-shadow:none!important;
}
html.um-subpage-refined:is([data-um-subpage="reset-password"],
 [data-um-subpage="verify-email"],[data-um-subpage="ultraplay-unlock"]) main h1{
 color:var(--text)!important;
}
html.um-subpage-refined:is([data-um-subpage="reset-password"],
 [data-um-subpage="verify-email"],[data-um-subpage="ultraplay-unlock"]) main :is(p,label,.small,.status){
 color:var(--muted)!important;
}
html.um-subpage-refined:is([data-um-subpage="reset-password"],
 [data-um-subpage="verify-email"],[data-um-subpage="ultraplay-unlock"]) main .small strong{
 color:var(--text)!important;
}
html.um-subpage-light:is([data-um-subpage="reset-password"],
 [data-um-subpage="verify-email"],[data-um-subpage="ultraplay-unlock"]) main :is(.error,.status.error,#status.error){
 color:#a92345!important;
}
/* Verification page: legacy CSS lets grid min-content widen phone screens. */
html.um-subpage-refined[data-um-subpage="verify-email"] body{
 box-sizing:border-box!important;width:100%!important;max-width:100vw!important;
 grid-template-columns:minmax(0,1fr)!important;
 overflow-x:hidden!important;padding:14px!important;
}
html.um-subpage-refined[data-um-subpage="verify-email"] main{
 box-sizing:border-box!important;
 width:min(100%,460px)!important;min-width:0!important;
 max-width:100%!important;margin-inline:auto!important;
 overflow-wrap:anywhere!important;
}
/* Keep the existing native dock usable, with enough room below any scrollable page. */
@media(max-width:820px){
 html.native-app.um-subpage-refined body{padding-bottom:calc(100px + env(safe-area-inset-bottom))!important;}
 html.um-subpage-refined :is(.hero,.hero-section){padding-top:30px!important;padding-bottom:25px!important;}
 html.um-subpage-refined[data-um-subpage="avatars"] header{padding-top:38px!important;}
}
@media(prefers-reduced-motion:reduce){
 html.um-subpage-refined .particle{animation:none!important;}
}