/* Account appearance only. Public website layouts never opt into these variables.
   Literal fallbacks in shared assets preserve the existing light/public palettes. */
html[data-panel-root]{color-scheme:light;background:var(--bg);}
.panel-appearance{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:100%;color:var(--muted);font-size:12px;font-weight:650;}
.panel-appearance[hidden]{display:none!important;}
.panel-appearance svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.panel-appearance select{width:auto;max-width:180px;min-height:38px;padding:7px 28px 7px 10px;font-size:12px;cursor:pointer;}
.panel-appearance .appearance-label{white-space:nowrap;}
.panel-appearance:focus-within{color:var(--ink);}
.panel-appearance select:focus-visible{outline:2px solid var(--night-link,var(--brand));outline-offset:3px;}
.guest-appearance{position:absolute;top:18px;left:18px;z-index:2;}
.guest-appearance .appearance-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
html[data-panel-root] :is(button,input,select,textarea){accent-color:var(--brand);}
@media(max-width:1100px){.topbar .panel-appearance .appearance-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}}
@media(max-width:580px){.topbar .panel-appearance{margin-inline-start:auto;}.topbar .panel-appearance select{max-width:155px;}.guest-appearance{left:12px;gap:5px;}.guest-appearance select{max-width:125px;}.guest-body .auth-language{right:12px;width:140px;}.guest-body .auth-wrap{padding-top:90px;padding-bottom:28px;}}
@media screen{html[data-panel-root][data-panel-theme="dark"]{
  --night-primary-end:#5c50dd;
  --night-surface:#151f2e;
  --night-soft:#1b283b;
  --night-raised:#223147;
  --night-ink:#e7edf6;
  --night-muted:#abbacf;
  --night-line:#34465f;
  --night-link:#b1abff;
  --night-success:#76e4b8;
  --night-danger:#ffa6b1;
  --night-warning:#f6cd87;
  --night-info:#a2c9ff;
  --night-violet:#c3baff;
  --night-success-bg:#16382f;
  --night-danger-bg:#3b2630;
  --night-warning-bg:#3b3121;
  --night-info-bg:#1c3049;
  --night-violet-bg:#2b2948;
  --night-success-line:#366b58;
  --night-danger-line:#805060;
  --night-warning-line:#80643c;
  --night-info-line:#4a6b94;
  --night-violet-line:#6d6398;
  --night-glass:rgba(21,31,46,.94);
  --night-shadow:rgba(0,0,0,.28);
  color-scheme:dark;
  --bg:#0d1420;--panel:#151f2e;--ink:#e7edf6;--muted:#abbacf;--line:#34465f;
  --ok:#76e4b8;--bad:#ffa6b1;--shadow:0 18px 45px rgba(0,0,0,.23);
  --text:var(--ink);--text-secondary:var(--muted);--surface:var(--panel);--surface-2:#1b283b;
  --soft:#1b283b;--border:var(--line);--danger:var(--bad);
}
}
@media screen and (prefers-color-scheme:dark){html[data-panel-root]:not([data-panel-theme]){
  --night-primary-end:#5c50dd;
  --night-surface:#151f2e;
  --night-soft:#1b283b;
  --night-raised:#223147;
  --night-ink:#e7edf6;
  --night-muted:#abbacf;
  --night-line:#34465f;
  --night-link:#b1abff;
  --night-success:#76e4b8;
  --night-danger:#ffa6b1;
  --night-warning:#f6cd87;
  --night-info:#a2c9ff;
  --night-violet:#c3baff;
  --night-success-bg:#16382f;
  --night-danger-bg:#3b2630;
  --night-warning-bg:#3b3121;
  --night-info-bg:#1c3049;
  --night-violet-bg:#2b2948;
  --night-success-line:#366b58;
  --night-danger-line:#805060;
  --night-warning-line:#80643c;
  --night-info-line:#4a6b94;
  --night-violet-line:#6d6398;
  --night-glass:rgba(21,31,46,.94);
  --night-shadow:rgba(0,0,0,.28);
  color-scheme:dark;
  --bg:#0d1420;--panel:#151f2e;--ink:#e7edf6;--muted:#abbacf;--line:#34465f;
  --ok:#76e4b8;--bad:#ffa6b1;--shadow:0 18px 45px rgba(0,0,0,.23);
  --text:var(--ink);--text-secondary:var(--muted);--surface:var(--panel);--surface-2:#1b283b;
  --soft:#1b283b;--border:var(--line);--danger:var(--bad);
}
}

/* Inherit foregrounds on UA dialogs/buttons, plus neutral overlays and focus states. */
html[data-panel-root] dialog{color:var(--ink);background:var(--panel);}
.btn{color:var(--ink);}
html[data-panel-root] :is(input,select,textarea)::placeholder{color:var(--muted);opacity:1;}
html[data-panel-root] :is(input,select,textarea):disabled{color:var(--muted);opacity:.75;}
html[data-panel-root] :is(button,a,summary):focus-visible{outline:2px solid var(--night-link,var(--brand));outline-offset:3px;}
html[data-panel-root] :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not(:focus){border-color:var(--night-input-line,#d8dfeb);}
@media screen{html[data-panel-root][data-panel-theme="dark"]{--night-input-line:#586d89;}}
@media screen and (prefers-color-scheme:dark){html[data-panel-root]:not([data-panel-theme]){--night-input-line:#586d89;}}
@media print{.panel-appearance{display:none!important;}html[data-panel-root]{color-scheme:light;--bg:#fff;--panel:#fff;--ink:#142033;--muted:#445067;--line:#d8dfeb;}}
/* Reserve real space for the preference: never cover the menu, title or billing controls. */
.topbar .panel-appearance{flex:0 0 auto;gap:5px;}
.topbar .panel-appearance select{max-width:150px;}
.topbar .topbar-meta{flex:0 0 auto;}
.topbar .balance-actions .topup-open{white-space:nowrap;}
@media(max-width:1600px){.topbar .panel-appearance .appearance-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}.topbar .account-identity{max-width:160px;}}
@media(min-width:761px) and (max-width:1250px){
 .topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 12px;}
 .topbar .menu{grid-column:1;grid-row:1;}
 .topbar .topbar-title{grid-column:2;grid-row:1;}
 .topbar .panel-appearance{grid-column:3;grid-row:1;}
 .topbar .topbar-meta{grid-column:1/-1;grid-row:2;justify-self:end;max-width:100%;}
}
@media(max-width:760px){
 .topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 8px;}
 .topbar .menu{grid-column:1;grid-row:1;}
 .topbar .topbar-title{grid-column:2;grid-row:1;}
 .topbar .topbar-meta{grid-column:3;grid-row:1;}
 .topbar .panel-appearance{grid-column:1/-1;grid-row:2;justify-self:end;margin:0;}
 .topbar .panel-appearance .appearance-label{position:static;width:auto;height:auto;clip-path:none;overflow:visible;}
 .topbar .panel-appearance select{min-height:34px;padding-top:5px;padding-bottom:5px;}
}
@media(max-width:580px){.topbar .topbar-logout{font-size:0;padding:6px 8px;width:38px;}}
