/* Shared palette: layouts must use these tokens rather than fixed light surfaces. */
:root {
  color-scheme: dark;
  --mut:#a3afbe; --dim:#94a3b8;
  --divider:rgba(255,255,255,.08); --hover:#293443;
  --button-bg:#23bf90; --button-tx:#07291f;
  --success-bg:rgba(45,212,160,.13); --danger-bg:rgba(246,70,93,.12); --warning-bg:rgba(244,192,78,.12);
  --overlay:rgba(0,0,0,.6); --field-ring:rgba(255,255,255,.10);
  --hero-bg:linear-gradient(135deg,#21473e,#1e2938); --hero-mut:#b0c6be;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg:#f3f6f8; --card:#fff; --sf2:#eaf0f4; --bd:#cbd5df;
  --tx:#192f3e; --mut:#536678; --dim:#5c6e7e;
  --acc:#087f60; --acc2:#06674e; --hlf:#087257; --hlb:#e5f4ee;
  --gold:#936000; --danger:#bd263f; --shadow:0 16px 48px rgba(25,47,62,.15);
  --divider:#e3eaf0; --hover:#f0f6f4;
  --button-bg:#087f60; --button-tx:#fff;
  --success-bg:#e5f4ee; --danger-bg:#fff0f2; --warning-bg:#fff4dd;
  --overlay:rgba(21,34,49,.42); --field-ring:#ced9e2;
  --hero-bg:linear-gradient(135deg,#edf9f4,#f6fafc); --hero-mut:#46675d;
}
body { background:var(--bg); }
a { color:var(--acc); }
.appearance-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 14px; min-height:40px; }
.appearance-brand { color:var(--mut); font-size:12px; font-weight:600; }
.appearance-controls { display:flex; align-items:center; gap:8px; }
.appearance-control { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.appearance-control select { width:auto; min-height:36px; padding:6px 10px; font-size:12px; }
.client-link { color:var(--mut); font-size:12px; white-space:nowrap; padding:8px; }
input, select, textarea { color:var(--tx); background:var(--sf2); box-shadow:inset 0 0 0 1px var(--field-ring); }
select { appearance:auto; }
input[type="checkbox"] { accent-color:var(--acc); }
.check-row input, .tool-switch input { appearance:auto; width:18px; height:18px; min-height:18px; padding:0; }
.ios-switch input:focus-visible + .ios-slider { outline:2px solid var(--acc); outline-offset:3px; }
.ios-slider { background:var(--bd); }
.btn.primary, .btn.btn-block { background:var(--button-bg); color:var(--button-tx); }
.btn, .bc-btn, .back-btn { box-shadow:none; }
.btn.ghost { color:var(--tx); }
.chip { background:var(--sf2); color:var(--mut); box-shadow:none; }
.chip.active, .chip.on { background:var(--hlb); color:var(--hlf); box-shadow:inset 0 0 0 1px var(--acc); }
.seg-item.active { background:var(--sf2); color:var(--tx); box-shadow:none; }
.tabbar { background:var(--bg); border-top:1px solid var(--divider); box-shadow:none; }
.badge.success,.badge.b-ok,.b-ok { background:var(--success-bg); color:var(--hlf); }
.badge.grabbed,.badge.pending,.b-wait,.badge.warn { background:var(--warning-bg); color:var(--gold); }
.badge.danger,.badge.b-bad,.b-bad,.err { background:var(--danger-bg); color:var(--danger); }
.warn,.sheet-body .warn { background:var(--warning-bg); color:var(--gold); box-shadow:none; }
.order-card.tap:active,.menu-item:active,.led-row.tap:active { background:var(--hover); }
.bal-card { background:var(--hero-bg); border:1px solid var(--divider); }
.bal-card::after { display:none; }
.bal-card-label,.bal-card-cny,.bal-card-num .cur,.bal-card-num .dec,.bal-card-sub { color:var(--hero-mut); }
.bc-btn { color:var(--tx); background:var(--sf2); }
.dd-row + .dd-row { border-top-color:var(--divider); }
.menu-item + .menu-item::before,.led-row + .led-row::before { background:var(--divider); }
.sheet-backdrop { background:var(--overlay); }
.sheet-body { background:var(--card); box-shadow:var(--shadow); }
.toast,.toast.ok,.toast.err { background:var(--card); border:1px solid var(--bd); box-shadow:var(--shadow); }
.toast.ok { color:var(--hlf); }
.toast.err { color:var(--danger); }
.code-stats-grid { background:var(--sf2); }
.btn.danger { color:var(--danger); background:var(--danger-bg); }
.ledger,.auth-card { box-shadow:inset 0 0 0 1px var(--divider); }
@media (max-width:360px) { .appearance-brand { display:none; } .appearance-bar { justify-content:flex-end; } }
:root[data-client="h5"] body.is-authed .appearance-brand,
:root[data-client="h5"] body.is-authed #client-link { display: none; }
:root[data-client="h5"] body.is-authed .appearance-bar {
  display: none !important;
}
:root[data-client="h5"] body.is-authed { --appearance-bar-h: 8px; }

.logo,.avatar { color:var(--button-tx); background:var(--acc); }

.ios-switch input { inset:0; width:100%; height:100%; min-height:0; margin:0; opacity:0; z-index:1; cursor:pointer; }