#connectionStatus .connection-actions {
 display: flex;
 align-items: center;
 gap: 8px;
}
#connectionStatus .theme-picker {
 display: flex;
 align-items: center;
 gap: 6px;
 color: inherit;
 font-size: inherit;
}
#connectionStatus .theme-picker select {
 width: auto;
 min-height: 28px;
 margin: 0;
 padding: 3px 6px;
 font: inherit;
}
@media (pointer: coarse) {
 #connectionStatus .theme-picker select { min-height: 38px; font-size: 16px; }
}

@media screen {
 html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #151916;
  --ink: #f1eee4;
  --muted: #b9c2b6;
  --line: #414a41;
  --surface: #202721;
  --raised: #283129;
  --control: #2b342c;
  --hover: #354137;
  --primary: #e1c67d;
  --accent: #d8bf7c;
  --link: #efcf89;
  --focus: #e5c678;
  --danger: #ffb4a8;
  --success: #ade0b7;
 }
 [data-theme="dark"] body,
 [data-theme="dark"] dialog { color: var(--ink); background: var(--bg); }
 [data-theme="dark"] :is(h1,h2,h3,strong,b,.card .value,.total > strong,td),
 [data-theme="dark"] #crumb { color: var(--ink); }
 [data-theme="dark"] :is(small,label,footer,.card .label,.card.accent small,.card.accent .label,.product small,.total > span,.total small,.empty,.orderline .unit-info,.phone-table-hint,.phone-records td::before,.eyebrow,.account-card .eyebrow,.account-card p,.hero p,.bar-group span,.legend) { color: var(--muted); }
 [data-theme="dark"] :is(aside,header,.company,.demo,.note,.note-details,.return-line,.hero,.phone-secondary-panel),
 [data-theme="dark"] #connectionStatus { background: var(--raised); border-color: var(--line); }
 [data-theme="dark"] :is(.panel,.card,.account-card,.account-busy div,.phone-records tr,dialog) { background: var(--surface); border-color: var(--line); box-shadow: none; }
 [data-theme="dark"] .card.accent { background: #353729; border-color: #5a583d; }
 [data-theme="dark"] .hero .graphic { color: var(--link); }
 [data-theme="dark"] .account-gate { background: radial-gradient(ellipse at 20% 5%,#323829,transparent 58%),var(--bg); }
 [data-theme="dark"] .account-busy { background: #151916f2; color: var(--ink); }
 [data-theme="dark"] .account-card #accountMessage { color: var(--link); }
 [data-theme="dark"] :is(aside,.company,.demo,.note,.note-details > summary,nav .symbol,.navtitle,.nav-group > summary,aside nav a,.icon) { color: var(--muted); }
 [data-theme="dark"] :is(.company small,.aside-bottom small) { color: var(--muted); }
 [data-theme="dark"] :is(aside nav a:hover:not(.active),.nav-group > summary:hover,.icon:hover,tbody tr:hover,.phone-records tr:hover) { background: var(--hover); }
 [data-theme="dark"] aside nav a.active { color: var(--ink); background: #414631; box-shadow: inset 3px 0 var(--primary); }
 [data-theme="dark"] aside nav a.active .symbol { color: var(--primary); }
 [data-theme="dark"] :is(.nav-subgroup,.note-details > .note,.formactions,.insight,.total,td,th,.phone-records td) { border-color: var(--line); }
 [data-theme="dark"] .note-details > .note { background: transparent; }
 [data-theme="dark"] th { color: var(--muted); background: var(--raised); }
 [data-theme="dark"] :is(.avatar,header .avatar,.product .tile) { color: var(--link); background: #3b3d2d; border-color: #58583f; }
 [data-theme="dark"] :is(.btn,input,select,textarea,.field,.account-card input,.account-card select) { color: var(--ink); background: var(--control); border-color: #5a6558; }
 [data-theme="dark"] :is(input,textarea)::placeholder { color: var(--muted); }
 [data-theme="dark"] input[readonly] { background: var(--raised); color: var(--muted); border-style: dashed; }
 [data-theme="dark"] :is(input,select,textarea,button,a,summary):focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
 [data-theme="dark"] :is(input,select,textarea):focus { border-color: var(--focus); }
 [data-theme="dark"] :is(input[type="checkbox"],input[type="radio"]) { accent-color: var(--primary); }
 [data-theme="dark"] .btn:hover { background: var(--hover); border-color: #758173; }
 [data-theme="dark"] .btn.primary { color: #242018; background: var(--primary); border-color: var(--primary); }
 [data-theme="dark"] .btn.primary:hover { background: #f0d895; }
 [data-theme="dark"] .btn.danger { color: var(--danger); background: #3e2928; border-color: #77514b; }
 [data-theme="dark"] :is(.demo button,.link,.insight a,.note a,.account-card .account-link,.account-card .account-secondary,.account-card .account-link:hover,.account-secondary:hover) { color: var(--link); }
 [data-theme="dark"] .pill { color: #d0e4cf; background: #354639; }
 [data-theme="dark"] .pill.warn { color: #f8d892; background: #493e26; }
 [data-theme="dark"] .pill.red { color: var(--danger); background: #482d2c; }
 [data-theme="dark"] .pill.blue { color: #c4e0f5; background: #2d414e; }
 [data-theme="dark"] .positive { color: var(--success); }
 [data-theme="dark"] .negative { color: var(--danger); }
 [data-theme="dark"] .chart { background: repeating-linear-gradient(to top,transparent 0,transparent 43px,var(--line) 44px); }
 [data-theme="dark"] .bar, [data-theme="dark"] .dot { background: #d6bd77; }
 [data-theme="dark"] .bar.light, [data-theme="dark"] .dot.light { background: #81987e; }
 [data-theme="dark"] #toast { color: var(--ink); background: var(--raised); border-color: #687665; }
 [data-theme="dark"] #connectionLabel::before { background: var(--danger); }
 [data-theme="dark"] #connectionStatus[data-state="online"] #connectionLabel::before { background: var(--success); }
 [data-theme="dark"] :is(aside,.tablewrap) { scrollbar-color: #748372 var(--surface); }
 [data-theme="dark"] aside::-webkit-scrollbar-track { background: var(--surface); }
 [data-theme="dark"] aside::-webkit-scrollbar-thumb { background: #748372; }
 [data-theme="dark"] .brand-logo-frame {
  outline: 7px solid #e7e1d0;
  background: #e7e1d0;
  border-radius: 5px;
 }
 @media (max-width: 700px) {
  [data-theme="dark"] dialog .formactions { background: var(--surface); box-shadow: 0 -8px 14px var(--surface); }
 }
}
