:root { color-scheme: light; }
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e7edf3;
  --muted: #a3afbf;
  --line: #2a3542;
  --canvas: #0d1117;
  --sidebar: #10161d;
  --green-dark: #b2dd8f;
  --surface: #151c25;
  --surface-raised: #1e2834;
  --surface-soft: #111820;
  --quiet: #94a2b4;
  --accent: #b2dd8f;
  --success-bg: #203322;
  --success-line: #3b5436;
  --warning: #edc17c;
  --warning-bg: #332a1e;
  --warning-line: #615036;
  --danger: #f0aaa2;
  --danger-bg: #382327;
  --danger-line: #664048;
}

.brand small { letter-spacing: 3.5px; }
.brand-icon { font-size: 29px; }
.top-actions { gap: 14px; flex-shrink: 0; }
.breadcrumb { min-width: 0; }
.breadcrumb b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.theme-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: #435047;
  font-size: 10px;
}
.theme-button:hover { background: #edf3e7; }
.theme-button [data-theme-icon] { font-size: 17px; line-height: 1; }

/* Surfaces and fields, including dialogs and browser-native controls. */
[data-theme="dark"] :is(.topbar,.stat,.panel,.video-card,.mini-card,.login-form,dialog) { background: var(--surface); }
[data-theme="dark"] :is(.search input,.field input,.field select,.field textarea) { background: var(--surface-soft); color: var(--ink); border-color: var(--line); }
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder { color: var(--quiet); opacity: 1; }
[data-theme="dark"] :is(.video-preview,.tabs,.inline-help,.caption-preview,th) { background: var(--surface-soft); }
[data-theme="dark"] .login-intro { background: #1b2922; }
[data-theme="dark"] :is(.flow-node,.empty-symbol) { background: #233126; border-color: #41553b; color: var(--accent); }
[data-theme="dark"] .tab.active { background: var(--surface-raised); color: var(--ink); box-shadow: 0 1px 3px #0003; }
[data-theme="dark"] :is(.button,.icon-button,.theme-button,.modal-close) { background: var(--surface-raised); border-color: #3a4859; color: var(--ink); }
[data-theme="dark"] :is(.button,.icon-button,.theme-button,.modal-close):hover { background: #293747; }
[data-theme="dark"] .button.primary { background: var(--green); border-color: #9cd46f; color: #234326; }
[data-theme="dark"] .button.primary:hover { background: #b8ed94; }
[data-theme="dark"] .button.dark { background: #2e4837; border-color: #49614d; color: #e3f4d6; }
[data-theme="dark"] .button.danger { color: var(--danger); border-color: var(--danger-line); }
[data-theme="dark"] .button.ghost { color: var(--accent); background: transparent; border-color: transparent; }
[data-theme="dark"] .button.ghost:hover { background: var(--surface-raised); }
[data-theme="dark"] :is(.step,.step-number,.video-actions,td,.settings-row,.event,.caption-preview,dialog) { border-color: var(--line); }
[data-theme="dark"] dialog { box-shadow: 0 22px 100px #0009; }
[data-theme="dark"] dialog::backdrop { background: #060a10b3; }

/* Text uses brighter, neutral shades against the dark surfaces. */
[data-theme="dark"] :is(.breadcrumb,.time-zone,.connection-badge,.eyebrow,.stat-label,.stat-note,.panel-head p,.step p,.side-tip,.tab,.video-meta,.empty p,.empty-foot,th,.table-sub,.empty-inline,.field small,.settings-row p,.inline-help,.event time,.login-intro p,.login-form>p,.login-fineprint,.mini-card p,.pagination,footer,.modal-content>p,.check-label,.muted,.profile-message,.results-count,.loading) { color: var(--muted); }
[data-theme="dark"] :is(.breadcrumb b,.field>span) { color: var(--ink); }
[data-theme="dark"] :is(.breadcrumb span,.stat-symbol,.step-number,.video-placeholder) { color: var(--quiet); }
[data-theme="dark"] :is(.side-tip b,.step button,.tiny-link,.login-intro .eyebrow,.flow-strip,.mini-card .mini-icon) { color: var(--accent); }
[data-theme="dark"] :is(.stat.warn .stat-value) { color: var(--warning); }
[data-theme="dark"] .form-error { color: var(--danger); }

/* State colors remain distinct in cards, alerts, tables and task details. */
[data-theme="dark"] .notice { background: var(--success-bg); border-color: var(--success-line); color: #c0dfad; }
[data-theme="dark"] .notice .notice-icon { background: #344933; color: #cee7b7; }
[data-theme="dark"] .notice.warning { background: var(--warning-bg); border-color: var(--warning-line); color: var(--warning); }
[data-theme="dark"] .notice.warning .notice-icon { background: #524126; color: var(--warning); }
[data-theme="dark"] .notice.error { background: var(--danger-bg); border-color: var(--danger-line); color: var(--danger); }
[data-theme="dark"] .notice.error .notice-icon { background: #56343a; color: var(--danger); }
[data-theme="dark"] .tag { background: #293341; color: #bdc9d7; }
[data-theme="dark"] .tag.green { background: var(--success-bg); color: #bbdfa2; }
[data-theme="dark"] .tag.amber { background: var(--warning-bg); color: var(--warning); }
[data-theme="dark"] .tag.red { background: var(--danger-bg); color: var(--danger); }
[data-theme="dark"] .tag.blue { background: #23334b; color: #a9c7f2; }
[data-theme="dark"] .tag.dark { background: #2a3936; color: #bbd2c7; }
[data-theme="dark"] .step.done .step-number { background: var(--success-bg); color: var(--accent); border-color: var(--success-line); }
[data-theme="dark"] :is(.page-avatar,.schedule-time) { background: #213025; color: #bbd7a5; border-color: var(--success-line); }
[data-theme="dark"] .switch-track { background: #455161; }
[data-theme="dark"] .switch input:checked+.switch-track { background: #94c975; }
[data-theme="dark"] .spinner { border-color: #435a3d; border-top-color: var(--green); }
[data-theme="dark"] #toast { background: #293f2d; color: #e4f6d6; border: 1px solid #53764a; box-shadow: 0 5px 25px #0006; }
[data-theme="dark"] #toast.error { background: #4c2b30; color: #ffe0dc; border-color: #80515a; }

@media(max-width:720px) {
  .top-actions { gap: 8px; }
  .theme-button { width: 32px; padding: 6px; flex-shrink: 0; }
  .theme-button-label { display: none; }
  .brand-icon { font-size: 24px; }
}

[data-theme="dark"] .video-error{background:var(--warning-bg);border-color:var(--warning-line);color:var(--warning)}
[data-theme="dark"] .video-error .button{color:var(--warning)}