/* Optional browser appearance; light remains the default. */
:root { color-scheme: light; }
.theme-control { display: flex; align-items: center; gap: 14px; min-height: 44px; cursor: pointer; width: fit-content; }
.theme-control input[type=checkbox] {
  appearance: none; flex-shrink: 0; width: 44px; height: 26px; margin: 0;
  border: 1px solid var(--muted); border-radius: 20px; background: var(--line); cursor: pointer;
}
.theme-control input::before {
  content: ''; display: block; width: 18px; height: 18px; margin: 3px;
  border-radius: 50%; background: var(--ink);
}
.theme-control input:checked { background: var(--red); border-color: var(--red); }
.theme-control input:checked::before { transform: translateX(18px); background: var(--paper); }
.appearance-card .helptext { margin: 10px 0 0; }
.appearance-card [role=status]:empty { display: none; }

:root[data-theme=dark] {
  color-scheme: dark;
  --paper: #171b19;
  --white: #212723;
  --ink: #e7ebe4;
  --muted: #b0b9ae;
  --line: #3b463e;
  --red: #f18a91;
  --red-pale: #39282c;
  --dark: #303d34;
  --shadow: 0 5px 24px #00000018;
}
:root[data-theme=dark] :is(.sidebar, .public-story, .public-availability, .auth-card) { background: var(--white); }
:root[data-theme=dark] :is(.sidebar nav a, .sidebar :is(button,a).logout) { color: var(--ink); }
:root[data-theme=dark] .sidebar-bottom p { color: var(--muted); }
:root[data-theme=dark] :is(.sidebar nav a:hover, .sidebar .logout:hover, .avatar) { background: var(--dark); }
:root[data-theme=dark] :is(.sidebar-bottom, .member-chip, .panel-header, .list-row, th, td, .public-availability) { border-color: var(--line); }
:root[data-theme=dark] .stat-card { border-top-color: #667a65; }
:root[data-theme=dark] :is(.brand-art img, .hero-brand img) { filter: invert(1) hue-rotate(180deg); mix-blend-mode: screen; }
:root[data-theme=dark] :is(.date-pill, .tabs a, .skip-link) { background: var(--white); }
:root[data-theme=dark] .tabs a[aria-current=page] { background: var(--dark); }
:root[data-theme=dark] :is(.empty-state, .analysis-details, th) { background: #1b211e; border-color: var(--line); }
:root[data-theme=dark] :is(.row-icon, .empty-icon) { color: var(--muted); }
:root[data-theme=dark] :is(input:not([type=checkbox]):not([type=hidden]), select, textarea) { background: #171d19; border-color: #748371; }
:root[data-theme=dark] :is(input, select, textarea):focus-visible { outline-color: var(--red); }
:root[data-theme=dark] :is(.button, .btn, button[type=submit]) { background: #b93240; border-color: #d95865; color: #fff; }
:root[data-theme=dark] :is(.button, .btn, button[type=submit]):hover { background: #a82936; }
:root[data-theme=dark] :is(.button.secondary, .btn-secondary) { background: transparent; color: var(--ink); border-color: #748371; }
:root[data-theme=dark] :is(.button.secondary, .btn-secondary):hover { background: var(--dark); }
:root[data-theme=dark] .button.danger { background: var(--red-pale); color: var(--red); border-color: #89555c; }
:root[data-theme=dark] .button.danger:hover { background: #493036; }
:root[data-theme=dark] .sidebar button.logout { background: transparent; border: 0; color: var(--ink); }
:root[data-theme=dark] .sidebar button.logout:hover { background: var(--dark); }
:root[data-theme=dark] .notice { background: #27352a; color: #c1dbb5; border-color: #51674a; }
:root[data-theme=dark] :is(.notice.error, .errorlist.nonfield, .delete-summary) { background: var(--red-pale); border-color: #89555c; color: #ffb5ba; }
:root[data-theme=dark] .errorlist { color: #ffb5ba; }
:root[data-theme=dark] .errorlist:focus { outline-color: #ffb5ba; }
:root[data-theme=dark] .main :is(input, select, textarea)[aria-invalid=true] { border-color: #ffb5ba; }
:root[data-theme=dark] .progress-track { background: var(--line); }
:root[data-theme=dark] .weight-chart polyline { stroke: var(--red); }
:root[data-theme=dark] .weight-chart polygon { fill: #f18a9115; }
:root[data-theme=dark] .weight-chart path { stroke: var(--line); }
/* Keep activity intensity ordered and visibly distinct from an empty day. */
:root[data-theme=dark] :is(.day-square, .intensity-0) { background: #303932; border-color: #414e43; }
:root[data-theme=dark] .intensity-1 { background: #683a40; border-color: #855059; }
:root[data-theme=dark] .intensity-2 { background: #a34e58; border-color: #bf6470; }
:root[data-theme=dark] .intensity-3 { background: #d77580; border-color: #e78b94; }
:root[data-theme=dark] .intensity-4 { background: #ffb5ba; border-color: #ffced1; }
/* Saved video evidence keeps the same state labels, hatching and focus cues. */
:root[data-theme=dark] :is(.moment-link, .observation, .track-text li) { border-color: #748371; }
:root[data-theme=dark] :is(.observation:target, .observation:focus, .graph-evidence:target, .video-analysis :focus-visible) { outline-color: var(--red); }
:root[data-theme=dark] .track-bar { background: var(--paper); border-color: #748371; }
:root[data-theme=dark] .track-gap { background: repeating-linear-gradient(135deg, transparent 0 7px, #3b463e 7px 9px); }
:root[data-theme=dark] .track-segment { background: #304755; color: var(--ink); border-color: #81918c; }
:root[data-theme=dark] :is(.state-athlete_pressing, .state-close_range, .state-visible_opening) { background: #643e39; }
:root[data-theme=dark] :is(.state-opponent_pressing, .state-at_apparent_reach) { background: #574b2f; }
:root[data-theme=dark] .state-unknown { background: repeating-linear-gradient(90deg, #38373f 0 4px, #45444d 4px 8px); }
:root[data-theme=dark] :is(.state-not_applicable, .state-disputed) { background: #3a3e3b; }
@media (forced-colors: active) {
  .theme-control input[type=checkbox] { appearance: auto; }
  .theme-control input::before { display: none; }
}