/* Semantic surfaces keep the light design intact and make dark mode intentional. */
:root{color-scheme:light;--theme-surface:var(--card);--theme-raised:#fff;--theme-hover:#e9e5ee;--theme-button:#7259a5;--theme-on-button:#fff;--theme-focus:#7259a5;--theme-track:#dedbe3;--theme-danger:#a64c52}
.display-controls{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:7px 12px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);font:inherit;font-size:11px;cursor:pointer;box-shadow:var(--shadow-soft)}
.theme-toggle:hover{background:var(--theme-hover)}
.theme-toggle:focus-visible{outline:3px solid var(--theme-focus);outline-offset:3px}
.theme-toggle-icon{display:grid;place-items:center;flex:0 0 auto;width:19px;height:19px;color:var(--purple-dark)}
.theme-toggle-icon svg{width:19px;height:19px}
.theme-toggle-copy{display:grid;justify-items:start;gap:0;line-height:1.5}
.theme-toggle-copy b{font-size:11px;font-weight:700}.theme-toggle-copy small{color:#656561;font-size:11px}
.theme-toggle-switch{position:relative;width:27px;height:16px;border-radius:12px;background:#a19aa8;flex:0 0 auto}
.theme-toggle-switch::after{content:"";position:absolute;top:3px;right:3px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .16s}
.theme-toggle[aria-pressed=true] .theme-toggle-switch{background:var(--purple)}
.theme-toggle[aria-pressed=true] .theme-toggle-switch::after{transform:translateX(-11px);background:#20172f}
.auth-theme-toggle{position:absolute;top:27px;left:5vw}
.admin-display-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
@media(max-width:680px){.dash-title-line{flex-wrap:wrap}.dash-title-line h1{flex-basis:100%;white-space:normal}.dash-title-line .display-controls{width:100%;justify-content:space-between;gap:10px}.dash-title-line .dashboard-time-chip{flex:1;min-width:132px}.topbar>.display-controls{grid-area:clock;min-width:0;justify-content:space-between}.topbar .display-controls .time-chip{flex:1;min-width:0;grid-template-columns:auto auto;align-items:center;column-gap:8px}.theme-toggle{min-height:44px;flex-shrink:0}.auth-theme-toggle{top:21px}.habits-page-actions>.theme-toggle{align-self:flex-end}.admin-display-controls{gap:8px}}
@media(prefers-reduced-motion:reduce){.theme-toggle-switch::after{transition:none}}

html[data-theme=dark]{
  color-scheme:dark;
  --paper:#16181f;--card:#20232d;--theme-surface:#252936;--theme-raised:#2b3040;--theme-hover:#303648;
  --ink:#eef0f7;--muted:#b1b8ca;--line:#3a4254;
  --purple:#bba3ef;--purple-dark:#d1bcff;--purple-soft:#34304b;
  --green:#79cbaa;--green-dark:#9edcbd;--green-soft:#233f36;
  --bronze:#edc68a;--theme-danger:#f1a3ab;--theme-button:#bba3ef;--theme-on-button:#231935;--theme-focus:#d1bcff;--theme-track:#3a3d50;
  --shadow-soft:0 6px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(224,229,255,.035);
  --shadow-inset:inset 0 1px 5px rgba(0,0,0,.22),inset 0 0 0 1px rgba(194,180,236,.13);
  scrollbar-color:#69718a var(--paper);
}
html[data-theme=dark] body{color:var(--ink);background:var(--paper)}
html[data-theme=dark] .theme-toggle-copy small{color:var(--muted)}
html[data-theme=dark] :is(.app-sidebar,.admin-sidebar){background:#1b1e27;border-color:var(--line)}
html[data-theme=dark] :is(.dash-calendar-card,.daily-card,.analytics-card,.managed-habit-card,.admin-panel,.admin-metrics article,.auth-card,.quick-dialog,.calendar-select-menu,.mini-date-picker,.task-time-picker){border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow-soft)}
html[data-theme=dark] :is(.side-link,.admin-nav,.main-nav a,.quiet-link){color:var(--muted)}
html[data-theme=dark] :is(.side-link.active,.admin-nav.active,.admin-menu-toggle.active,.admin-menu-toggle.is-expanded,.admin-sub-link.active){background:var(--purple-soft);color:var(--purple-dark);box-shadow:inset 0 0 0 1px rgba(187,163,239,.18)}
html[data-theme=dark] :is(.side-link,.admin-nav,.main-nav a):hover{color:var(--ink);background:var(--theme-surface)}
html[data-theme=dark] :is(.side-caption,.section-kicker,.admin-menu-chevron,.time-chip-date,.clock-line>small,.hero-text,.hero-note,.feature-card p,.step-card p,.stats-copy>p,.review-card p,.faq-list details p,.site-footer p,.site-footer nav,.dash-footer,.empty-list,.chart-note,.task-meta,.habit-label small,.habit-label-copy small,.week-day-name,.calendar-day-name,.calendar-legend,.managed-habit-copy p,.time-progress-stack .time-progress-label span,.daily-quote-sender small,.daily-quote-prompt,.mini-kicker,.preview-block-title small,.preview-row small,.preview-date){color:var(--muted)}
html[data-theme=dark] :is(.dash-header .daily-quote,.preview-window,.review-card blockquote,.faq-list summary){color:var(--ink)}
html[data-theme=dark] :is(.task-item,.habit-item,.managed-habit-actions,.support-row,.profile-mini,.admin-topbar,.topbar,.site-footer,.admin-user-table th,.admin-user-table td){border-color:var(--line)}
html[data-theme=dark] :is(.task-check,.habit-check){border-color:#8b94ab;background:transparent}
html[data-theme=dark] .task-check.done{background:var(--green);border-color:var(--green);color:#172d25}
html[data-theme=dark] :is(.habit-check.done,.habit-check.quantity-check.done,.habit-quantity-step.is-increment.done){background:var(--purple);border-color:var(--purple);color:#231935;box-shadow:none}
html[data-theme=dark] :is(.task-item.completed>span:nth-child(2),.preview-row.done){color:var(--muted)}
html[data-theme=dark] :is(.time-chip,.brand-mark,.icon-button,.calendar-controls button,.calendar-select-wrap,.task-date-trigger,.mini-date-picker-head button,.habit-icon-option,.habit-quantity-step,.dialog-close,.time-picker-actions button,.managed-habit-actions button,.admin-quote-actions button){background:var(--theme-surface);border-color:var(--line);box-shadow:var(--shadow-inset)}
html[data-theme=dark] :is(.calendar-select-button,.calendar-select-wrap select,.calendar-controls .view-select){color:var(--ink)}
html[data-theme=dark] :is(.calendar-select-button:hover,.calendar-select-button[aria-expanded=true],.calendar-option:hover,.calendar-option[aria-selected=true],.time-wheel-option:hover,.time-wheel-option.is-selected){background:var(--theme-hover);color:var(--purple-dark);box-shadow:none}
html[data-theme=dark] :is(.calendar-day:hover,.calendar-day.selected:not(.official-holiday)){background:var(--theme-surface);color:var(--ink);box-shadow:inset 0 0 0 1px #8e79b7}
html[data-theme=dark] .calendar-day{color:var(--ink)}
html[data-theme=dark] .calendar-day.outside{color:var(--muted)}
html[data-theme=dark] :is(.calendar-day.official-holiday,.mini-calendar-day.official-holiday){background:#3c2933;color:#f3b3b6}
html[data-theme=dark] :is(.calendar-day.official-holiday.selected,.mini-calendar-day.official-holiday.selected){background:#4a303e;color:#ffd0d2;box-shadow:inset 0 0 0 1px #bd7e87}
html[data-theme=dark] :is(.calendar-day.official-holiday .week-day-name,.calendar-day.official-holiday .day-number,.calendar-day.official-holiday.selected .week-day-name,.calendar-day.official-holiday.selected .day-number){color:inherit}
html[data-theme=dark] :is(.calendar-holiday-note,.holiday-note-item,.mini-holiday-note,.demo-warning,.auth-local-note){background:#332731;color:#f0b4bd;border-color:#68434e}
html[data-theme=dark] .calendar-holiday-note:empty{display:none}
html[data-theme=dark] :is(.green-track,.task-progress-line,.calendar-day.selected:not(.official-holiday) .task-progress-line){background:#30473e}
html[data-theme=dark] :is(.purple-track,.habit-progress-line,.habit-quantity-track,.calendar-day.selected:not(.official-holiday) .habit-progress-line,.time-progress-track){background:var(--theme-track);box-shadow:none}
html[data-theme=dark] .calendar-legend .task-line{background:linear-gradient(to left,var(--green) 55%,#30473e 55%)}
html[data-theme=dark] .calendar-legend .habit-line{background:linear-gradient(to left,var(--purple) 55%,var(--theme-track) 55%)}
html[data-theme=dark] .time-progress-track i{background:linear-gradient(to left,#d4c3ff,var(--purple))}
html[data-theme=dark] .month-completion-ring{background:conic-gradient(var(--green) 0 var(--task-share),var(--purple) var(--task-share) var(--complete-share),var(--theme-track) var(--complete-share) 100%)}
html[data-theme=dark] .month-completion-ring::before{background:var(--card);box-shadow:none}
html[data-theme=dark] .month-completion-ring::after{opacity:.3}
html[data-theme=dark] :is(.daily-quote-wrap,.month-completion-card){background:linear-gradient(135deg,#292735,#22252f);border-color:#494158;box-shadow:var(--shadow-soft)}
html[data-theme=dark] .daily-quote-wrap::before{background:#292735;border-color:#494158}
html[data-theme=dark] :is(.daily-quote-avatar,.weekly-reflection,.reflection-icon,.managed-habit-schedule,.habit-layout-picker,.avatar,.admin-privacy,.admin-badge,.admin-pills span,.demo-tag){background:var(--purple-soft);color:var(--purple-dark);box-shadow:none;border-color:var(--line)}
html[data-theme=dark] .daily-quote-author{border-color:var(--line)}
html[data-theme=dark] :is(.habit-layout-picker button[aria-pressed=true],.range-filters button.selected){background:var(--theme-raised);color:var(--purple-dark);box-shadow:none}
html[data-theme=dark] :is(.range-filters,.time-wheel-list,.admin-data-note,.admin-quote-card,.priority-choice>span,.reminder-toggle){background:var(--theme-surface);color:var(--muted);box-shadow:none}
html[data-theme=dark] .range-filters button{color:var(--muted)}
html[data-theme=dark] .admin-quote-card.is-disabled{opacity:1;border:1px dashed var(--line)}
html[data-theme=dark] :is(.habit-delete-button,.admin-quote-actions button.danger-action){color:var(--theme-danger)}
html[data-theme=dark] :is(.auth-card input,.quick-dialog input,.quick-dialog select,.quick-dialog textarea,.quote-form input:not([type=checkbox]),.quote-form textarea,.reminder-dialog input[type=time],.task-field input,.time-manual-entry input#quickTimeTyped){background:#1b1e28;color:var(--ink);border-color:#7a8297;box-shadow:none;accent-color:var(--purple)}
html[data-theme=dark] input::placeholder,html[data-theme=dark] textarea::placeholder{color:var(--muted);opacity:1}
html[data-theme=dark] :is(.quick-dialog.task-dialog input:focus,.quick-dialog.task-dialog select:focus){outline:2px solid var(--green);outline-offset:2px;box-shadow:none}
html[data-theme=dark] .button-primary{background:var(--theme-button);color:var(--theme-on-button);box-shadow:0 4px 14px rgba(0,0,0,.22)}
html[data-theme=dark] .button-primary:hover{background:#d0baff}
html[data-theme=dark] :is(.quick-dialog.task-dialog .button-primary,#quickTimeDone){background:var(--green);color:#172d25;box-shadow:none}
html[data-theme=dark] .quick-dialog.task-dialog .button-primary:hover{background:var(--green-dark)}
html[data-theme=dark] .button-outline{color:var(--ink);border-color:#80899e}
html[data-theme=dark] :is(.green-add,.green-pill){background:var(--green-soft);color:var(--green-dark)}
html[data-theme=dark] :is(.purple-add,.purple-pill,.habit-icon-option.selected){background:var(--purple-soft);color:var(--purple-dark);border-color:var(--purple);box-shadow:none}
html[data-theme=dark] .habit-icon-field{border-color:var(--line)}
html[data-theme=dark] .line-chart-gridline{stroke:#42495b}
html[data-theme=dark] :is(.line-chart-y-label,.line-chart-x-label){fill:var(--muted)}
html[data-theme=dark] .mini-chart:not(.line-chart){border-color:var(--line);background:repeating-linear-gradient(to bottom,transparent 0,transparent 21px,#3a4254 22px)}
html[data-theme=dark] .line-chart-tooltip{border-color:#7a8297;background:var(--theme-raised);color:var(--ink);box-shadow:var(--shadow-soft)}
html[data-theme=dark] .quick-dialog::backdrop{background:rgba(4,6,12,.72)}
html[data-theme=dark] .toast{background:var(--ink);color:var(--paper);box-shadow:var(--shadow-soft)}
html[data-theme=dark] :focus-visible{outline:3px solid var(--theme-focus);outline-offset:3px}
html[data-theme=dark] .brand-logo-word{filter:brightness(1.9) saturate(.6)}
html[data-theme=dark] .brand-mark-tile{background:var(--theme-surface);box-shadow:var(--shadow-soft)}
html[data-theme=dark] :is(.preview-window,.preview-block,.feature-card,.steps-section,.step-card,.stats-card,.review-card,.faq-list details,.final-cta,.calendar-time-progress.showcase-time-progress){background:var(--card);color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-soft)}
html[data-theme=dark] .hero-art::before,html[data-theme=dark] .cta-orb{background:radial-gradient(circle,rgba(187,163,239,.16),transparent 70%)}
html[data-theme=dark] .menu-toggle span{background:var(--ink)}
html[data-theme=dark] :is(.priority-choice input:checked+span,.quick-dialog.task-dialog .priority-choice-medium input:checked+span){background:var(--green-soft);color:var(--green-dark);box-shadow:inset 0 0 0 1px var(--green)}
html[data-theme=dark] :is(.task-date-trigger,.calendar-controls button,.mini-date-picker-head button):hover{background:var(--theme-hover);box-shadow:var(--shadow-inset)}
@media(forced-colors:active){.theme-toggle{border:1px solid ButtonText;box-shadow:none}.theme-toggle-switch{outline:1px solid ButtonText}.theme-toggle[aria-pressed=true]{outline:2px solid Highlight}}

/* Completed, hovered and compact states need the same semantic palette. */
html[data-theme=dark] :is(.habits-card .habit-item.completed,.habits-card .habit-item.completed:hover){background:#302c43;box-shadow:none}
html[data-theme=dark] :is(.tasks-card .task-item:hover,.habits-card .habit-item:hover,.preview-row:hover,.habit-mini:hover){background:var(--theme-hover);box-shadow:none}
html[data-theme=dark] :is(.habit-item.completed .habit-label-copy b,.preview-row.done .preview-label b){color:var(--purple-dark);text-decoration-color:currentColor}
html[data-theme=dark] :is(.task-check,.habit-check,.add-row,.sidebar-icon-tile){box-shadow:none}
html[data-theme=dark] .add-row{border:1px solid #727b92;background:var(--theme-surface)}
html[data-theme=dark] .add-row:hover{background:var(--theme-hover);box-shadow:none}
html[data-theme=dark] .green-completion{color:var(--green-dark)}
html[data-theme=dark] .purple-completion{color:var(--purple-dark)}
html[data-theme=dark] .holiday-note-heading{color:#f0b4bd}
html[data-theme=dark] .brand-logo-frame .brand-logo-word{filter:brightness(2.7) saturate(.55)!important;opacity:1}
html[data-theme=dark] :is(.selected-day,.preview-row.done .check){color:#231935;box-shadow:none}
html[data-theme=dark] .preview-row.done{background:var(--green-soft)}
html[data-theme=dark] :is(.floating-note,.intro-strip,.calendar-illustration,.stats-demo,.mobile-bottom-cta){background:var(--theme-surface);box-shadow:var(--shadow-soft)}
html[data-theme=dark] :is(.preview-footer,.preview-label small,.feature-number,.chart-legend,.chart-y,.chart-x,.final-cta>small){color:var(--muted)}
html[data-theme=dark] .task-illustration span{background:var(--green-soft)}
html[data-theme=dark] .type-icon{background:var(--theme-surface);box-shadow:none}
html[data-theme=dark] :is(.reminder-options,.reminder-scope){background:var(--theme-surface)}
html[data-theme=dark] :is(.habit-mini.done,.habit-mini.done:hover){background:#302c43}
html[data-theme=dark] .habit-mini.done .habit-check-mark{color:#231935}
html[data-theme=dark] :is(.preview-interaction-hint,.preview-window:hover .preview-interaction-hint,.preview-window:has(:focus-visible) .preview-interaction-hint){background:var(--purple-soft);color:var(--purple-dark);box-shadow:none}
html[data-theme=dark] .preview-interaction-hint svg{fill:var(--purple-soft)}
html[data-theme=dark] .strip-icon{background:var(--theme-raised)}
html[data-theme=dark] .habit-progress{background:var(--theme-track)}
html[data-theme=dark] :is(.task-item,.habit-item,.preview-row,.habit-mini,.preview-interaction-hint)::after{background-image:linear-gradient(108deg,transparent 33%,rgba(187,163,239,.12) 49%,transparent 65%)}
html[data-theme=dark] .app-sidebar button.side-link:hover{background:var(--theme-hover)}
@media(max-width:680px){
  .dash-title-line .dashboard-time-chip{min-width:0}
  .dash-title-line .theme-toggle{padding-inline:10px}
  .app-sidebar{gap:2px;padding-inline:6px;align-items:stretch}
  .app-sidebar>.side-link,.app-sidebar>button.side-link,.app-sidebar>.admin-menu{flex:1 1 0;min-width:0;width:auto}
  .app-sidebar .side-link,.app-sidebar button.side-link{min-height:52px;padding:6px 2px;font-size:8px;line-height:1.5;justify-content:center;text-align:center;gap:3px}
  .app-sidebar .side-link>span{font-size:16px}
  .app-sidebar .type-icon{width:22px;height:22px;flex-basis:22px;border-radius:7px}
  .app-sidebar .type-icon svg{width:16px;height:16px}
  .app-sidebar .admin-menu{position:relative;margin:0}
  .app-sidebar .admin-menu-toggle>span:nth-child(2){flex:0 0 auto;font-size:8px}
  .app-sidebar .admin-menu-chevron{display:none}
  .app-sidebar .admin-submenu{position:absolute;bottom:calc(100% + 14px);left:0;width:160px;margin:0;padding:6px;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:var(--shadow-soft)}
  .app-sidebar .admin-sub-link{min-height:44px;padding:8px;font-size:11px}
}
@media(max-width:340px){body{min-width:0}}
html[data-theme=dark] .toast-action{background:rgba(0,0,0,.08);color:var(--purple-dark)}
html[data-theme=dark] .task-tool:hover{background:rgba(255,255,255,.08)}