:root {
  color-scheme: light;
  --primary: #205f9e;
  --primary-hover: #174b80;
  --primary-solid: #205f9e;
  --muted: #68788d;
  --border: #dfe6ee;
  --page: #f3f6fa;
  --surface: #ffffff;
  --surface-soft: #f7f9fc;
  --input: #fbfcfe;
  --text: #23374e;
  --soft-text: #68788d;
  --faint-text: #78879a;
  --accent-soft: #e9f1fa;
  --accent-border: #c8daee;
  --success-bg: #e8f5ee;
  --success-text: #257854;
  --danger-bg: #fff0f2;
  --danger-text: #ae3449;
  --danger-border: #f1cbd3;
  --focus: #205f9e35;
  --danger-solid: #b7354b;
  --danger-hover: #972b3e;
  --shadow: 0 3px 12px #18324a08;
  --dialog-shadow: 0 24px 80px #17213b30;
  --success-border: #b8ddca;
  color: var(--text);
  background: var(--page);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --primary: #83b8ed;
  --primary-hover: #286dac;
  --primary-solid: #276ba9;
  --muted: #a2b2c5;
  --border: #34465d;
  --page: #0f1926;
  --surface: #182536;
  --surface-soft: #1c2b3e;
  --input: #132031;
  --text: #e2ebf5;
  --soft-text: #a2b2c5;
  --faint-text: #93a6bd;
  --accent-soft: #203b58;
  --accent-border: #3a5878;
  --success-bg: #18382f;
  --success-text: #87d8b2;
  --danger-bg: #3c2632;
  --danger-text: #ffadba;
  --danger-border: #65404d;
  --focus: #83b8ed40;
  --danger-solid: #b7354b;
  --danger-hover: #972b3e;
  --shadow: 0 3px 12px #00000020;
  --dialog-shadow: 0 24px 80px #00000070;
  --success-border: #355f4f;
}
body { color: var(--text); background: var(--page); }
.sidebar, .topbar, .card, .stat, .delete-dialog { background: var(--surface); color: var(--text); border-color: var(--border); }
.card, .stat { box-shadow: var(--shadow); }
.delete-dialog { box-shadow: var(--dialog-shadow); }
.stat strong, .stat .small-value { color: var(--text); }
.workspace, .secure-card, .card-heading, .form-footer, .search, th, td, .list-card, .profile { border-color: var(--border); }
.primary { background: var(--primary-solid); color: #fff; box-shadow: 0 4px 10px #12375a18; }
.primary:hover { background: var(--primary-hover); }
.brand-icon { background: var(--primary-solid); color: #fff; }
.secondary { background: var(--surface); border-color: var(--border); color: var(--soft-text); }
.secondary:hover { background: var(--surface-soft); color: var(--text); }
.nav-item.active, .workspace-icon, .avatar, .top-avatar, .heading-icon, .count-badge, .table-avatar, .type-badge.corporate { color: var(--primary); background: var(--accent-soft); }
.nav-count { background: var(--accent-soft); color: var(--primary); }
.eyebrow, em, .brand > span:last-child, .secure-card > .icon { color: var(--primary); }
.purple, .blue { background: var(--accent-soft); color: var(--primary); }
.green { background: var(--success-bg); color: var(--success-text); }
.topbar, .nav-label, .workspace small, .profile small, .card-heading p, .list-heading p, .page-heading p:last-child,
.stat small, .stat-note, .tag, label span, .form-body small, .form-footer small, .section-label, .section-label span,
.list-footer, .record-id, td, th, footer, footer > span:first-child, .login-note, .login-shell > p:not(.eyebrow),
.second-phone, .dialog-close, .delete-dialog p, .search button, .search a, .logout { color: var(--soft-text); }
.disabled { color: var(--faint-text); }
td strong, .empty strong, .delete-dialog .dialog-customer, .type-options label span { color: var(--text); }
.secure-card, .tag, .form-footer, .privacy-note, .search, th, .type-badge { background: var(--surface-soft); }
.type-badge { color: var(--soft-text); }
input, textarea, select, option, optgroup { background: var(--input); border-color: var(--border); color: var(--text); }
input::placeholder, textarea::placeholder { color: var(--faint-text); opacity: 1; }
input:focus, textarea:focus { outline-color: var(--focus); border-color: var(--primary); }
.form-divider { background: var(--border); }
.privacy-note { color: var(--soft-text); }
.privacy-note > .icon, .empty > .icon { color: var(--primary); }
.tips { background: var(--accent-soft); border-color: var(--accent-border); }
.tips > p:not(.eyebrow), .tip-item p, .tip-bottom { color: var(--soft-text); }
.tip-item > span, .tip-bottom { border-color: var(--accent-border); }
.tip-item > span { color: var(--primary); }
.art-circle { background: var(--surface); color: var(--primary); border-color: var(--accent-border); }
.type-options label { border-color: var(--border); }
.type-options label:has(input:checked) { background: var(--accent-soft); border-color: var(--primary); }
.type-options input { accent-color: var(--primary-solid); }
.success { background: var(--success-bg); color: var(--success-text); border-color: var(--success-border); }
.error, .danger-outline, .delete-icon { background: var(--danger-bg); color: var(--danger-text); border-color: var(--danger-border); }
.danger-outline:hover { background: var(--danger-bg); border-color: var(--danger-text); }
.danger { background: var(--danger-solid); color: #fff; }
.danger:hover { background: var(--danger-hover); }
input[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--danger-text); }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus,
textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text);
  -webkit-box-shadow: 0 0 0 1000px var(--input) inset;
  caret-color: var(--text);
}
input:autofill, textarea:autofill { color: var(--text); background: var(--input); }
input, textarea { caret-color: var(--text); }
.type-options label:focus-within { outline: 2px solid var(--primary); outline-offset: 3px; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
tbody tr:hover { background: var(--surface-soft); }
tbody td { color: var(--text); }
.empty p { color: var(--soft-text); }
.theme-toggle:active, .secondary:active { background: var(--accent-soft); }
::selection { background: var(--accent-border); color: var(--text); }
/* Hide scrollbar tracks without disabling navigation or scrolling. */
* { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar { display: none; width: 0; height: 0; }
html { scrollbar-gutter: auto; }
.delete-dialog::backdrop { background: #030b16a8; }
.dialog-close:hover, .logout:hover { background: var(--accent-soft); color: var(--primary); }
.topbar b { color: var(--faint-text); }
.topbar-actions { display: flex; align-items: center; gap: 14px; }
.news-toggle { position: relative; width: 38px; height: 38px; display: grid; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-soft); color: var(--text); flex-shrink: 0; }
.news-toggle:hover, .news-toggle[aria-expanded="true"] { border-color: var(--primary); color: var(--primary); background: var(--accent-soft); }
.news-toggle .icon { width: 19px; height: 19px; }
.news-dot { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--primary); top: 6px; right: 6px; box-shadow: 0 0 0 2px var(--surface-soft); }
.news-panel { position: fixed; inset: 82px 32px auto auto; margin: 0; width: 365px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 110px); padding: 0; overflow-y: auto; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); color: var(--text); box-shadow: var(--dialog-shadow); }
.news-panel::backdrop { background: transparent; }
.news-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 20px; border-bottom: 1px solid var(--border); }
.news-header h2 { font-size: 15px; margin: 0; }
.news-header p { font-size: 11px; color: var(--soft-text); margin: 5px 0 0; }
.news-item { padding: 18px 20px; border-bottom: 1px solid var(--border); }
.news-item:last-child { border-bottom: 0; }
.news-item time { font-size: 10px; color: var(--soft-text); }
.news-item h3 { font-size: 13px; margin: 7px 0; font-weight: 600; }
.news-item p { font-size: 12px; color: var(--soft-text); margin: 0; line-height: 1.7; }
.news-empty { padding: 20px; color: var(--soft-text); font-size: 12px; }
@media(max-width:700px) { .news-panel { inset: 250px 16px auto auto; max-height: calc(100dvh - 280px); } }
.environment-label { display: inline-flex; align-items: center; gap: 8px; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 38px; padding: 8px 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-soft); color: var(--text); font-size: 11px; white-space: nowrap; }
.theme-toggle:hover { border-color: var(--primary); }
.theme-toggle .icon { width: 17px; height: 17px; flex-basis: 17px; }
.theme-sun { display: none; }
[data-theme="dark"] .theme-sun { display: inline-block; }
[data-theme="dark"] .theme-moon { display: none; }
@media(max-width:850px) {
  .topbar > .topbar-actions { display: flex; font-size: 11px; gap: 10px; }
  .environment-label { display: none; }
}
@media(max-width:700px) {
  .topbar > .topbar-actions { display: flex; }
  .theme-toggle [data-theme-label] { display: none; }
  .theme-toggle { width: 38px; padding: 8px; }
  .topbar .top-avatar { display: none; }
}