html{color-scheme:light}
.auth-theme-row{display:flex;justify-content:flex-end;margin:-8px 0 8px}.theme-toggle{font-size:.75rem;padding:8px 12px;min-height:44px;background:#eeebfc;color:#5e49c7}.data-menu-panel [data-theme-toggle]{min-height:44px}
/* Let account text shrink before it can push the two controls off-screen. */
.account-bar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;width:100%;min-width:0}
.account-meta,.account-meta>div{min-width:0;max-width:100%}.account-meta strong{width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-meta small{overflow-wrap:anywhere}
.sound-toggle{box-sizing:border-box;width:76px;max-width:76px;min-width:76px;min-height:44px;gap:5px;padding:7px;font-size:21px;line-height:1;transform:none}.sound-toggle span{display:block;font-size:11px;max-width:none;width:35px;line-height:1.2;white-space:normal;overflow-wrap:normal}.sound-toggle:hover,.sound-toggle:active{transform:none}
.data-menu{min-width:0}.data-menu summary{min-height:44px;padding:8px;font-size:12px}.data-menu-panel{width:min(250px,calc(100vw - 32px))}
.top-actions button,.modal-close,.practice-head button,.auth-tabs button{min-height:44px}
@media(max-width:350px){.account-bar{gap:5px}.account-meta{gap:5px}.sound-toggle{width:68px;min-width:68px;max-width:68px;padding:5px;gap:3px}.account-meta strong{font-size:11px}.account-meta small{font-size:10px}.data-menu summary{padding:6px;font-size:11px}.auth-card label{line-height:1.5}}
html[data-theme=dark]{color-scheme:dark;--ink:#f2edf9;--muted:#bbb2ce;--line:#393348;--purple:#a18aef;--card:#211d2e;--bg:#15121f}
html[data-theme=dark] body,html[data-theme=dark] body.account-locked{background:#15121f;color:#f2edf9}
html[data-theme=dark] .panel,html[data-theme=dark] .auth-card,html[data-theme=dark] .top-actions,html[data-theme=dark] .journey-stats>div,html[data-theme=dark] .modal,html[data-theme=dark] .data-menu-panel{background:#211d2e;border-color:#393348;color:#f2edf9}
html[data-theme=dark] .brand h1,html[data-theme=dark] .auth-brand strong,html[data-theme=dark] .question{color:#f2edf9}
html[data-theme=dark] .brand p,html[data-theme=dark] .auth-brand p,html[data-theme=dark] .auth-card>p,html[data-theme=dark] .auth-note,html[data-theme=dark] .auth-card small,html[data-theme=dark] .muted,html[data-theme=dark] .small,html[data-theme=dark] .subtext,html[data-theme=dark] .profile-pill small,html[data-theme=dark] .journey-stats small,html[data-theme=dark] .data-menu-panel p,html[data-theme=dark] .stat span,html[data-theme=dark] #hint,html[data-theme=dark] .question-label,html[data-theme=dark] .foot{color:#bbb2ce}
html[data-theme=dark] .section-eyebrow{color:#c4aff3}html[data-theme=dark] .account-meta small{color:#91d6b4}html[data-theme=dark] .account-meta .sync-error{color:#ffb4b4}
html[data-theme=dark] .soft,html[data-theme=dark] .auth-tabs{background:#302a40;color:#d5cce6}html[data-theme=dark] .secondary,html[data-theme=dark] .theme-toggle,html[data-theme=dark] .profile-avatar,html[data-theme=dark] .sound-toggle,html[data-theme=dark] .data-menu[open] summary{background:#3c3054;color:#dccbff}
html[data-theme=dark] .primary,html[data-theme=dark] .auth-card .primary,html[data-theme=dark] .auth-tabs button[aria-selected=true]{background:#7458d5;color:#fff;box-shadow:0 4px 0 #49338e}
html[data-theme=dark] .auth-tabs button{color:#c7bed8}html[data-theme=dark] .danger{background:#482a37;color:#ffb4bd}html[data-theme=dark] .data-menu summary{color:#d5cce6}html[data-theme=dark] .sound-toggle[aria-pressed=true]{background:#244338;color:#a3e4c3}
html[data-theme=dark] .auth-card input,html[data-theme=dark] .modal input,html[data-theme=dark] .modal select,html[data-theme=dark] .answer-row input{background:#191623;border-color:#5b4a78;color:#f2edf9}
html[data-theme=dark] input::placeholder{color:#a99ebd}html[data-theme=dark] input:focus{outline-color:#58417e;border-color:#b99af2}html[data-theme=dark] .password-field button{color:#d0b5ff}html[data-theme=dark] .auth-card .auth-error,html[data-theme=dark] #profileError{color:#ffb4bd}
html[data-theme=dark] .hero{background:#4b368d}html[data-theme=dark] .hero p{color:#e6ddfa}
html[data-theme=dark] .material:nth-child(1){--mat-bg:#3e2733;--mat-border:#684151;--mat-ink:#ff9cad;--arrow-bg:#5a3343;background:var(--mat-bg);border-color:var(--mat-border)}
html[data-theme=dark] .material:nth-child(2){--mat-bg:#3a3220;--mat-border:#655735;--mat-ink:#ffdb7b;--arrow-bg:#51452b;background:var(--mat-bg);border-color:var(--mat-border)}
html[data-theme=dark] .material:nth-child(3){--mat-bg:#243248;--mat-border:#3b5578;--mat-ink:#92c6ff;--arrow-bg:#314765;background:var(--mat-bg);border-color:var(--mat-border)}
html[data-theme=dark] .material:nth-child(4){--mat-bg:#243a30;--mat-border:#3c624e;--mat-ink:#9ae2ab;--arrow-bg:#31503e;background:var(--mat-bg);border-color:var(--mat-border)}
html[data-theme=dark] .material:nth-child(5){--mat-bg:#352943;--mat-border:#59416e;--mat-ink:#d0a2ff;--arrow-bg:#49345d;background:var(--mat-bg);border-color:var(--mat-border)}
html[data-theme=dark] .material strong{color:#f5eefb}html[data-theme=dark] .material span.material-desc{color:#cdc3d6}
html[data-theme=dark] .level,html[data-theme=dark] .round{background:#30283f;color:#eee4ff;border-color:#55426d}html[data-theme=dark] .level.locked,html[data-theme=dark] .round:disabled{background:#262330;color:#b7afc6;border-color:#383241;opacity:.7}html[data-theme=dark] .level.complete,html[data-theme=dark] .round.done{background:#254236;color:#b1e7c8;border-color:#3b6953}
html[data-theme=dark] .badge{background:#3c3054;color:#dccbff}html[data-theme=dark] .stat{background:#2d263b}html[data-theme=dark] .stat strong{color:#d3baff}html[data-theme=dark] .question-box{background:transparent}html[data-theme=dark] .progress-track{background:#393047}html[data-theme=dark] .progress-fill{background:#ac8ef3}
html[data-theme=dark] .feedback.good{background:#244638;color:#a1e9bd}html[data-theme=dark] .feedback.bad{background:#473b24;color:#f5d28b}html[data-theme=dark] .app[data-view=summaryPanel] #summaryPanel{background:linear-gradient(180deg,#3a3027,#211d2e 190px)}
html[data-theme=dark] #recordsPanel .empty{background:#252030;border-color:#4b3f5c;color:#c9bfd8}html[data-theme=dark] .record-table th,html[data-theme=dark] .record-table td{color:#e5dced;border-color:#43384f;background:transparent}html[data-theme=dark] .record-table th{background:#30283e}html[data-theme=dark] .toast{background:#eee5ff;color:#302243}html[data-theme=dark] .modal-backdrop{background:#070510b8}