/* Shared day/night tokens for public pages and canvas portals. */
html[data-theme="light"] {
 color-scheme:light;
 --bg:#f5f5f8;--canvas-bg:#fafafd;--panel:#fff;--inset:#eeeef4;
 --card:#fff;--card2:#f2f2f7;--surface:#fff;--surface-2:#eeeef6;
 --fg:#282835;--text:#282835;--muted:#666578;--muted2:#858496;--muted-2:#858496;
 --line:#25254020;--line2:#25254038;--line-2:#25254038;--line-soft:#eeeef4;--border:#d9dce7;
 --accent:#5969b9;--brand2:#087e92;--brand-2:#087e92;--cyan:#087e92;--purple:#6650d9;
 --ok:#147b45;--warn:#94600a;--bad:#c3384d;--white:#fff;
}
html[data-theme="dark"]{color-scheme:dark}
html[data-page="login"][data-theme="dark"]{
 --bg:#131418;--white:#202126;--text:#eeedf4;--muted:#a5a4af;--muted-2:#7d7c88;--line:#ffffff29;--line-soft:#ffffff0d;
}
html[data-page="login"][data-theme="dark"] .field label{color:var(--text)}
html[data-theme="light"] body{background:var(--bg);color:var(--text)}
html[data-theme="light"] #xc-boot{background:var(--bg);color:var(--muted)}
html[data-page="index"][data-theme="light"] .grad{background-image:linear-gradient(100deg,#282835 6%,#6650d9 46%,#087e92 96%)}
.xc-pane-menu{background:var(--panel)}
.xc-pane-menu-item:hover:not(:disabled){background:color-mix(in srgb,var(--fg) 8%,transparent)}
.xc-image-toolbar,.xc-image-tool-popover{background:var(--panel);color:var(--fg);border-color:var(--line2)}
.xc-image-toolbar button,.xc-image-toolbar a,.xc-image-tool-popover button,.xc-image-tool-popover label span{color:var(--fg)}
.xc-image-toolbar:after{background:var(--panel);border-color:var(--line2)}
.xc-image-tool-popover label{color:var(--muted)}
.xc-image-tool-popover select,.xc-image-tool-popover textarea{background:var(--inset);color:var(--fg);border-color:var(--line2)}
.xc-image-tool-popover button{background:color-mix(in srgb,var(--fg) 7%,transparent);border-color:var(--line2)}
.xc-image-tool-popover button.pri,.xc-light-grid button.is-on{background:var(--brand);color:white}
.xc-image-toolbar button:hover,.xc-image-toolbar a:hover,.xc-image-toolbar .is-on{background:color-mix(in srgb,var(--fg) 9%,transparent)}
.xc-angle-pad{background:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px),var(--inset);background-size:22px 22px;border-color:var(--line2)}
.xc-angle-pad:before,.xc-angle-pad:after{background:var(--line2)}
html[data-theme="light"] .xc-angle-pad i{background:var(--accent)}
html[data-theme="light"] .xc-toast{background:var(--panel);color:var(--fg);border:1px solid var(--line2)}
.xiny-recharge-overlay,.xiny-recharge-overlay iframe{background:var(--bg)}
html[data-theme="light"] .xiny-recharge{color:#5b41cb}
/* Public pages previously shipped with dark-only literal colors. */
html[data-theme="light"] :is(.top,.topbar,.nav){background:color-mix(in srgb,var(--panel) 90%,transparent)}
html[data-theme="light"] :is(.input,.inp,.seg,.seg button.on,.opt.on){color:var(--text)}
html[data-theme="light"] :is(.modal,.dialog,.toast,.viewer-foot .dl){background:var(--panel);color:var(--text)}
html[data-theme="light"] :is(.tag.ok,.st.s1){color:var(--ok)}
html[data-theme="light"] :is(.tag.warn,.st.s0,.hint.warn){color:var(--warn)}
html[data-theme="light"] .notice{color:var(--warn)}
html[data-theme="light"] .alert{color:var(--bad)}
html[data-theme="light"] :is(.tag.bad,.hint.bad){color:var(--bad)}
html[data-theme="light"] :is(.tag.brand,.rate-tip b){color:var(--purple)}
html[data-theme="light"] :is(.balance b,.amt-get b,.cost b,.main-head .bal b,.orow .cr,.opt small.p,.opt.on small.p){color:var(--brand2)}
/* Recharge iframe and its second-level redeem/order dialogs. */
html[data-page="recharge"][data-theme="light"] :is(.head p,.purchase-note,.pack-sub,.pack-detail,.recharge-tabs button){color:var(--muted)}
html[data-page="recharge"][data-theme="light"] :is(.rate-tip,.checkout,.orders,.redeem,.need-login){background:var(--panel);border-color:var(--line)}
html[data-page="recharge"][data-theme="light"] :is(.rate-tip b,.purchase-note b,.pack .t,.pack .p,.pack .p em,.pack .c,.pack .c em,.pack-detail b){color:var(--text)}
html[data-page="recharge"][data-theme="light"] :is(.pack,.pack:nth-child(5n)){background:var(--card);border-color:var(--line2)}
html[data-page="recharge"][data-theme="light"] .pack-top{background:linear-gradient(145deg,#f1f0f9,#e9e9f3)}
html[data-page="recharge"][data-theme="light"] .pack.on{background:#edf7fb;border-color:var(--brand2)}
html[data-page="recharge"][data-theme="light"] .pack.on .pack-top{background:linear-gradient(145deg,#dbf0f5,#eaf5f9)}
html[data-page="recharge"][data-theme="light"] .pack:nth-child(5n) .pack-top{background:linear-gradient(145deg,#fff1e6,#ffeadb)}
html[data-page="recharge"][data-theme="light"] :is(.pack-buy,.recharge-close){background:var(--inset);color:var(--text)}
html[data-page="recharge"][data-theme="light"] :is(.pack-detail,.orow,.recharge-tabs){border-color:var(--line)}
html[data-page="recharge"][data-theme="light"] .recharge-tabs button[aria-selected=true]{color:var(--text);border-bottom-color:var(--purple)}
html[data-page="recharge"][data-theme="light"] .bonus-title{color:var(--brand2)}
/* Help articles have their own token names and literal reading colors. */
html[data-page="help"][data-theme="light"] :is(#reader p,#reader li){color:var(--text)}
html[data-page="help"][data-theme="light"] :is(.toc,button:hover,button[aria-pressed=true],.article-link[aria-current=page]){background:#efedf9;color:var(--text)}
html[data-page="help"][data-theme="light"] .hero{background:radial-gradient(ellipse at top right,#e9e2ff88,transparent 70%)}