/* Shared appearance controls. Light mode keeps the existing white canvas. */
:root {
  color-scheme: light;
  --theme-canvas: #fff;
  --theme-surface: #fff;
  --theme-raised: #f0f4f1;
  --theme-text: #253c34;
  --theme-muted: #526459;
  --theme-line: #dce4db;
  --theme-accent: #315c4d;
  --theme-selected: #e4eee7;
}
.header-actions { display:flex; align-items:center; justify-content:flex-end; gap:14px; margin-left:auto; flex-shrink:0; }
.theme-switch { display:inline-flex; align-items:center; gap:3px; padding:4px; border:1px solid var(--theme-line); border-radius:999px; background:var(--theme-surface); }
header .theme-switch button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:7px 12px; margin:0; border:1px solid transparent; border-radius:999px; background:transparent; color:var(--theme-muted); font-size:12px; font-weight:600; white-space:nowrap; line-height:1.4; }
header .theme-switch button[aria-pressed=true] { background:var(--theme-selected); color:var(--theme-accent); border-color:var(--theme-line); }
.theme-switch svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.header-actions #logout { margin:0; }
header .theme-switch button:focus-visible { outline:3px solid #b58b42; outline-offset:3px; }

html[data-theme=dark] {
  color-scheme: dark;
  --theme-canvas: #111916;
  --theme-surface: #19231f;
  --theme-raised: #223029;
  --theme-text: #e7efe9;
  --theme-muted: #b0c1b7;
  --theme-line: #384c41;
  --theme-accent: #9ecfb4;
  --theme-selected: #294b3b;
  --ink: var(--theme-text);
  --muted: var(--theme-muted);
  --green: var(--theme-accent);
  --green-dark: #76b493;
  --line: var(--theme-line);
  --surface: var(--theme-surface);
  --canvas: var(--theme-canvas);
}
html[data-theme=dark] body { background:var(--theme-canvas); color:var(--theme-text); }
html[data-theme=dark] .login-art { background:var(--theme-surface); }
html[data-theme=dark] :is(body>header,.card,dialog,.login-layout,.login-form-wrap,.recovery-card,.account-summary,.dash-prior,.calendar-date,.calendar-day-panel,.metric,.director-workspace>nav,.dashboard-four-grid>.dash-grid,.dash-drawer-actions) { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-line); }
html[data-theme=dark] :is(input,select,textarea) { background:#141e19; color:var(--theme-text); border-color:#61776a; accent-color:var(--theme-accent); }
html[data-theme=dark] :is(input,textarea)::placeholder { color:#9aada1; }
html[data-theme=dark] :is(button,.instagram-link,.recovery-login) { background:#37654f; color:#f4faf6; }
html[data-theme=dark] :is(button.secondary,.admin-tabs button,.segmented button,.director-workspace>nav button) { background:var(--theme-raised); color:var(--theme-muted); border-color:var(--theme-line); }
html[data-theme=dark] :is(button:disabled,.member-workspace button:disabled) { background:#2a352f; color:#9aada1; border-color:var(--theme-line); }
html[data-theme=dark] :is(.director-workspace>nav button[aria-current],.segmented button[aria-pressed=true]) { background:var(--theme-selected); color:#c7e9d5; }
html[data-theme=dark] .admin-tabs [aria-selected=true] { background:#37654f; color:#f4faf6; }
html[data-theme=dark] :is(a,.loading,.save-notice,.schedule-preview,.chart-data,.event-time,.dash-time,.dash-receipt-total>strong,.recovery-icon,.recovery-back) { color:var(--theme-accent); }
html[data-theme=dark] :is(.instagram-link,.recovery-login) { color:#f4faf6; }
html[data-theme=dark] :is(.muted,.eyebrow,header small,.metric small,.event-time small,.calendar-legend,.calendar-weekdays span,.calendar-date small,.management-table td small,.dash-grid-heading .eyebrow,.dash-time small,.dash-prior strong small,.dash-empty,.dash-receipt-total>span,.dash-receipt-total>small,.dash-difference,.dash-bar-column>span,.dash-bar-column>small,.dash-journal-table small,.dash-drawer-heading p,.recovery-help,.recovery-steps) { color:var(--theme-muted); }
html[data-theme=dark] :is(.login-card .eyebrow,.icon) { color:#dcc28d; }
html[data-theme=dark] :is(th,.badge,.section-icon,.empty,.status-neutral) { background:var(--theme-raised); color:var(--theme-text); }
html[data-theme=dark] .director-workspace>.row:first-child .badge { background:var(--theme-raised); color:var(--theme-accent); }
html[data-theme=dark] :is(td,th,article,.admin-tabs,.calendar-days,.calendar-date,.dash-selected-date,.dash-internal,.dash-drawer-heading,.dash-drawer-actions,.enrollment-schedule,.recovery-steps span) { border-color:var(--theme-line); }
html[data-theme=dark] .calendar-date:hover:not(:disabled) { background:var(--theme-raised); }
html[data-theme=dark] .calendar-date[aria-pressed=true] { background:var(--theme-selected); box-shadow:inset 0 0 0 2px var(--theme-accent); }
html[data-theme=dark] .calendar-date.adjacent strong { color:#85978c; }
html[data-theme=dark] .dash-days :is(.is-today strong,strong small) { color:var(--theme-accent); }
html[data-theme=dark] .kind-0 { background:#303650; color:#ced4ff; }
html[data-theme=dark] .kind-1 { background:#483722; color:#f0c88e; }
html[data-theme=dark] .kind-2 { background:#254534; color:#bae0c9; }
html[data-theme=dark] .kind-3 { background:#3c3337; color:#dccbd0; }
html[data-theme=dark] .calendar-legend .kind-0 { background:#a7afe4; }
html[data-theme=dark] .calendar-legend .kind-1 { background:#e3b578; }
html[data-theme=dark] .calendar-legend .kind-2 { background:#8fbc9f; }
html[data-theme=dark] .calendar-legend .kind-3 { background:#c1aeb8; }
html[data-theme=dark] .dash-empty>span { color:var(--theme-accent); }
html[data-theme=dark] :is(.status-danger,.error:not(:empty),.recovery-error) { color:#ffb5aa; }
html[data-theme=dark] .status-danger { background:#4b2e2b; }
html[data-theme=dark] .status-attention { background:#483722; color:#f0c88e; }
html[data-theme=dark] :is(.status-info,.status-good) { background:#254534; color:#bae0c9; }
html[data-theme=dark] .status-info { background:#293c50; color:#c1d9f2; }
html[data-theme=dark] :is(button,input,select,textarea,summary,a):focus-visible { outline-color:#e1c084; }
html[data-theme=dark] dialog::backdrop { background:#070d0bb8; }
html[data-theme=dark] .lesson-note-drawer { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-line); box-shadow:-12px 0 50px #0006; }
html[data-theme=dark] :is(.dash-bar-track rect,.chart-class,.chart-dot) { fill:#53896c; }
html[data-theme=dark] .dash-bar-track rect.current { fill:var(--theme-accent); }
html[data-theme=dark] :is(.stats-chart text,.stats-chart .chart-value) { fill:var(--theme-text); }
html[data-theme=dark] .chart-gridline { stroke:var(--theme-line); }
html[data-theme=dark] header .theme-switch button { background:transparent; color:var(--theme-muted); border-color:transparent; }
html[data-theme=dark] header .theme-switch button[aria-pressed=true] { background:var(--theme-selected); color:#c7e9d5; border-color:#61776a; }
html[data-theme=dark] :is(.recovery-steps [aria-current],.recovery-status) { color:var(--theme-accent); border-color:var(--theme-line); }
html[data-theme=dark] .recovery-steps [aria-current] span { background:#37654f; color:#fff; border-color:#61776a; }

/* Member pages use their own scoped design tokens. */
html[data-theme=dark] .member-workspace {
  --student-primary: var(--theme-accent);
  --student-deep: #254b38;
  --student-ink: var(--theme-text);
  --student-muted: var(--theme-muted);
  --student-canvas: var(--theme-canvas);
  --student-line: var(--theme-line);
  --student-tint: #243c2e;
  --student-gold: #dcc28d;
}
html[data-theme=dark] :is(.student-card,.student-goal,.student-studio,.student-small-symbol,.student-performance-card,.student-performance-art,.student-heading-icon,.student-video-intro,.student-practice-note,.member-workspace .student-nav,.member-workspace .student-outline-button,.member-workspace .student-account-action,.member-workspace .instagram-link,.student-performance-art>.student-play-icon) { background:var(--theme-surface); border-color:var(--theme-line); }
html[data-theme=dark] .student-performance-card:nth-child(even) .student-performance-art { background:var(--theme-raised); color:#dcc28d; }
html[data-theme=dark] .member-workspace .student-practice { background:#203e2e; color:#f4faf6; }
html[data-theme=dark] .member-workspace .student-button { background:#37654f; color:#f4faf6; }
html[data-theme=dark] .member-workspace .instagram-link { color:var(--theme-accent); }
html[data-theme=dark] .member-workspace .student-button-light { background:#e0ecdf; color:#173f35; }
html[data-theme=dark] .member-workspace .lesson-day.selected { background:#37654f; color:#f4faf6; }
html[data-theme=dark] .member-workspace .error:not(:empty) { background:#422925; color:#ffb5aa; border-color:#8b5a50; }
html[data-theme=dark] .member-workspace .student-studio .eyebrow { color:#c3d8c9; }
html[data-theme=dark] .student-studio:after { background:linear-gradient(90deg,#19231ff5,#19231fde 55%,#19231f40); }
html[data-theme=dark] .student-monogram { background:#dce9e0; }

/* Practice history, editor, and selected lesson states. */
html[data-theme=dark] #practice-page {
  color-scheme:dark;
  --green:var(--theme-accent);
  --deep:#315d49;
  --ink:var(--theme-text);
  --muted:var(--theme-muted);
  --line:var(--theme-line);
  --white:var(--theme-surface);
  background:var(--theme-canvas);
  color:var(--theme-text);
}
html[data-theme=dark] #practice-page :is(.site-header,.hero,.practice-panel,.context-panel,.history-panel,.history-calendar-card,.history-detail,.record-button,.lesson-summary-text,.close-button,.text-button,.calendar-month-button,.calendar-date,.view-tabs button,.calendar-toolbar input,.custom-time input,input[type=date],textarea,dialog) { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-line); }
html[data-theme=dark] #practice-page :is(.primary-button,.view-tabs button[aria-selected=true],.time-options input:checked+span,.calendar-date.is-selected) { background:#37654f; color:#f4faf6; border-color:#61776a; }
html[data-theme=dark] #practice-page :is(.calendar-date.is-lesson,.legend-lesson,.history-lesson-badge) { background:#293c50; color:#c1d9f2; border-color:#587596; }
html[data-theme=dark] #practice-page .calendar-date.is-selected { background:#37654f; color:#f4faf6; }
html[data-theme=dark] #practice-page .calendar-date:disabled { color:#899a8e; }
html[data-theme=dark] #practice-page .hero:after { background:linear-gradient(90deg,#19231f 32%,#19231fed 50%,#19231f40); }
html[data-theme=dark] #practice-page .form-error { color:#ffb5aa; }
html[data-theme=dark] #practice-page .primary-button:disabled { background:#2a352f; color:#9aada1; }
html[data-theme=dark] #practice-page progress,html[data-theme=dark] #practice-page progress::-webkit-progress-bar { background:var(--theme-raised); }

@media(max-width:600px) {
  body>header { flex-wrap:wrap; }
  .header-actions { gap:8px; }
  header .theme-switch button { padding:7px 9px; }
}
@media(max-width:480px) {
  header .theme-switch button span { display:none; }
  header .theme-switch button { min-width:36px; }
  body>header .site-brand { flex-basis:160px; width:160px; }
}