:root {
  color-scheme: light;
  --surface-menu: #20282e;
  --surface-input: #ffffff;
  --surface-table: #ffffff;
  --surface-modal: #ffffff;
  --surface-button: #ffffff;
  --surface-alert: #f8fafb;
  --text-on-menu: #dce9ec;
  --link-color: #2d6b74;
  --hover-surface: #eef3f5;
  --focus-ring: #f2901e;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --brand-primary: #dce5e9;
  --brand-primary-dark: #10171c;
  --brand-hydro: #aebbc3;
  --surface-page: #12191e;
  --surface-card: #1d262c;
  --surface-menu: #10171c;
  --surface-input: #252f36;
  --surface-table: #1d262c;
  --surface-modal: #202a31;
  --surface-button: #273139;
  --surface-alert: #252f36;
  --text-primary: #edf2f4;
  --text-secondary: #aab8bf;
  --text-on-menu: #dce9ec;
  --border-color: #3b4850;
  --ink: #edf2f4;
  --ink-2: #c4d0d5;
  --navy: #1b2b33;
  --navy-deep: #0d1418;
  --teal: #71b8c2;
  --orange-light: #4b3420;
  --hydro: #b1bdc4;
  --hydro-light: #2b363d;
  --blue: #72b5dc;
  --green: #62bf98;
  --red: #ef8585;
  --canvas: var(--surface-page);
  --line: var(--border-color);
  --muted: var(--text-secondary);
  --white: var(--surface-card);
  --link-color: #78c1cc;
  --hover-surface: #29353c;
  --shadow: 0 14px 36px rgb(0 0 0 / 28%);
  --shadow-soft: 0 5px 18px rgb(0 0 0 / 22%);
  --bs-body-color: var(--text-primary);
  --bs-body-bg: var(--surface-page);
  --bs-border-color: var(--border-color);
  --bs-secondary-color: var(--text-secondary);
  --bs-tertiary-bg: #273139;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .app-main,
html[data-theme="dark"] .public-shell {
  color: var(--text-primary);
  background: var(--surface-page);
}

html[data-theme="dark"] a { color: var(--link-color); }
html[data-theme="dark"] a:hover { color: #f6a743; }
html[data-theme="dark"] .topbar {
  border-color: var(--line);
  background: rgb(24 32 38 / 94%);
}
html[data-theme="dark"] .sidebar {
  background: linear-gradient(180deg, #172128 0%, #0d1418 100%);
}
html[data-theme="dark"] .content-card,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .action-card,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .indicators-panel,
html[data-theme="dark"] .mini-metrics,
html[data-theme="dark"] .workflow-strip,
html[data-theme="dark"] .service-type-option,
html[data-theme="dark"] .account-popover,
html[data-theme="dark"] .searchable-select-results,
html[data-theme="dark"] .planned-team-results,
html[data-theme="dark"] .planned-team-selected,
html[data-theme="dark"] .offline-sync-bar,
html[data-theme="dark"] .offline-capture-panel,
html[data-theme="dark"] .offline-signature-card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .list-group-item {
  color: var(--text-primary);
  border-color: var(--line);
  background: var(--surface-card);
}
html[data-theme="dark"] .offline-signature-card canvas {
  border-color: #73858e;
  background: #fff;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .form-check-input,
html[data-theme="dark"] .input-group-text,
html[data-theme="dark"] textarea,
html[data-theme="dark"] option {
  color: var(--text-primary);
  border-color: #4a5962;
  background-color: var(--surface-input);
}
html[data-theme="dark"] .form-control::placeholder { color: #8fa0a8; }
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-select:disabled {
  color: #91a0a7;
  background: #1a2329;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
  color: var(--text-primary);
  background: #29343b;
}
html[data-theme="dark"] .table {
  --bs-table-color: var(--text-primary);
  --bs-table-bg: var(--surface-table);
  --bs-table-border-color: var(--line);
  --bs-table-striped-color: var(--text-primary);
  --bs-table-striped-bg: rgb(255 255 255 / 3%);
  --bs-table-hover-color: var(--text-primary);
  --bs-table-hover-bg: rgb(113 184 194 / 8%);
}
html[data-theme="dark"] .data-table thead th,
html[data-theme="dark"] .curve-matrix th {
  color: #bdc9ce;
  border-color: var(--line);
  background: #253139;
}
html[data-theme="dark"] .data-table td { border-color: var(--line); }

html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .topbar-notifications,
html[data-theme="dark"] .pagination .page-link {
  color: var(--text-primary);
  border-color: var(--line);
  background: var(--surface-button);
}
html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-outline-secondary:hover,
html[data-theme="dark"] .topbar-notifications:hover,
html[data-theme="dark"] .pagination .page-link:hover {
  color: #fff;
  background: #34424a;
}
html[data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%); }
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: var(--line); }
html[data-theme="dark"] .dropdown-item { color: var(--text-primary); }
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus,
html[data-theme="dark"] .searchable-select-results button:hover,
html[data-theme="dark"] .searchable-select-results button.active {
  color: #fff;
  background: var(--hover-surface);
}

html[data-theme="dark"] .alert-info { color: #b8dff2; border-color: #385d70; background: #203a47; }
html[data-theme="dark"] .alert-success { color: #bdebd7; border-color: #356b56; background: #1e3d32; }
html[data-theme="dark"] .alert-warning,
html[data-theme="dark"] .notice-box,
html[data-theme="dark"] .dev-box { color: #f5d7a8; border-color: #73552d; background: #42331f; }
html[data-theme="dark"] .alert-danger { color: #f5c0c0; border-color: #744343; background: #472929; }

html[data-theme="dark"] .card-heading > span,
html[data-theme="dark"] .execution-tabs button b,
html[data-theme="dark"] .review-panel > div,
html[data-theme="dark"] .draft-number,
html[data-theme="dark"] .revision-badge,
html[data-theme="dark"] .planned-team-selected {
  color: var(--text-primary);
  border-color: var(--line);
  background: #26323a;
}
html[data-theme="dark"] .check-card:hover,
html[data-theme="dark"] .service-type-option:hover,
html[data-theme="dark"] .attachment-card:hover,
html[data-theme="dark"] .planned-team-result:hover,
html[data-theme="dark"] .planned-team-result:focus-within {
  border-color: rgb(242 144 30 / 60%);
  background: #342d24;
}
html[data-theme="dark"] .check-card:has(input:checked),
html[data-theme="dark"] .service-type-option:has(input:checked) {
  border-color: var(--orange);
  background: #49351f;
}

html[data-theme="dark"] .auth-card-wrap,
html[data-theme="dark"] .auth-simple {
  background: var(--surface-page);
}
html[data-theme="dark"] .auth-input-wrap .form-control {
  color: var(--text-primary);
  border-color: #4a5962;
  background: var(--surface-input);
}
html[data-theme="dark"] .auth-input-wrap .form-control:focus { background: #29343b; }
html[data-theme="dark"] .auth-card-header { border-color: var(--line); }
html[data-theme="dark"] .auth-footer-rule { background: var(--line); }

html[data-theme="dark"] .project-card p,
html[data-theme="dark"] .project-card-data dt,
html[data-theme="dark"] .project-photo-card small,
html[data-theme="dark"] .spreadsheet-save-status,
html[data-theme="dark"] .curve-indicators span {
  color: var(--muted);
}
html[data-theme="dark"] .project-progress-track,
html[data-theme="dark"] .project-photo-card > a { background: #28343b; }
html[data-theme="dark"] .project-spreadsheet-shell,
html[data-theme="dark"] .project-spreadsheet,
html[data-theme="dark"] .project-spreadsheet td,
html[data-theme="dark"] .spreadsheet-row-menu,
html[data-theme="dark"] .curve-indicators article,
html[data-theme="dark"] .curve-matrix td,
html[data-theme="dark"] .curve-chart-panel,
html[data-theme="dark"] .project-photo-card,
html[data-theme="dark"] .project-dashboard-summary div {
  color: var(--text-primary);
  border-color: var(--line);
  background: var(--surface-card);
}
html[data-theme="dark"] .project-spreadsheet tbody tr:hover td,
html[data-theme="dark"] .curve-matrix tr:nth-child(even) td { background: #253139; }
html[data-theme="dark"] .project-spreadsheet tbody tr.selected td { background: #254250; }
html[data-theme="dark"] .project-spreadsheet tbody tr.summary td,
html[data-theme="dark"] .project-spreadsheet tr.summary td:nth-child(-n+3) { background: #2a363d; }
html[data-theme="dark"] .project-spreadsheet tbody tr.root-summary td,
html[data-theme="dark"] .project-spreadsheet tr.root-summary td:nth-child(-n+3) { background: #34434b; }
html[data-theme="dark"] .spreadsheet-cell-input:focus { color: #fff; background: #29343b; }
html[data-theme="dark"] .curve-toolbar { border-color: var(--line); background: #1a2329; }
html[data-theme="dark"] .project-dashboard-summary dd { color: var(--text-primary); }
html[data-theme="dark"] .curve-workspace.is-presenting { background: #12191e; }
html[data-theme="dark"] .curve-workspace.is-presenting .curve-section-header {
  border-color: var(--line);
  background: #1a2329;
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-indicators strong {
  color: var(--text-primary);
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-indicators span {
  color: var(--text-secondary);
}
html[data-theme="dark"] .curve-workspace.is-presenting .presentation-gallery-controls button {
  border-color: var(--line);
  color: var(--text-primary);
  background: var(--surface-button);
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-section,
html[data-theme="dark"] .curve-workspace.is-presenting .curve-presentation-metrics article {
  color: var(--text-primary);
  border-color: var(--line);
  background: var(--surface-card);
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-presentation-metrics strong,
html[data-theme="dark"] .curve-workspace.is-presenting .curve-section-header h2,
html[data-theme="dark"] .curve-workspace.is-presenting .curve-tasks-table td {
  color: var(--text-primary);
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-presentation-metrics span,
html[data-theme="dark"] .curve-workspace.is-presenting .curve-chart-empty,
html[data-theme="dark"] .curve-workspace.is-presenting .curve-tasks-table td:nth-child(2) small {
  color: var(--text-secondary);
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-tasks-table th {
  color: #c8d5da;
  background: #26343b;
}
html[data-theme="dark"] .curve-workspace.is-presenting .curve-tasks-table td {
  border-color: var(--line);
}

.theme-toggle,
.connectivity-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .38rem;
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: .42rem .58rem;
  color: var(--ink);
  background: var(--surface-button);
  font: inherit;
  font-size: .7rem;
  font-weight: 750;
  white-space: nowrap;
}
.theme-toggle:hover,
.connectivity-indicator:hover { background: var(--hover-surface); }
.theme-toggle:focus-visible,
.connectivity-indicator:focus-visible {
  outline: 3px solid rgb(242 144 30 / 45%);
  outline-offset: 2px;
}
.theme-toggle [data-theme-icon] { width: 1rem; font-size: 1rem; line-height: 1; }
.connection-dot {
  width: .56rem;
  height: .56rem;
  flex: 0 0 .56rem;
  border-radius: 50%;
  background: #7d8a91;
  box-shadow: 0 0 0 3px rgb(125 138 145 / 12%);
}
.connectivity-indicator[data-state="ONLINE"] .connection-dot,
.connectivity-indicator[data-state="SYNCED"] .connection-dot { background: var(--green); }
.connectivity-indicator[data-state="OFFLINE"] .connection-dot,
.connectivity-indicator[data-state="PENDING"] .connection-dot { background: var(--orange); }
.connectivity-indicator[data-state="ERROR"] .connection-dot,
.connectivity-indicator[data-state="NEEDS_REVIEW"] .connection-dot { background: var(--red); }
.connectivity-indicator[data-state="CHECKING"] .connection-dot,
.connectivity-indicator[data-state="SYNCING"] .connection-dot {
  background: var(--blue);
  animation: connectionPulse 1.1s ease-in-out infinite;
}
.connectivity-pending {
  min-width: 1.2rem;
  border-radius: 99px;
  padding: .08rem .3rem;
  color: #182027;
  background: var(--orange);
  font-size: .62rem;
  text-align: center;
}
@keyframes connectionPulse {
  50% { opacity: .4; transform: scale(.78); }
}
.public-utilities {
  position: fixed;
  top: .75rem;
  right: .75rem;
  z-index: 1200;
  display: flex;
  gap: .4rem;
}

@media (max-width: 900px) {
  .theme-toggle-text,
  .connectivity-label { display: none; }
  .theme-toggle,
  .connectivity-indicator { width: 36px; min-width: 36px; padding: .35rem; }
  .connectivity-pending { position: absolute; top: -5px; right: -5px; }
}

@media (prefers-reduced-motion: reduce) {
  .connectivity-indicator .connection-dot { animation: none !important; }
}