/* Nova global theme bridge
   Makes Theme Studio / presets propagate through the whole shell instead of
   only changing the homepage accent. Uses the existing Nova theme variables,
   so holiday palettes and built-in themes benefit too. */

:root{
  --theme-accent-soft:color-mix(in srgb,var(--accent) 14%,transparent);
  --theme-accent-mid:color-mix(in srgb,var(--accent) 28%,transparent);
  --theme-accent-strong:color-mix(in srgb,var(--accent) 48%,transparent);
  --theme-accent2-soft:color-mix(in srgb,var(--accent2) 14%,transparent);
  --theme-panel:color-mix(in srgb,var(--s1) 88%,transparent);
  --theme-panel-strong:color-mix(in srgb,var(--bg2) 94%,var(--accent) 6%);
  --theme-panel-hover:color-mix(in srgb,var(--s1) 82%,var(--accent) 18%);
  --theme-line:color-mix(in srgb,var(--accent) 18%,transparent);
  --theme-line-strong:color-mix(in srgb,var(--accent) 38%,transparent);
  --theme-shadow:color-mix(in srgb,var(--accent) 16%,transparent);
}

/* Background ambience follows the selected palette. */
.a1{background:radial-gradient(circle,color-mix(in srgb,var(--accent) 12%,transparent) 0,color-mix(in srgb,var(--accent2) 6%,transparent) 42%,transparent 72%)!important}
.a2{background:radial-gradient(circle,color-mix(in srgb,var(--accent2) 11%,transparent) 0,color-mix(in srgb,var(--accent) 5%,transparent) 42%,transparent 72%)!important}
#cursor-light{background:radial-gradient(circle,color-mix(in srgb,var(--accent) 10%,transparent) 0,color-mix(in srgb,var(--accent2) 4%,transparent) 36%,transparent 68%)!important}

/* Main navigation / Nova Island. */
.top-nav{
  background:color-mix(in srgb,var(--bg) 91%,transparent)!important;
  border-bottom-color:var(--theme-line)!important;
  box-shadow:0 8px 28px color-mix(in srgb,var(--bg) 70%,transparent),0 1px 0 var(--theme-accent-soft)!important;
}
.top-nav::before,.top-nav::after{background:linear-gradient(90deg,transparent,var(--theme-accent-mid),var(--theme-accent-strong),var(--theme-accent-mid),transparent)!important}
.ndiv{background:var(--theme-line)!important}
.nav-tab:hover{background:var(--theme-accent-soft)!important;border-color:var(--theme-line)!important;color:var(--text)!important}
.nav-tab.active{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--white)!important;box-shadow:0 0 18px var(--theme-shadow),inset 0 1px 0 var(--theme-accent-mid)!important}

#nova-island{
  background:color-mix(in srgb,var(--bg2) 96%,var(--accent) 4%)!important;
  box-shadow:0 4px 24px var(--theme-shadow)!important;
}
#nova-island::after{background:linear-gradient(135deg,var(--accent),var(--accent2))!important}
#nova-island.open{
  background:color-mix(in srgb,var(--bg2) 94%,var(--accent) 6%)!important;
  box-shadow:0 0 0 1px var(--theme-line),0 10px 42px color-mix(in srgb,var(--bg) 68%,transparent),0 34px 84px color-mix(in srgb,var(--bg) 60%,transparent)!important;
}
#nova-island.open::before{background:linear-gradient(90deg,transparent,var(--accent),var(--accent2),transparent)!important}
#nova-island-close,.ni-tab,.ni-page-item,.ni-action,.ni-profile-card,.ni-friend-row,.ni-message-row{
  border-color:var(--theme-line)!important;
}
#nova-island-close,.ni-page-icon,.ni-action-icon{background:var(--theme-accent-soft)!important;color:var(--accent)!important}
.ni-page-item:hover,.ni-page-item.active,.ni-tab:hover,.ni-tab.active,.ni-action:hover{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important}

/* Page titles, sections and common cards. */
.page-title,.page-heading,.settings-title,.sn-panel-heading h2,.sn-overview-copy h2,.support-card-title,.dev-tool-label{color:var(--white)!important}
.page-subtitle,.settings-subtitle,.settings-card-title span,.setting-desc,.support-card-desc,.dev-tool-sub{color:var(--muted)!important}

.game-card,.app-card,.movie-card,.support-card,.settings-block,.settings-panel,.settings-card-wide,
.sn-card,.sn-panel,.sn-overview-card,.sn-cloud-card,.dev-tool-card,.dev-info-table,.support-faq-item,
.plan-card,.reward-card,.ticket-card,.social-panel,.social-card,.profile-card,.friend-card,
.home-stats--summary,.recent-card,.bookmark-chip{
  background:var(--theme-panel)!important;
  border-color:var(--theme-line)!important;
  box-shadow:0 12px 34px color-mix(in srgb,var(--bg) 45%,transparent),inset 0 1px 0 color-mix(in srgb,var(--white) 4%,transparent)!important;
}
.game-card:hover,.app-card:hover,.movie-card:hover,.support-card:hover,.settings-block:hover,.settings-panel:hover,
.sn-card:hover,.dev-tool-card:hover,.support-faq-item:hover,.plan-card:hover,.reward-card:hover,.ticket-card:hover,
.recent-card:hover,.bookmark-chip:hover{
  background:var(--theme-panel-hover)!important;
  border-color:var(--theme-line-strong)!important;
  box-shadow:0 16px 42px var(--theme-shadow)!important;
}

/* Inputs and controls throughout settings, auth, social, search and admin. */
input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),textarea,select,
.setting-input,.social-input,.acct-input,.admin-input,.ticket-input{
  background:color-mix(in srgb,var(--bg2) 88%,var(--accent) 12%)!important;
  color:var(--text)!important;
  border-color:var(--theme-line)!important;
}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--muted) 85%,transparent)!important}
input:focus,textarea:focus,select:focus,.setting-input:focus,.social-input:focus,.acct-input:focus{
  border-color:var(--theme-line-strong)!important;
  box-shadow:0 0 0 2px var(--theme-accent-soft),0 0 20px var(--theme-shadow)!important;
}
input[type="range"]{accent-color:var(--accent)!important}
input[type="checkbox"],input[type="radio"]{accent-color:var(--accent)!important}

.glass-pill,.glass-pill--home{
  background:color-mix(in srgb,var(--bg2) 76%,transparent)!important;
  border-color:var(--theme-line)!important;
  box-shadow:0 16px 46px color-mix(in srgb,var(--bg) 44%,transparent),0 0 26px var(--theme-shadow)!important;
}
.glass-pill:focus-within{border-color:var(--theme-line-strong)!important;box-shadow:0 16px 48px color-mix(in srgb,var(--bg) 44%,transparent),0 0 34px var(--theme-shadow)!important}
.pill-sep{background:var(--theme-line)!important}

/* Buttons: leave semantic danger/success buttons alone, but theme Nova actions. */
.save-btn:not(.danger),.primary-btn,.settings-btn,.support-card-btn:not(.support-card-btn--muted),
.key-change-btn,.cloak-favicon-picker-btn,.account-nav-btn,.sn-btn,.sn-action-btn,.dev-badge,
.social-send-btn,.social-action-btn,.ticket-action-btn,.game-action-btn{
  background:var(--theme-accent-soft)!important;
  border-color:var(--theme-line-strong)!important;
  color:var(--accent)!important;
}
.save-btn.primary,.primary-btn.primary,.sn-btn.primary,.social-send-btn,.game-action-btn.primary{
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;
  border-color:color-mix(in srgb,var(--accent) 62%,var(--white) 10%)!important;
  color:var(--bg)!important;
  box-shadow:0 8px 24px var(--theme-shadow)!important;
}
.save-btn:not(.danger):hover,.primary-btn:hover,.settings-btn:hover,.support-card-btn:hover:not(:disabled),
.key-change-btn:hover,.cloak-favicon-picker-btn:hover,.sn-btn:hover,.sn-action-btn:hover,.social-action-btn:hover{
  background:var(--theme-accent-mid)!important;
  border-color:var(--accent)!important;
  color:var(--white)!important;
}

/* Toggle switches and chips. */
.toggle-track,.theme-toggle,.settings-chip,.theme-opt,.sn-theme-chip,.settings-tab,.settings-nav-item{
  border-color:var(--theme-line)!important;
  background:color-mix(in srgb,var(--bg2) 84%,var(--accent) 16%)!important;
}
.toggle-switch input:checked + .toggle-track{background:linear-gradient(90deg,var(--accent2),var(--accent))!important;border-color:var(--accent)!important}
.toggle-thumb{background:var(--white)!important}
.settings-chip.active,.theme-opt.active,.sn-theme-chip.active,.settings-tab.active,.settings-nav-item.active{
  background:var(--theme-accent-soft)!important;
  border-color:var(--theme-line-strong)!important;
  color:var(--accent)!important;
  box-shadow:0 0 18px var(--theme-shadow)!important;
}

/* Settings page should visibly become the selected theme. */
#page-settings{background:radial-gradient(circle at 12% 4%,var(--theme-accent-soft),transparent 28%),radial-gradient(circle at 88% 92%,var(--theme-accent2-soft),transparent 30%)!important}
#page-settings .settings-sidebar,#page-settings .settings-nav,#page-settings .settings-section-nav{
  background:color-mix(in srgb,var(--bg2) 82%,transparent)!important;
  border-color:var(--theme-line)!important;
}
#page-settings .settings-kicker,#page-settings .settings-card-title strong,#page-settings .setting-label{color:var(--white)!important}
#page-settings .settings-range-row output{border-color:var(--theme-line)!important;background:var(--theme-accent-soft)!important;color:var(--accent)!important}
#page-settings .settings-avatar-editor{background:radial-gradient(circle at 50% 32%,var(--theme-accent-soft),transparent 50%),color-mix(in srgb,var(--bg2) 88%,transparent)!important;border-color:var(--theme-line)!important}
#page-settings .settings-avatar-orbit{border-color:var(--theme-line)!important;box-shadow:0 0 34px var(--theme-shadow)!important}

/* Theme Studio itself should preview the palette everywhere around the editor. */
#page-supernova,.sn-workspace,.sn-theme-studio{
  background:radial-gradient(circle at 10% 0,var(--theme-accent-soft),transparent 28%),radial-gradient(circle at 90% 100%,var(--theme-accent2-soft),transparent 30%)!important;
}
.sn-preview,.sn-theme-preview,.sn-preview-shell{
  border-color:var(--theme-line-strong)!important;
  background:linear-gradient(145deg,var(--bg2),color-mix(in srgb,var(--s1) 88%,var(--accent) 12%))!important;
}

/* Social / messaging. Keep the same layout, theme the chrome. */
.social-shell,.social-sidebar,.social-conversation,.social-chat-panel,.social-dm-panel{
  background:color-mix(in srgb,var(--bg2) 93%,var(--accent) 7%)!important;
  border-color:var(--theme-line)!important;
}
.social-sidebar-item:hover,.social-sidebar-item.active,.social-channel-row:hover,.social-channel-row.active,
.social-friend-row:hover,.social-friend-row.active{background:var(--theme-accent-soft)!important}
.social-msg.own .social-msg-bubble,.social-msg-self .social-msg-bubble{
  background:color-mix(in srgb,var(--accent) 22%,var(--bg2))!important;
  border-color:var(--theme-line-strong)!important;
}
.social-msg:not(.own) .social-msg-bubble{background:color-mix(in srgb,var(--s1) 92%,var(--accent) 8%)!important;border-color:var(--theme-line)!important}
.nova-reply-bar{background:var(--theme-accent-soft)!important;border-color:var(--theme-line)!important}
.social-msg-actions,.social-reaction-picker,.social-context-menu{background:var(--theme-panel-strong)!important;border-color:var(--theme-line)!important;box-shadow:0 14px 36px color-mix(in srgb,var(--bg) 64%,transparent)!important}

/* Account/auth, rewards, support, admin and dialogs. */
.acct-modal-box,.modal-box,.dialog-box,.rewards-modal-box,.support-modal,.admin-modal,.sn-command-palette-box,
#inspect-panel,#nova-orbit-panel{
  background:color-mix(in srgb,var(--bg2) 96%,var(--accent) 4%)!important;
  color:var(--text)!important;
  border-color:var(--theme-line-strong)!important;
  box-shadow:0 24px 80px color-mix(in srgb,var(--bg) 72%,transparent),0 0 50px var(--theme-shadow)!important;
}
.acct-modal-header,.modal-header,.dialog-header,.settings-section-header,.social-header{
  border-color:var(--theme-line)!important;
}

/* Tables / rows / separators. */
.settings-row,.setting-row,.dev-info-row,.admin-row,.ticket-row,.reward-row,.social-list-row,
.sn-row,.acct-row{border-color:var(--theme-line)!important}
table,thead,tbody,tr,th,td{border-color:var(--theme-line)!important}
th{color:var(--muted)!important;background:color-mix(in srgb,var(--bg2) 88%,var(--accent) 12%)!important}

/* Scrollbars become part of the palette. */
*{scrollbar-color:color-mix(in srgb,var(--accent) 40%,transparent) color-mix(in srgb,var(--bg2) 80%,transparent)}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 38%,transparent)!important;border-color:transparent!important}
*::-webkit-scrollbar-track{background:color-mix(in srgb,var(--bg2) 74%,transparent)!important}

/* Selection/focus states. */
::selection{background:color-mix(in srgb,var(--accent) 38%,transparent);color:var(--white)}
:focus-visible{outline-color:var(--accent)!important}

/* Keep semantic status colors meaningful while giving their containers the theme. */
.status-online,.presence-online{box-shadow:0 0 10px color-mix(in srgb,#4ade80 55%,var(--accent) 25%)!important}

/* Home footer/labels, icons and decorative lines. */
.nexus-footer-logo,.nexus-footer-link,.home-section-action,.home-stat-num,.settings-kicker,
.sn-card-icon,.ni-page-icon,.support-card-btn,.dev-badge{color:var(--accent)!important}
.home-stat-div,.section-divider,.settings-divider,.sn-divider{background:var(--theme-line)!important}
.nexus-footer{color:var(--muted)!important}

/* Light mode still uses selected accent but keeps readable surfaces. */
html[data-theme="light"]{
  --theme-panel:color-mix(in srgb,var(--s1) 86%,white 14%);
  --theme-panel-strong:color-mix(in srgb,var(--bg2) 92%,var(--accent) 8%);
}

/* =====================================================================
   THEME BRIDGE V2 — hard-coded legacy surfaces
   These screens historically carried their own fixed navy/purple colors.
   Force them to consume the same Nova palette as Theme Studio / holidays.
   ===================================================================== */

/* Whole-page surfaces */
#page-games,#page-apps,#page-movies,#page-support,#page-plans,#page-rewards,#page-supernova,#page-settings,#page-dev,#page-game-detail{
  color:var(--text)!important;
}
#page-game-detail,
#page-dev,
#page-movies .content-page,
#page-support .content-page,
#page-rewards .content-page,
#page-plans .content-page{
  background-color:var(--bg)!important;
}

/* Game detail — preserve art, theme all chrome around it. */
#page-game-detail{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 97%,var(--accent) 3%),var(--bg))!important}
#game-detail-hero{background-color:var(--bg)!important}
#game-detail-hero:after{background:linear-gradient(180deg,transparent,var(--bg))!important}
#game-detail-title,.game-detail-info strong,.game-detail-related h2,.game-detail-rate-copy h2{color:var(--white)!important}
.game-detail-description-wrap #game-detail-description,.game-detail-info small,.game-detail-rate-copy p{color:var(--muted)!important}
.game-detail-info,.game-detail-rate,.game-detail-related{background:color-mix(in srgb,var(--bg) 96%,var(--accent) 4%)!important;border-color:var(--theme-line)!important}
.game-detail-info article{border-color:var(--theme-line)!important}
.game-detail-info-icon,.game-detail-rate-icon{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--accent)!important}
.game-detail-info span,.game-detail-rate-copy span,.game-detail-related header>div>span{color:var(--accent)!important}
#game-detail-play{background:linear-gradient(135deg,var(--accent),var(--accent2))!important;color:var(--bg)!important;border-color:var(--accent)!important;box-shadow:0 10px 30px var(--theme-shadow)!important}
#game-detail-favorite,#game-detail-share,.game-detail-related header button{background:var(--theme-panel)!important;border-color:var(--theme-line)!important;color:var(--text)!important}
#game-detail-favorite:hover,#game-detail-share:hover,.game-detail-related header button:hover{background:var(--theme-panel-hover)!important;border-color:var(--theme-line-strong)!important}
.game-detail-related-card{background:var(--theme-panel)!important;border-color:var(--theme-line)!important;color:var(--white)!important}
.game-detail-related-card:hover{border-color:var(--theme-line-strong)!important;box-shadow:0 18px 40px var(--theme-shadow)!important}
#game-detail-rating-stars button{background:var(--theme-panel)!important;border-color:var(--theme-line)!important;color:color-mix(in srgb,var(--accent) 50%,var(--muted))!important}
#game-detail-rating-stars button.preview,#game-detail-rating-stars button.selected{background:var(--theme-accent-soft)!important;border-color:var(--accent)!important;color:var(--accent)!important}

/* Movies — keep movie artwork, theme the catalog chrome and player. */
#page-movies .content-page{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 96%,var(--accent) 4%),var(--bg))!important}
#movies-hero{border-color:var(--theme-line)!important;box-shadow:0 18px 54px color-mix(in srgb,var(--bg) 65%,transparent)!important}
.movies-hero-shade{background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 96%,transparent) 0%,color-mix(in srgb,var(--bg) 72%,transparent) 48%,color-mix(in srgb,var(--bg) 18%,transparent) 100%)!important}
#movies-hero-kicker,.movies-watermark,.movies-player-brand{color:var(--accent)!important}
#movies-hero-play{background:linear-gradient(135deg,var(--accent),var(--accent2))!important;color:var(--bg)!important;border-color:var(--accent)!important}
#movies-hero-preview{background:var(--theme-panel)!important;border-color:var(--theme-line)!important;color:var(--white)!important}
#page-movies .movies-controls-wrap,#page-movies .movies-search-pill,#page-movies #movies-genre-bar{background:var(--theme-panel)!important;border-color:var(--theme-line)!important}
.movie-genre-btn{color:var(--muted)!important}
.movie-genre-btn:hover,.movie-genre-btn.active{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--accent)!important}
#page-movies .movie-card{background:var(--theme-panel)!important;border-color:var(--theme-line)!important}
#page-movies .movie-card:hover{border-color:var(--theme-line-strong)!important;box-shadow:0 14px 36px var(--theme-shadow)!important}
.movies-player-shell,.movies-player-topbar,.movies-player-info{background:var(--theme-panel-strong)!important;border-color:var(--theme-line)!important}
#movies-player-close{background:var(--theme-accent-soft)!important;border-color:var(--theme-line)!important;color:var(--accent)!important}

/* Support/tickets */
#page-support .support-ticket-shell,#page-support .support-ticket-panel,#page-support .support-ticket-sidebar,
#page-support .support-ticket-thread,#page-support .support-ticket-header,
#page-support .support-card,#page-support .support-faq-item{
  background:var(--theme-panel)!important;
  border-color:var(--theme-line)!important;
}
#page-support .support-ticket-shell{box-shadow:0 18px 52px color-mix(in srgb,var(--bg) 58%,transparent)!important}
#page-support .support-ticket-header,#page-support .support-ticket-sidebar{border-color:var(--theme-line)!important}
#page-support .support-kicker,#page-support .support-ticket-kicker,#page-support .support-card-icon{color:var(--accent)!important}
#page-support .support-ticket-item:hover,#page-support .support-ticket-item.active{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important}
#page-support .support-new-ticket-btn,#page-support .support-ticket-send{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--accent)!important}

/* Supernova — replace its fixed gold/pink/purple chrome with current palette. */
.sn-hub-v2{
  --sn-gold:var(--accent)!important;
  --sn-pink:var(--accent2)!important;
  --sn-violet:var(--accent)!important;
  --sn-cyan:color-mix(in srgb,var(--accent) 55%,var(--accent2))!important;
  --sn-line:var(--theme-line)!important;
  --sn-surface:var(--theme-panel)!important;
}
.sn-hub-v2 .sn-panels,.sn-hub-v2 .sn-panel,.sn-control-card,.sn-workspace-card,.sn-command-box,.sn-island-preview,.sn-identity-preview,.sn-overview-card,.sn-cloud-card{
  background:var(--theme-panel)!important;border-color:var(--theme-line)!important;
}
.sn-hub-v2 .sn-section-tabs{background:color-mix(in srgb,var(--bg2) 84%,transparent)!important;border-color:var(--theme-line)!important}
.sn-hub-v2 .sn-section-tab:hover,.sn-hub-v2 .sn-section-tab.active{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--white)!important;box-shadow:0 0 24px var(--theme-shadow)!important}
.sn-brand-star,.sn-card-icon{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--accent)!important;box-shadow:0 0 26px var(--theme-shadow)!important}
.sn-hub-v2 select,.sn-hub-v2 input,.sn-hub-v2 textarea{background:color-mix(in srgb,var(--bg2) 88%,var(--accent) 12%)!important;border-color:var(--theme-line)!important;color:var(--text)!important}
.sn-hub-v2 input[type=range]{accent-color:var(--accent)!important}
.sn-pro-badge,.sn-tab-pro-tag{background:linear-gradient(135deg,var(--accent),var(--accent2))!important;color:var(--bg)!important}

/* Admin / Nova Control — this page had a fully separate fixed-purple design. */
#page-dev{
  --admin-bg:var(--bg)!important;
  --admin-panel:color-mix(in srgb,var(--bg2) 94%,var(--accent) 6%)!important;
  --admin-panel-2:color-mix(in srgb,var(--s1) 90%,var(--accent) 10%)!important;
  --admin-line:var(--theme-line)!important;
  --admin-line-strong:var(--theme-line-strong)!important;
  --admin-accent:var(--accent)!important;
  --admin-text:var(--text)!important;
  background:var(--bg)!important;
}
#page-dev .nova-admin-shell,#page-dev .nova-admin-sidebar,#page-dev .nova-admin-main,#page-dev .nova-admin-topbar,
#page-dev .nova-admin-card,#page-dev .nova-admin-panel,#page-dev .nova-admin-table-wrap,#page-dev .nova-admin-report-card,
#page-dev .nova-admin-maintenance-control,#page-dev .nova-admin-drawer,#page-dev .nova-admin-dialog,
#page-dev .nova-admin-filter-tabs,#page-dev .nova-admin-state,#page-dev .nova-admin-loading{
  background:var(--admin-panel)!important;border-color:var(--theme-line)!important;color:var(--text)!important;
}
#page-dev .nova-admin-sidebar{background:color-mix(in srgb,var(--bg) 94%,var(--accent) 6%)!important}
#page-dev .nova-admin-topbar{background:color-mix(in srgb,var(--bg) 90%,var(--accent) 10%)!important}
#page-dev .nova-admin-nav-item:hover,#page-dev .nova-admin-nav-item.active,#page-dev .nova-admin-filter-tabs button.active{
  background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--white)!important;
}
#page-dev .nova-admin-brand-mark,#page-dev .nova-admin-kicker,#page-dev .nova-admin-row-action,#page-dev .nova-admin-section-kicker,
#page-dev .nova-admin-stat-card::before{color:var(--accent)!important;border-color:var(--theme-line-strong)!important}
#page-dev .nova-admin-stat-card,#page-dev .nova-admin-quick-action,#page-dev .nova-admin-proxy-record,#page-dev .nova-admin-device-ban-record{
  background:var(--theme-panel)!important;border-color:var(--theme-line)!important;
}
#page-dev .nova-admin-stat-card:hover,#page-dev .nova-admin-quick-action:hover{background:var(--theme-panel-hover)!important;border-color:var(--theme-line-strong)!important}
#page-dev .nova-admin-avatar,#page-dev .nova-admin-symbol,#page-dev .nova-admin-value-action{
  background:var(--theme-accent-soft)!important;border-color:var(--theme-line)!important;color:var(--accent)!important;
}
#page-dev .nova-admin-input,#page-dev input,#page-dev select,#page-dev textarea{
  background:color-mix(in srgb,var(--bg2) 88%,var(--accent) 12%)!important;border-color:var(--theme-line)!important;color:var(--text)!important;
}
#page-dev .nova-admin-action-primary,#page-dev .nova-admin-btn-primary{
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;border-color:var(--accent)!important;color:var(--bg)!important;
}
#page-dev .nova-admin-spinner{border-color:var(--theme-line)!important;border-top-color:var(--accent)!important}

/* Browser chrome inside Nova */
#page-browser .browser-tab-bar,#page-browser .browser-toolbar,#page-browser .browser-url-wrap,#page-browser .browser-controls{
  background:color-mix(in srgb,var(--bg2) 94%,var(--accent) 6%)!important;border-color:var(--theme-line)!important;
}
#page-browser .browser-tab-item{background:var(--theme-panel)!important;border-color:var(--theme-line)!important}
#page-browser .browser-tab-item:hover,#page-browser .browser-tab-item.active{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;box-shadow:0 0 16px var(--theme-shadow)!important}
#page-browser .browser-new-tab-btn,#page-browser .browser-tab-close:hover{color:var(--accent)!important;background:var(--theme-accent-soft)!important;border-color:var(--theme-line)!important}

/* Generic legacy classes that still used fixed purple. */
.nap-card,.nap-stat-card,.nap-key-item,.nap-acc-card,.nap-table-header,.nap-input,.nap-select,.nap-btn,
.browser-tab-item,.browser-new-tab-btn,.social-uno-start,.social-uno-invite{
  border-color:var(--theme-line)!important;
}
.nap-card,.nap-stat-card,.nap-key-item,.nap-acc-card,.nap-table-header,.nap-input,.nap-select,.nap-btn{
  background:var(--theme-panel)!important;color:var(--text)!important;
}
.nap-nav-btn:hover,.nap-nav-btn.active,.nap-btn:hover,.nap-btn-accent,.nap-stat-chip{background:var(--theme-accent-soft)!important;border-color:var(--theme-line-strong)!important;color:var(--accent)!important}
.nap-stat-val,.nap-section-label,.nap-bar-count{color:var(--accent)!important}
.nap-bar-track{background:var(--theme-accent-soft)!important}.nap-bar-fill{background:linear-gradient(90deg,var(--accent2),var(--accent))!important}

/* =====================================================================
   V2.1 CORRECTIONS
   Keep pages that already had intentional layouts/surfaces unchanged,
   and keep Nova Island tabs as simple text tabs with the sliding line.
   ===================================================================== */

/* Rewards, Plans, and Support already had their own polished surfaces.
   Do not paint a new full-page Theme Bridge background over them. */
#page-support .content-page,
#page-rewards .content-page,
#page-plans .content-page{
  background-color:transparent!important;
  background-image:none!important;
}

/* Restore the existing page-native card treatment on those sections. */
#page-support .support-card,
#page-support .support-faq-item{
  background:var(--glass-bg)!important;
  border-color:var(--glass-b)!important;
  box-shadow:none!important;
}
#page-support .support-card:hover,
#page-support .support-faq-item:hover{
  background:var(--glass-bg-h)!important;
  border-color:var(--glass-bh)!important;
  box-shadow:none!important;
}
#page-plans .plan-card{
  background:var(--glass-bg)!important;
  border-color:var(--glass-b)!important;
  box-shadow:none;
}
#page-plans .plan-card:hover{
  border-color:var(--glass-bh)!important;
  box-shadow:none;
}
#page-rewards .reward-card{
  background:var(--glass-bg)!important;
  border-color:var(--glass-b)!important;
  box-shadow:none!important;
}

/* Nova Island tabs should never become big filled hover/active rectangles. */
#nova-island .ni-tab,
#nova-island .ni-tab:hover,
#nova-island .ni-tab.active{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
#nova-island .ni-tab:hover:not(.active){
  color:color-mix(in srgb,var(--white) 66%,var(--muted))!important;
}
#nova-island .ni-tab.active{
  color:var(--white)!important;
}

/* =====================================================================
   V2.2 CORRECTIONS — preserve native page surfaces, theme the accents.
   ===================================================================== */

/* Support / Plans / Rewards were already designed correctly. Holiday
   scenery must not bleed through these pages. Keep their original solid
   Nova page surface while still allowing their existing accent variables. */
#page-support,
#page-plans,
#page-rewards{
  background:var(--bg)!important;
  background-image:none!important;
}
#page-support .content-page,
#page-plans .content-page,
#page-rewards .content-page{
  background:var(--bg)!important;
  background-image:none!important;
}

/* Nova Control: theme accents, not giant slabs of the accent color. */
#page-dev .nova-v7-admin{
  --admin-bg:#07070c!important;
  --admin-panel:#0d0d14!important;
  --admin-raised:#12121b!important;
  --admin-line:color-mix(in srgb,var(--accent) 15%,rgba(255,255,255,.07))!important;
  --admin-line-strong:color-mix(in srgb,var(--accent) 27%,rgba(255,255,255,.09))!important;
  --admin-text:#f3f1f8!important;
  --admin-muted:#928e9d!important;
  --admin-purple:var(--accent)!important;
  --admin-purple-soft:color-mix(in srgb,var(--accent) 12%,transparent)!important;
}
#page-dev,
#page-dev .nova-v7-admin,
#page-dev .nova-admin-workspace{
  background:#07070c!important;
}
#page-dev .nova-admin-topbar,
#page-dev .nova-admin-sidebar{
  background:#09090f!important;
}
#page-dev .nova-admin-card,
#page-dev .nova-admin-panel,
#page-dev .nova-admin-table-wrap,
#page-dev .nova-admin-report-card,
#page-dev .nova-admin-maintenance-control,
#page-dev .nova-admin-stat-card,
#page-dev .nova-admin-quick-action,
#page-dev .nova-admin-proxy-record,
#page-dev .nova-admin-device-ban-record,
#page-dev .nova-admin-state,
#page-dev .nova-admin-loading{
  background:#0d0d14!important;
}
#page-dev .nova-admin-nav-group>button:hover{
  background:color-mix(in srgb,var(--accent) 6%,transparent)!important;
}
#page-dev .nova-admin-nav-group>button.active{
  background:color-mix(in srgb,var(--accent) 12%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 24%,transparent)!important;
  color:color-mix(in srgb,var(--accent) 35%,white)!important;
}
#page-dev .nova-admin-nav-group>button.active:before{
  background:var(--accent)!important;
  box-shadow:0 0 12px color-mix(in srgb,var(--accent) 48%,transparent)!important;
}
#page-dev .nova-admin-mark,
#page-dev .nova-admin-role{
  background:color-mix(in srgb,var(--accent) 12%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 28%,transparent)!important;
  color:color-mix(in srgb,var(--accent) 42%,white)!important;
}

/* Island top tabs: only the thin slider should communicate selection.
   Remove the large browser focus rectangle left after clicking a tab. */
#nova-island .ni-tab,
#nova-island .ni-tab:hover,
#nova-island .ni-tab.active,
#nova-island .ni-tab:focus,
#nova-island .ni-tab:focus-visible{
  background:transparent!important;
  border:0!important;
  outline:none!important;
  box-shadow:none!important;
}
#nova-island .ni-tab:focus-visible{
  color:var(--white)!important;
  text-decoration:underline;
  text-decoration-color:var(--accent);
  text-underline-offset:8px;
  text-decoration-thickness:2px;
}

/* =====================================================================
   V2.3 — precise corrections requested after visual review.
   ===================================================================== */

/* Support, Plans, and Rewards keep their original Nova-dark page surface.
   Holiday artwork belongs behind Home/Settings/etc., not these pages. */
#page-support,
#page-plans,
#page-rewards,
#page-support .content-page,
#page-plans .content-page,
#page-rewards .content-page{
  background:#04040a!important;
  background-color:#04040a!important;
  background-image:none!important;
}

/* Keep the existing native glass cards on those pages. Theme only accents. */
#page-support .support-card,
#page-support .support-faq-item,
#page-plans .plan-card,
#page-rewards .reward-card{
  background:rgba(255,255,255,.03)!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:none!important;
}
#page-support .support-card:hover,
#page-support .support-faq-item:hover,
#page-plans .plan-card:hover,
#page-rewards .reward-card:hover{
  background:rgba(255,255,255,.06)!important;
  border-color:color-mix(in srgb,var(--accent) 35%,transparent)!important;
  box-shadow:none!important;
}

/* SOCIAL — theme the actual mounted Social UI, not classes that aren't used.
   Keep the chat readable/dark while letting the selected theme visibly tint
   chrome, messages, inputs, actions and selection states. */
#ni-social-mount.ni-social-layout .social-chat-area,
#ni-social-mount.ni-social-layout .social-everyone-panel,
#ni-social-mount.ni-social-layout .social-chat-inner{
  background:color-mix(in srgb,#04040a 91%,var(--accent) 9%)!important;
}
#ni-social-mount.ni-social-layout .social-chat-header,
#ni-social-sidebar-mount .social-sidebar-header{
  background:color-mix(in srgb,#080812 88%,var(--accent) 12%)!important;
  border-color:color-mix(in srgb,var(--accent) 22%,transparent)!important;
}
#ni-social-sidebar-mount.ni-social-sidebar-layout .social-sidebar{
  background:color-mix(in srgb,#080812 90%,var(--accent) 10%)!important;
}
#ni-social-mount.ni-social-layout .social-input-row,
#ni-social-sidebar-mount .social-search-wrap{
  background:color-mix(in srgb,#080812 87%,var(--accent) 13%)!important;
  border-color:color-mix(in srgb,var(--accent) 24%,transparent)!important;
}
#ni-social-sidebar-mount .social-search-input,
#ni-social-mount .social-msg-input{
  background:color-mix(in srgb,#0c0c1a 88%,var(--accent) 12%)!important;
  border-color:color-mix(in srgb,var(--accent) 22%,transparent)!important;
  color:var(--white)!important;
}
#ni-social-sidebar-mount .social-everyone-tab{
  background:color-mix(in srgb,#0c0c1a 82%,var(--accent) 18%)!important;
  border-color:color-mix(in srgb,var(--accent) 34%,transparent)!important;
  color:color-mix(in srgb,var(--accent) 55%,white)!important;
}
#ni-social-sidebar-mount .social-friend-item:hover{
  background:color-mix(in srgb,#0c0c1a 78%,var(--accent) 22%)!important;
  border-color:color-mix(in srgb,var(--accent) 28%,transparent)!important;
}
#ni-social-sidebar-mount .social-friend-item.active{
  background:color-mix(in srgb,#0c0c1a 70%,var(--accent) 30%)!important;
  border-color:color-mix(in srgb,var(--accent) 45%,transparent)!important;
}
#ni-social-sidebar-mount .social-sidebar-actions{
  background:color-mix(in srgb,#080812 82%,var(--accent) 18%)!important;
  border-color:color-mix(in srgb,var(--accent) 22%,transparent)!important;
}
#ni-social-sidebar-mount .social-add-btn,
#ni-social-mount .social-photo-btn,
#ni-social-mount .social-chat-safety-btn,
#ni-social-mount .social-chat-remove-btn,
#ni-social-mount .social-uno-start{
  border-color:color-mix(in srgb,var(--accent) 26%,transparent)!important;
  color:var(--accent)!important;
}
#ni-social-sidebar-mount .social-add-btn:hover,
#ni-social-mount .social-photo-btn:hover,
#ni-social-mount .social-chat-safety-btn:hover,
#ni-social-mount .social-chat-remove-btn:hover,
#ni-social-mount .social-uno-start:hover{
  background:color-mix(in srgb,var(--accent) 16%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 44%,transparent)!important;
}
#ni-social-mount .social-send-btn{
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;
  border-color:color-mix(in srgb,var(--accent) 58%,white 8%)!important;
  color:#080812!important;
}
#ni-social-mount .social-msg.mine .social-msg-bubble,
#ni-social-mount .social-msg.own .social-msg-bubble{
  background:color-mix(in srgb,#0c0c1a 62%,var(--accent) 38%)!important;
  border-color:color-mix(in srgb,var(--accent) 48%,transparent)!important;
}
#ni-social-mount .social-msg.theirs .social-msg-bubble,
#ni-social-mount .social-msg:not(.mine):not(.own) .social-msg-bubble{
  background:color-mix(in srgb,#0c0c1a 88%,var(--accent) 12%)!important;
  border-color:color-mix(in srgb,var(--accent) 18%,transparent)!important;
}
#ni-social-mount .social-msg-sender,
#ni-social-mount .nova-reply-label,
#ni-social-sidebar-mount .social-section-label{
  color:var(--accent)!important;
}
#ni-social-mount .nova-reply-bar{
  background:color-mix(in srgb,#080812 84%,var(--accent) 16%)!important;
  border-color:color-mix(in srgb,var(--accent) 22%,transparent)!important;
}
.social-modal-box{
  background:color-mix(in srgb,#080812 90%,var(--accent) 10%)!important;
  border-color:color-mix(in srgb,var(--accent) 30%,transparent)!important;
}
.social-modal-input{
  background:color-mix(in srgb,#0c0c1a 86%,var(--accent) 14%)!important;
  border-color:color-mix(in srgb,var(--accent) 24%,transparent)!important;
}
.social-modal-btn{
  background:linear-gradient(135deg,var(--accent),var(--accent2))!important;
  border-color:var(--accent)!important;
  color:#080812!important;
}

/* Nova Island top tabs: absolutely no filled/focus rectangle. The indicator
   line is the sole active affordance. */
#nova-island .ni-tabs .ni-tab,
#nova-island .ni-tabs .ni-tab:hover,
#nova-island .ni-tabs .ni-tab.active,
#nova-island .ni-tabs .ni-tab:focus,
#nova-island .ni-tabs .ni-tab:focus-visible{
  appearance:none!important;
  -webkit-appearance:none!important;
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  text-decoration:none!important;
}
#nova-island .ni-tabs .ni-tab:hover{color:color-mix(in srgb,var(--white) 72%,var(--muted))!important}
#nova-island .ni-tabs .ni-tab.active{color:var(--white)!important}
#nova-island .ni-tab-indicator::before{
  background:var(--accent)!important;
  box-shadow:0 0 12px color-mix(in srgb,var(--accent) 48%,transparent)!important;
}

/* =====================================================================
   V2.6 — Nova Island page-row selection cleanup.
   Keep page rows readable and themed without the oversized double outline.
   ===================================================================== */
#nova-island .ni-page-item,
#nova-island .ni-page-item:hover,
#nova-island .ni-page-item.active,
#nova-island .ni-page-item:focus,
#nova-island .ni-page-item:focus-visible{
  outline:none!important;
  box-shadow:none!important;
}
#nova-island .ni-page-item{
  border:1px solid transparent!important;
  background:transparent!important;
}
#nova-island .ni-page-item:hover:not(.active){
  background:color-mix(in srgb,var(--accent) 7%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 10%,transparent)!important;
}
#nova-island .ni-page-item.active{
  background:color-mix(in srgb,var(--accent) 10%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 18%,transparent)!important;
}
#nova-island .ni-page-item.active .ni-page-icon{
  background:color-mix(in srgb,var(--accent) 12%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 22%,transparent)!important;
  color:var(--accent)!important;
}



/* =====================================================================
   V2.9 — THEMED COMPONENTS OVER THE REAL HOLIDAY SCENE
   The page canvas stays transparent so the actual holiday body artwork
   remains visible. Support / Plans / Rewards still inherit the active
   theme variables for their component surfaces and controls.
   ===================================================================== */
html[data-nova-holiday] #page-support,
html[data-nova-holiday] #page-plans,
html[data-nova-holiday] #page-rewards,
html[data-nova-holiday] #page-support .content-page,
html[data-nova-holiday] #page-plans .content-page,
html[data-nova-holiday] #page-rewards .content-page{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
}
html[data-nova-holiday]:has(#page-support.active) .page-area,
html[data-nova-holiday]:has(#page-plans.active) .page-area,
html[data-nova-holiday]:has(#page-rewards.active) .page-area{
  background:transparent!important;
}

/* Support components follow the active theme instead of fixed purple. */
html[data-nova-holiday] #page-support .nova-ticket-app{
  background:color-mix(in srgb,var(--bg2) 78%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 34%,transparent)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.035)!important;
  backdrop-filter:blur(18px) saturate(1.08);
  -webkit-backdrop-filter:blur(18px) saturate(1.08);
}
html[data-nova-holiday] #page-support .nova-ticket-app-head{
  background:color-mix(in srgb,var(--s1) 70%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 24%,transparent)!important;
}
html[data-nova-holiday] #page-support .nova-ticket-list-panel,
html[data-nova-holiday] #page-support .nova-ticket-thread{
  background:color-mix(in srgb,var(--bg) 72%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 20%,transparent)!important;
}
html[data-nova-holiday] #page-support .nova-ticket-new,
html[data-nova-holiday] #page-support .nova-ticket-action:not(.danger),
html[data-nova-holiday] #page-support .nova-ticket-send,
html[data-nova-holiday] #page-support .nova-ticket-empty button,
html[data-nova-holiday] #page-support .nova-ticket-signin{
  background:color-mix(in srgb,var(--accent) 17%,var(--s1))!important;
  border-color:color-mix(in srgb,var(--accent) 46%,transparent)!important;
  color:var(--white)!important;
}
html[data-nova-holiday] #page-support .nova-ticket-eyebrow,
html[data-nova-holiday] #page-support .support-kicker,
html[data-nova-holiday] #page-support .support-card-icon{
  color:var(--accent)!important;
}

/* Plans / Rewards keep the scene visible but theme the cards themselves. */
html[data-nova-holiday] #page-plans .plan-card,
html[data-nova-holiday] #page-rewards .reward-card{
  background:color-mix(in srgb,var(--bg2) 78%,transparent)!important;
  border-color:color-mix(in srgb,var(--accent) 26%,transparent)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
html[data-nova-holiday] #page-plans .plan-card:hover,
html[data-nova-holiday] #page-rewards .reward-card:hover{
  background:color-mix(in srgb,var(--accent) 9%,var(--bg2))!important;
  border-color:color-mix(in srgb,var(--accent) 50%,transparent)!important;
}
html[data-nova-holiday] #page-plans .plan-card--current{
  border-color:var(--accent)!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 72%,transparent),0 4px 24px color-mix(in srgb,var(--accent) 18%,transparent)!important;
}

/* =====================================================================
   V3.0 — HOLIDAY READABILITY TINT
   When a holiday scene is active, keep the page background visible but
   add a stronger tinted glass surface behind transparent UI so text stays
   readable. This affects component surfaces only, not the full page.
   ===================================================================== */
html[data-nova-holiday]{
  --holiday-readable-panel:color-mix(in srgb,var(--bg2) 84%,transparent)!important;
  --holiday-readable-panel-strong:color-mix(in srgb,var(--s1) 90%,transparent)!important;
  --holiday-readable-panel-soft:color-mix(in srgb,var(--bg) 74%,transparent)!important;
  --holiday-readable-line:color-mix(in srgb,var(--accent) 26%,rgba(255,255,255,.08))!important;
  --holiday-readable-line-strong:color-mix(in srgb,var(--accent) 42%,rgba(255,255,255,.12))!important;
}

/* Settings: tint the floating glass cards only during holiday themes. */
html[data-nova-holiday] #page-settings .settings-panel,
html[data-nova-holiday] #page-settings .settings-profile-card,
html[data-nova-holiday] #page-settings .settings-island-preview,
html[data-nova-holiday] #page-settings .settings-about,
html[data-nova-holiday] #page-settings .settings-sidebar,
html[data-nova-holiday] #page-settings .settings-nav,
html[data-nova-holiday] #page-settings .settings-section-nav,
html[data-nova-holiday] #page-settings .setting-input,
html[data-nova-holiday] #page-settings .theme-toggle,
html[data-nova-holiday] #page-settings .settings-sync-pill{
  background:var(--holiday-readable-panel)!important;
  border-color:var(--holiday-readable-line)!important;
  backdrop-filter:blur(16px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.08)!important;
}
html[data-nova-holiday] #page-settings .settings-panel:hover,
html[data-nova-holiday] #page-settings .settings-profile-card:hover,
html[data-nova-holiday] #page-settings .settings-island-preview:hover,
html[data-nova-holiday] #page-settings .settings-about:hover{
  background:color-mix(in srgb,var(--accent) 8%,var(--bg2))!important;
  border-color:var(--holiday-readable-line-strong)!important;
}

/* Support: tint ticket shells, cards, FAQ items, and form surfaces. */
html[data-nova-holiday] #page-support .nova-ticket-app,
html[data-nova-holiday] #page-support .nova-ticket-app-head,
html[data-nova-holiday] #page-support .nova-ticket-shell,
html[data-nova-holiday] #page-support .nova-ticket-list-panel,
html[data-nova-holiday] #page-support .nova-ticket-thread,
html[data-nova-holiday] #page-support .support-card,
html[data-nova-holiday] #page-support .support-faq-item,
html[data-nova-holiday] #page-support #support-report-user-search{
  border-color:var(--holiday-readable-line)!important;
  backdrop-filter:blur(16px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.08)!important;
}
html[data-nova-holiday] #page-support .nova-ticket-app,
html[data-nova-holiday] #page-support .nova-ticket-shell,
html[data-nova-holiday] #page-support .nova-ticket-list-panel,
html[data-nova-holiday] #page-support .nova-ticket-thread{
  background:var(--holiday-readable-panel-strong)!important;
}
html[data-nova-holiday] #page-support .nova-ticket-app-head,
html[data-nova-holiday] #page-support .support-card,
html[data-nova-holiday] #page-support .support-faq-item,
html[data-nova-holiday] #page-support #support-report-user-search{
  background:var(--holiday-readable-panel)!important;
}
html[data-nova-holiday] #page-support .support-card:hover,
html[data-nova-holiday] #page-support .support-faq-item:hover{
  background:color-mix(in srgb,var(--accent) 8%,var(--bg2))!important;
  border-color:var(--holiday-readable-line-strong)!important;
}

/* =====================================================================
   V3.1 — COHESIVE FRONT-END POLISH
   Visual-only pass: unify spacing, borders, radii, hover/focus behavior,
   and surface depth without changing page structure or app behavior.
   ===================================================================== */

:root{
  --ui-radius-sm:8px;
  --ui-radius-md:12px;
  --ui-radius-lg:16px;
  --ui-radius-xl:22px;
  --ui-border:color-mix(in srgb,var(--white) 8%,transparent);
  --ui-border-accent:color-mix(in srgb,var(--accent) 30%,transparent);
  --ui-panel:color-mix(in srgb,var(--bg2) 84%,transparent);
  --ui-panel-strong:color-mix(in srgb,var(--s1) 90%,transparent);
  --ui-panel-hover:color-mix(in srgb,var(--accent) 7%,var(--bg2));
  --ui-shadow:0 14px 44px rgba(0,0,0,.22);
  --ui-shadow-soft:0 8px 28px rgba(0,0,0,.14);
}

html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit}
button{transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease}
button:not(:disabled):active{transform:translateY(1px) scale(.99)}
input,select,textarea{transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,color .16s ease}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{
  outline:none!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--bg) 80%,transparent),0 0 0 4px color-mix(in srgb,var(--accent) 48%,transparent)!important;
}

/* Common page headings: same rhythm everywhere without changing layout. */
.page-title,.settings-v7-header h1,.settings-pane-head h2,.sn-panel-heading h2,
.nova-admin-main h1,.nova-admin-main h2,.support-title,.rewards-title,.plans-title{
  letter-spacing:-.02em;
  text-wrap:balance;
}
.page-subtitle,.settings-v7-header p,.settings-pane-head p,.sn-panel-heading p,
.support-subtitle,.rewards-subtitle,.plans-subtitle{
  line-height:1.55;
}

/* Shared card/surface treatment. */
.game-card,.app-card,.movie-card,.support-card,.support-faq-item,.settings-panel,
.settings-profile-card,.settings-island-preview,.settings-about,.settings-block,
.plan-card,.reward-card,.sn-card,.sn-overview-card,.sn-cloud-card,.dev-tool-card,
.nova-admin-card,.nova-admin-stat-card,.nova-admin-quick-action,.nap-card,.nap-stat-card{
  border-radius:var(--ui-radius-md)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),var(--ui-shadow-soft)!important;
}
.game-card:hover,.app-card:hover,.movie-card:hover,.support-card:hover,.support-faq-item:hover,
.settings-panel:hover,.settings-block:hover,.plan-card:hover,.reward-card:hover,.sn-card:hover,
.dev-tool-card:hover,.nova-admin-quick-action:hover,.nap-card:hover{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 36px rgba(0,0,0,.18)!important;
}

/* Consistent buttons — keep each component's own colors. */
.save-btn,.primary-btn,.settings-btn,.support-card-btn,.nova-ticket-new,.nova-ticket-action,
.nova-ticket-send,.plan-btn,.reward-btn,.sn-ai-gate-btn,.sn-theme-apply-btn,.sn-theme-reset-btn,
.nap-btn,.nova-admin-btn,.nova-admin-action-primary,.game-detail-action,.movie-genre-btn{
  border-radius:10px!important;
}
.save-btn:not(:disabled):hover,.primary-btn:not(:disabled):hover,.settings-btn:not(:disabled):hover,
.support-card-btn:not(:disabled):hover,.nova-ticket-new:not(:disabled):hover,.nova-ticket-action:not(:disabled):hover,
.nova-ticket-send:not(:disabled):hover,.plan-btn:not(:disabled):hover,.reward-btn:not(:disabled):hover,
.sn-ai-gate-btn:not(:disabled):hover,.sn-theme-apply-btn:not(:disabled):hover,.sn-theme-reset-btn:not(:disabled):hover,
.nap-btn:not(:disabled):hover,.nova-admin-btn:not(:disabled):hover,.game-detail-action:not(:disabled):hover{
  transform:translateY(-1px);
}

/* Controls should all feel like the same product. */
.setting-input,.nova-control,.nap-input,.nap-select,.nova-admin-input,
.social-search-input,.social-msg-input,.sn-hub-v2 input,.sn-hub-v2 select,.sn-hub-v2 textarea,
#support-report-user-search,.nova-ticket-compose textarea,.browser-url-input{
  border-radius:10px!important;
}

/* Nova Island: cleaner rows and a restrained active state. */
#nova-island .ni-page-item{border-radius:10px!important;transition:background .16s ease,border-color .16s ease,transform .16s ease,color .16s ease}
#nova-island .ni-page-item:hover{transform:translateX(2px)}
#nova-island .ni-page-item.active{box-shadow:inset 3px 0 0 color-mix(in srgb,var(--accent) 85%,transparent)!important}
#nova-island .ni-page-icon{border-radius:9px!important}
#nova-island .ni-tabs{gap:2px}
#nova-island .ni-tab{border-radius:8px 8px 0 0!important}

/* Settings rail + panels: tighter, more deliberate hierarchy. */
#page-settings .settings-rail-item,#page-settings .settings-nav-item{border-radius:10px!important}
#page-settings .settings-rail-item:hover,#page-settings .settings-nav-item:hover{transform:translateX(2px)}
#page-settings .settings-panel,#page-settings .settings-profile-card,#page-settings .settings-island-preview,#page-settings .settings-about{
  overflow:hidden;
}
#page-settings .settings-panel::after,#page-settings .settings-profile-card::after,#page-settings .settings-island-preview::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(120deg,rgba(255,255,255,.025),transparent 22%,transparent 75%,rgba(255,255,255,.018));
}

/* Support: clearer separation without obscuring scenic holiday backgrounds. */
#page-support .nova-ticket-app{border-radius:var(--ui-radius-lg)!important;overflow:hidden}
#page-support .nova-ticket-app-head{padding-block:.9rem!important}
#page-support .support-card{min-height:180px;justify-content:flex-start}
#page-support .support-card-btn{margin-top:auto}
#page-support .support-faq-item{padding:.8rem 1rem!important}

/* Social: improve visual hierarchy while preserving current layout. */
#ni-social-mount .social-msg-bubble{border-radius:14px!important;box-shadow:0 6px 18px rgba(0,0,0,.12)}
#ni-social-mount .social-input-row{border-radius:14px!important}
#ni-social-sidebar-mount .social-friend-item,#ni-social-sidebar-mount .social-everyone-tab{border-radius:10px!important}
#ni-social-sidebar-mount .social-friend-item:hover{transform:translateX(2px)}
#ni-social-sidebar-mount .social-sidebar-actions button{border-radius:9px!important}

/* Games/apps/movies: unify card framing but keep artwork dominant. */
.game-card,.app-card,.movie-card{overflow:hidden}
.game-card img,.app-card img,.movie-card img{transition:transform .26s cubic-bezier(.22,1,.36,1),filter .2s ease}
.game-card:hover img,.app-card:hover img,.movie-card:hover img{transform:scale(1.025)}

/* Admin: make the separate control-center UI feel like Nova without flattening it. */
#page-dev .nova-admin-topbar,#page-dev .nova-admin-sidebar,#page-dev .nova-admin-main{border-color:var(--ui-border)!important}
#page-dev .nova-admin-nav-item{border-radius:9px!important}
#page-dev .nova-admin-nav-item:hover{transform:translateX(2px)}
#page-dev .nova-admin-stat-card,#page-dev .nova-admin-quick-action{border-radius:12px!important}

/* Theme Studio / Supernova: consistent panel spacing and polish. */
.sn-theme-card,.sn-workspace-card,.sn-command-box,.sn-overview-card,.sn-cloud-card{border-radius:14px!important}
.sn-section-tab,.sn-theme-preset,.sn-theme-random-btn{border-radius:9px!important}
.sn-theme-preview{border-radius:16px!important;overflow:hidden}

/* Modals/popovers/toasts. */
.acct-modal,.nova-modal,.social-modal,.nova-admin-dialog,.nova-admin-drawer,.nova-profile-popover{
  border-radius:16px!important;
  box-shadow:0 24px 80px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.035)!important;
}

/* Scrollbars: subtle and consistent. */
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 30%,transparent) transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 24%,transparent);border-radius:100px}
*::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--accent) 38%,transparent)}

@media (prefers-reduced-motion:reduce){
  .game-card:hover,.app-card:hover,.movie-card:hover,.support-card:hover,.support-faq-item:hover,
  .settings-panel:hover,.settings-block:hover,.plan-card:hover,.reward-card:hover,.sn-card:hover,
  .dev-tool-card:hover,.nova-admin-quick-action:hover,#nova-island .ni-page-item:hover,
  #page-settings .settings-rail-item:hover,#page-settings .settings-nav-item:hover,
  #ni-social-sidebar-mount .social-friend-item:hover,#page-dev .nova-admin-nav-item:hover{
    transform:none!important;
  }
  .game-card:hover img,.app-card:hover img,.movie-card:hover img{transform:none!important}
}

/* =====================================================================
   V3.3 — SMOOTH NAVIGATION MOTION
   Reduce layout/compositor spikes when switching pages and opening Social.
   No layout or feature changes; motion is shorter, softer, and GPU-friendly.
   ===================================================================== */
@keyframes novaPageSmoothInRight{from{opacity:0;transform:translate3d(6px,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes novaPageSmoothInLeft{from{opacity:0;transform:translate3d(-6px,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes novaPageSmoothOutLeft{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(-3px,0,0)}}
@keyframes novaPageSmoothOutRight{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(3px,0,0)}}
@keyframes niPanelSmoothIn{from{opacity:0}to{opacity:1}}

.page.pg-enter-right{animation:novaPageSmoothInRight .20s cubic-bezier(.22,1,.36,1) both!important}
.page.pg-enter-left,.page.pg-enter-up{animation:novaPageSmoothInLeft .20s cubic-bezier(.22,1,.36,1) both!important}
.page.pg-exit-left{animation:novaPageSmoothOutLeft .12s ease-out both!important}
.page.pg-exit-right,.page.pg-exit-down{animation:novaPageSmoothOutRight .12s ease-out both!important}

/* Island tabs fade their content rather than shifting/scaling a full panel. */
.ni-panel.active.ni-panel-forward,
.ni-panel.active.ni-panel-back{
  animation:niPanelSmoothIn .16s ease-out both!important;
}
.ni-tab{transform:none!important;transition:color .16s ease!important}
.ni-tab:hover{transform:none!important}
.ni-tab-indicator{transition:transform .22s cubic-bezier(.22,1,.36,1)!important}

/* Social dock: avoid clip-path + scale + blur animation at the same time.
   The large glass surface now uses a simple composited fade. */
#ni-social-dock{
  transform:none!important;
  will-change:opacity;
  transition:opacity .18s ease-out,visibility 0s linear .18s!important;
}
#ni-social-dock.open{
  transform:none!important;
  transition:opacity .18s ease-out,visibility 0s linear 0s!important;
}
body.ni-social-entering #ni-social-dock.open,
body.ni-social-entering #nova-island.open,
body.ni-social-entering #ni-social-mount.ni-social-layout .social-chat-area,
body.ni-social-entering .ni-panel[data-ni-panel="friends"].active{
  animation:none!important;
}
#nova-island.open{
  transition:
    width var(--ni-open-duration,.48s) cubic-bezier(.22,1,.36,1),
    height var(--ni-open-duration,.48s) cubic-bezier(.22,1,.36,1),
    border-radius .20s ease,
    box-shadow .20s ease,
    opacity .14s ease!important;
}
body.ni-social-dock-open #nova-island.open{transition:border-radius .20s ease,box-shadow .20s ease!important}

/* Launch click should feel responsive without a visible size snap. */
.ni-page-item.ni-page-launching{animation:none!important;opacity:.82;transition:opacity .10s ease,background .14s ease,border-color .14s ease!important}

@media (prefers-reduced-motion:reduce){
  .page.pg-enter-right,.page.pg-enter-left,.page.pg-enter-up,.page.pg-exit-left,.page.pg-exit-right,.page.pg-exit-down,
  .ni-panel.active.ni-panel-forward,.ni-panel.active.ni-panel-back{animation:none!important}
  #ni-social-dock,#ni-social-dock.open{transition:none!important}
}
html[data-reduce-motion="on"] .page.pg-enter-right,
html[data-reduce-motion="on"] .page.pg-enter-left,
html[data-reduce-motion="on"] .page.pg-enter-up,
html[data-reduce-motion="on"] .page.pg-exit-left,
html[data-reduce-motion="on"] .page.pg-exit-right,
html[data-reduce-motion="on"] .page.pg-exit-down,
html[data-reduce-motion="on"] .ni-panel.active.ni-panel-forward,
html[data-reduce-motion="on"] .ni-panel.active.ni-panel-back{animation:none!important}


/* v4.4 — softer, less-blinding light mode */
html[data-theme="light"]{
  --theme-panel:rgba(255,252,247,.76)!important;
  --theme-panel-strong:rgba(247,241,233,.92)!important;
  --theme-panel-hover:rgba(250,245,239,.96)!important;
  --theme-line:rgba(88,63,36,.11)!important;
  --theme-line-strong:rgba(108,96,218,.22)!important;
  --theme-shadow:rgba(66,48,28,.09)!important;
  --theme-accent-soft:rgba(108,96,218,.10)!important;
}