/* Default black theme. Layout and typography stay in styles.css. */
:root {
  color-scheme: dark;
  --bg: #0b0d10;
  --surface: #14171c;
  --surface-raised: #1b2028;
  --surface-hover: #252d39;
  --field-bg: #101318;
  --text: #edf1f7;
  --text-secondary: #bdc6d5;
  --muted: #99a5b8;
  --line: #2b3340;
  --brand: #093687;
  --accent: #8bb8ff;
  --soft: #172842;
  --red: #ffb1a8;
  --orange: #efc57f;
  color: var(--text);
  background: var(--bg);
}

body, .login-screen { background: var(--bg); color: var(--text); }
::selection { background: #2759a2; color: #fff; }
html { scrollbar-color: #485365 var(--bg); }

/* Navigation and page surfaces. */
.sidebar, .mobile-header { background: #101216; }
.topbar { background: #101216ed; }
.mobile-nav { background: #101216f5; border-color: var(--line); }
.brand-name, .mobile-header .brand-name { color: #edf3ff; }
.nav-link, .mobile-nav button { color: var(--text-secondary); }
.nav-count, .pill-count { background: #29313e; color: var(--text-secondary); }
.nav-link.active, .nav-link.active:hover, .nav-link.active:active,
.mobile-nav button.active { background: var(--brand); color: #fff; }
.nav-link.active .nav-count { background: #ffffff26; color: #fff; }
@media (hover: hover) {
  .nav-link:not(.active):hover { background: var(--surface-hover); color: var(--text); }
}
.nav-link:not(.active):active { background: #2a3546; color: var(--text); }
.avatar { background: var(--soft); color: var(--accent); }
.icon-button:hover { background: var(--surface-hover); color: var(--text); }
.breadcrumb strong { color: var(--text); }
.panel, .metric-card, .content-card, .job-card, .voice-card,
.setup-stats>div, .board-settings-form {
  background: var(--surface);
  border-color: var(--line);
}
.metric-icon, .activity-circle, .connection-symbol,
.integration-head .connection-symbol {
  background: var(--surface-raised);
  color: var(--text-secondary);
}
.metric-value, .activity-copy strong, .empty h3, .data-table td strong,
.rule-step strong, .oauth-account strong { color: var(--text); }

/* Supporting text remains legible on all dark surfaces. */
.brand-sub, .nav-label, .local-label, .breadcrumb, .topbar-right,
.mobile-header .private-label, .eyebrow, .page-description, .panel-kicker,
.metric-label, .automation-sub, .slot-period, .slot-description, .help-line,
.empty, .review-feature-info p, .activity-copy p, .connection-name,
.flow-item, .flow-arrow, .content-card-top, .content-card-bottom,
.editor-meta, .preview-caption, .source-links, .field small,
.approval-info, .cell-sub, .trend-card-top, .trend-card p, .trend-reason,
.step-number, .rule-step p, .integration-description, .job-meta,
.modal-description, .muted, .saved-label, .loading-state,
.oauth-account-label, .oauth-metadata dt, .oauth-browser-hint, .setup-status,
.oauth-manual>summary, .board-single-mode, .board-settings>summary,
.board-settings-form>.small-text, .board-settings-footer .small-text,
.board-results-heading p, .board-count, .board-result-time>span:last-child,
.board-rank, .board-rank-summary, .board-row-meta, .board-rank-metric span,
.board-empty, .board-guide, .board-guide p, .setup-profile,
.setup-stats span, .setup-check>span, .setup-guide ol, .setup-guide p,
.voice-heading p, .voice-provider, .voice-index, .voice-style, .voice-time,
.voice-usage-note, .login-box .eyebrow, .login-box>p, .login-note,
.login-foot, .login-art p { color: var(--muted); }
.field label, .field-label, .data-table td, .audit-list details,
.oauth-metadata dd, .oauth-setup>summary, .setup-check>strong,
.setup-guide summary, .upload-progress { color: var(--text-secondary); }
.text-link, .setup-profile a, .setup-card-actions a, .board-row-meta a,
.voice-source { color: var(--accent); }

/* Buttons, forms, tabs, and keyboard feedback. */
.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: #124ba8; }
.btn-secondary, .setup-card-actions .btn-secondary {
  background: var(--surface-raised); border-color: #3b485d; color: var(--text);
}
.btn-secondary:hover, .setup-card-actions .btn-secondary:hover {
  background: var(--surface-hover); border-color: #5e83b9;
}
.btn-quiet { color: var(--text-secondary); }
.btn-quiet:hover { background: var(--surface-hover); color: var(--text); }
.btn-danger { background: #392322; color: var(--red); }
.btn-danger:hover { background: #4c2a28; }
.input, .login-box .input, .board-query-form .input {
  background: var(--field-bg); border-color: #3b4657; color: var(--text);
  caret-color: var(--accent);
}
.input::placeholder { color: #8b97aa; }
.input:focus, .login-box .input:focus, .board-query-form .input:focus {
  background: var(--field-bg); border-color: var(--accent);
  outline: 2px solid #4979be; outline-offset: 1px;
}
.oauth-setup .input[readonly], .oauth-manual .input:disabled {
  background: var(--surface-raised); color: var(--muted);
}
.input option { background: var(--field-bg); color: var(--text); }
.checkbox-label { background: var(--field-bg); border-color: #3b4657; color: var(--text-secondary); }
.checkbox-label:has(input:checked) { background: var(--soft); border-color: #557cba; color: #dbe9ff; }
.checkbox-label input { accent-color: #4a88ef; }
.filter-tabs { background: #11151b; border: 1px solid var(--line); }
.filter-tab, .caption-tab { color: var(--text-secondary); }
.filter-tab:hover, .caption-tab:hover { background: var(--surface-hover); color: var(--text); }
.filter-tab.active { background: #2a3443; color: #fff; box-shadow: none; }
.caption-tab { background: var(--surface-raised); }
.caption-tab.active { background: #253e64; color: #dceaff; }
.board-platform-tab { color: var(--text-secondary); }
.board-platform-tab:hover { background: var(--surface-raised); }
.board-platform-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.board-guide>summary:focus-visible, .board-settings>summary:focus-visible,
button:focus-visible, a:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible { outline-color: var(--accent); }

/* Status, previews, and data panels. */
.preparation-strip, .automation-banner, .flow-panel, .oauth-panel {
  background: var(--surface-raised); border-color: var(--line); color: var(--text-secondary);
}
.switch { color: var(--text-secondary); }
.switch-track { background: #455064; }
.switch[aria-checked=true] .switch-track { background: #3778e8; }
.slot.ready { background: #13223a; border-color: #3d5c89; }
.badge { background: #2b323e; color: #c3cddd; }
.badge.review, .badge.needs_review { background: #3a2c18; color: #f3cb85; }
.badge.approved, .badge.completed, .badge.published, .badge.active, .badge.connected,
.badge.running, .badge.queued { background: #1d3555; color: #b1d0ff; }
.badge.held, .badge.blocked, .badge.failed { background: #382422; color: #ffb8ac; }
.channel-pill { background: #202733; border-color: #354155; color: var(--text-secondary); }
.thumbnail, .portrait-preview, .portrait-preview video { background: #080a0e; }
.thumbnail .video-play { background: #111827cc; color: #fff; }
.notice { background: #192332; border-color: #35445b; color: #bdcfe7; }
.notice.warning { background: #2c2418; border-color: #65502b; color: #edca8d; }
.notice.error { background: #322020; border-color: #6d3d38; color: #ffb8ac; }
.content-card.active { background: #15243a; border-color: #5075af; box-shadow: none; }
.data-table th { background: #10141a; color: var(--text-secondary); }
.data-table td, .board-rank-row, .setup-check { border-bottom-color: var(--line); }
.trend-reason { border-left-color: #47638c; }
.audit-list pre { background: #0e1218; color: var(--text-secondary); }
.dirty-hint, .oauth-reason { color: var(--orange); }
.form-error, .job-error, .voice-error { color: var(--red); }
.oauth-manual { border-color: var(--line); }
.board-result-link, .board-rank.leading, .board-rank-metric strong { color: var(--text); }
.setup-mode { background: var(--brand); border-color: #254e90; color: #fff; }
.setup-mode h2 { color: #fff; }
.setup-mode p { color: #d0e0fa; }
.setup-mode-icon { background: #ffffff1c; color: #fff; }
.setup-stats strong { color: var(--accent); }

/* Voice controls, dialogs, and sign-in. */
.voice-card.is-playing { border-color: #729bda; box-shadow: 0 0 0 1px #729bda; }
.voice-play { background: #243044; color: #dbe9ff; }
.voice-play:hover { background: #2c3d58; }
.voice-card.is-playing .voice-play { background: var(--brand); color: #fff; }
.voice-card.is-playing .voice-play:hover { background: #124ba8; }
.voice-progress { background: #2a3442; color: var(--accent); }
.voice-progress::-webkit-progress-bar { background: #2a3442; }
.voice-progress::-webkit-progress-value { background: var(--accent); }
.voice-progress::-moz-progress-bar { background: var(--accent); }
.modal-overlay { background: #000000b3; }
.modal { background: #181d25; color: var(--text); border: 1px solid #354052; box-shadow: 0 25px 90px #0008; }
.toast { background: #233856; color: #edf4ff; border: 1px solid #466187; box-shadow: 0 8px 25px #0006; }
.toast.error { background: #482927; border-color: #81504b; color: #ffe4df; }
.login-art { background: #101216; border-right: 1px solid var(--line); }
.login-art .brand-name { color: #edf3ff; }
.login-art .brand-symbol { background: var(--brand); color: #fff; }
.login-node { background: var(--surface-raised); border-color: #3b485d; color: var(--text-secondary); }
.login-node:last-child { background: var(--brand); color: #fff; }
.login-connector { background: #485a75; }
/* Public service information stays available on both sign-in and admin screens. */
.service-links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;padding:24px;font-size:12px;line-height:1.6}
.service-links a{color:#aab3c2;text-decoration:none}
.service-links a:hover{color:#e2ebff;text-decoration:underline}
.login-box .service-links{padding:26px 0 0}
.main>.service-links{padding-top:12px;padding-bottom:30px}
@media(max-width:760px){.main>.service-links{padding-bottom:94px}.service-links{gap:14px}}