.theme-preference-field {
  display: grid;
  gap: 7px;
  padding-top: 2px;
}

.theme-preference-field > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.theme-preference-field select {
  width: 100%;
  min-height: 38px;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #11161d;
  --surface: #1a2029;
  --surface-2: #202732;
  --surface-3: #28313d;
  --line: #34404d;
  --line-strong: #526274;
  --text: #edf2f7;
  --muted: #a8b4c2;
  --soft: #8290a0;
  --accent: #70a1ff;
  --accent-2: #9bbcff;
  --danger: #ff7b80;
  --ok: #63d49b;
  --shadow: 0 14px 36px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] body.dashboard-page {
  color: var(--text);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px),
    var(--bg);
  background-size: 42px 42px;
}

html[data-theme="dark"] body.dashboard-page :is(button, input, select, textarea) {
  color: var(--text);
  border-color: var(--line);
  background: var(--surface-2);
}

html[data-theme="dark"] body.dashboard-page button:hover {
  border-color: var(--line-strong);
  background: var(--surface-3);
}

html[data-theme="dark"] body.dashboard-page :is(.panel, .workspace-chrome, .settings-dialog, .action-confirmation-tray, .mobile-more-menu, .zhouzhou-drawer) {
  color: var(--text);
  border-color: var(--line);
  background: var(--surface);
  box-shadow: var(--shadow);
}

html[data-theme="dark"] body.dashboard-page :is(.sidebar, .sidebar-health, .workspace-search, .todo-command-center, .auth-card) {
  color: var(--text);
  border-color: var(--line);
  background: var(--surface);
}

html[data-theme="dark"] body.dashboard-page .sidebar {
  background: #151b23;
}

html[data-theme="dark"] body.dashboard-page :is(.side-nav a, .side-nav-section, .brand-copy strong, .brand-copy span) {
  color: var(--muted);
}

html[data-theme="dark"] body.dashboard-page :is(.side-nav a.active, .side-nav a:hover) {
  color: var(--text);
  background: rgba(112, 161, 255, 0.16);
}

html[data-theme="dark"] body.dashboard-page :is(.panel-head h2, .section-page-head h1, .section-page-head h2, .section-page-head p, .status-grid strong, label, legend, .quiet, .empty) {
  color: var(--text);
}

html[data-theme="dark"] body.dashboard-page :is(.panel-head span, .status-grid span, label span, .quiet, .empty, .workspace-user) {
  color: var(--muted);
}

html[data-theme="dark"] body.dashboard-page :is(.calendar-month-panel, .calendar-month-grid, .todo-column, .todo-capture, .system-center-card) {
  border-color: var(--line);
  background: var(--surface);
}

html[data-theme="dark"] body.dashboard-page :is(.calendar-month-day.is-outside, .todo-column-head, .system-facts, .system-status-list, .auth-form .auth-one-time-option) {
  background: var(--surface-2);
  border-color: var(--line);
}

html[data-theme="dark"] body.dashboard-page .auth-gate {
  background:
    radial-gradient(circle at 18% 16%, rgba(112, 161, 255, 0.16), transparent 30%),
    radial-gradient(circle at 84% 82%, rgba(99, 212, 155, 0.1), transparent 34%),
    var(--bg);
}

html[data-theme="dark"] body.dashboard-page :is(.auth-heading h1, .auth-form input, .auth-form .auth-one-time-option) {
  color: var(--text);
}

html[data-theme="dark"] body.dashboard-page :is(.auth-heading span, .auth-heading p, .auth-form label > span, .auth-form > p, .auth-one-time-option small) {
  color: var(--muted);
}

html[data-theme="dark"] body.dashboard-page :is(.today-risk-bar, .cockpit-home-rail, .mobile-more-backdrop) {
  background-color: transparent;
}

html[data-theme="dark"] body.dashboard-page :is(.primary, .auth-form .primary) {
  color: #101722;
  border-color: var(--accent);
  background: var(--accent);
}

html[data-theme="dark"] body.dashboard-page :is(.primary, .auth-form .primary):hover {
  color: #101722;
  border-color: var(--accent-2);
  background: var(--accent-2);
}

html[data-theme="dark"] body.dashboard-page :is(.status-chip, .badge, .todo-column-count) {
  border-color: var(--line);
}

html[data-theme="dark"] body.dashboard-page :is(.workspace-search input, .cockpit-section-head h2, .cockpit-schedule-project strong, .cockpit-home-rail .today-list-row strong, .cockpit-tool-links > a, .cockpit-tool-links > button) {
  color: var(--text);
}

html[data-theme="dark"] body.dashboard-page :is(.workspace-search svg, .workspace-search kbd, .cockpit-section-head span, .cockpit-schedule-table-head, .cockpit-home-rail .today-list-row span:not(.today-list-marker):not(.today-grade)) {
  color: var(--muted);
}

html[data-theme="dark"] body.dashboard-page .workspace-search input::placeholder {
  color: var(--muted);
}

html[data-theme="dark"] body.dashboard-page :is(.workspace-search kbd, .cockpit-todo-list .today-list-marker) {
  border-color: var(--line);
  background: var(--surface-2);
}

html[data-theme="dark"] body.dashboard-page :is(.cockpit-schedule-table-head, .cockpit-schedule-list .today-list-row, .cockpit-home-rail .today-list-row) {
  border-color: var(--line);
}

html[data-theme="dark"] body.dashboard-page .calendar-month-day.is-weekend {
  background: rgba(112, 161, 255, 0.08);
}

html[data-theme="dark"] body.dashboard-page .calendar-month-nav button:hover:not(:disabled),
html[data-theme="dark"] body.dashboard-page .calendar-month-nav button:focus-visible {
  background: rgba(112, 161, 255, 0.16);
}

html[data-theme="dark"] body.dashboard-page .calendar-month-event {
  border-color: rgba(112, 161, 255, 0.62);
  background: rgba(112, 161, 255, 0.2);
  color: #b8d0ff;
}

html[data-theme="dark"] body.dashboard-page .calendar-month-event[data-tone="1"] {
  border-color: rgba(99, 212, 155, 0.62);
  background: rgba(99, 212, 155, 0.16);
  color: #9ae8bd;
}

html[data-theme="dark"] body.dashboard-page .calendar-month-event[data-tone="2"] {
  border-color: rgba(174, 190, 219, 0.52);
  background: rgba(174, 190, 219, 0.14);
  color: #c5d0e4;
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme="dark"] body.dashboard-page * {
    transition-duration: 0.01ms !important;
  }
}