/* Steadybar workbench. Tokens → primitives → tasks → responsive transforms.
   No remote fonts, decorative animation, filter effects or runtime CSS dependency. */
:root {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  font-size:15px;line-height:1.5;color:var(--text);background:var(--bg);color-scheme:light;
  --bg:#f5f4ef;--surface:#fffefa;--surface-soft:#eeeee7;--surface-hover:#e7e8df;
  --text:#262c26;--muted:#62685f;--faint:#676e64;--border:#d7dbd0;--border-strong:#838b7e;
  --accent:#343b34;--accent-hover:#232b23;--accent-text:#343b34;--accent-soft:#e5e9e1;--on-accent:#ffffff;--focus:#4c6350;
  --danger:#a02d3e;--danger-bg:#faeaed;--warning:#835211;--chart-ink:var(--accent-text);
  --brand-bg:var(--text);--brand-ink:var(--surface);--radius:6px;--shadow:0 12px 40px #19211924;--mono:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;
}
:root[data-theme=dark] {
  color-scheme:dark;--bg:#171a17;--surface:#20241f;--surface-soft:#292f27;--surface-hover:#343c31;
  --text:#ebeee6;--muted:#adb5a7;--faint:#a2ad9d;--border:#3e473b;--border-strong:#7d8b76;
  --accent:#c9d3c5;--accent-hover:#e1e9dc;--accent-text:#c9d3c5;--accent-soft:#2d382b;--on-accent:#192119;--focus:#b4cfa8;
  --danger:#ffa6b2;--danger-bg:#40262c;--warning:#e7bc76;--shadow:0 12px 40px #0006;
}
:root[data-accent=blue] {--accent:#2a5ba7;--accent-hover:#214982;--accent-text:#234e92;--accent-soft:#e7eef9;--focus:#2a5ba7}
:root[data-accent=forest] {--accent:#24654a;--accent-hover:#1d503a;--accent-text:#20583f;--accent-soft:#e5f0e7;--focus:#24654a}
:root[data-accent=plum] {--accent:#794799;--accent-hover:#62357d;--accent-text:#6f3b8d;--accent-soft:#f0e9f4;--focus:#794799}
:root[data-accent=amber] {--accent:#8b5818;--accent-hover:#6e4311;--accent-text:#7b4b12;--accent-soft:#f7eddc;--focus:#8b5818}
:root[data-accent=rose] {--accent:#a33e55;--accent-hover:#853046;--accent-text:#96364c;--accent-soft:#f7e7ec;--focus:#a33e55}
:root[data-theme=dark][data-accent=blue] {--accent:#99b9ed;--accent-hover:#c2d5f5;--accent-text:#99b9ed;--accent-soft:#26334a;--focus:#b4cdf7}
:root[data-theme=dark][data-accent=forest] {--accent:#8ccca7;--accent-hover:#bae0ca;--accent-text:#8ccca7;--accent-soft:#253c2f;--focus:#ace4bd}
:root[data-theme=dark][data-accent=plum] {--accent:#d5aae9;--accent-hover:#e6caf2;--accent-text:#d5aae9;--accent-soft:#3b2c46;--focus:#e2bdf2}
:root[data-theme=dark][data-accent=amber] {--accent:#e7bc76;--accent-hover:#f2d5a6;--accent-text:#e7bc76;--accent-soft:#3e3425;--focus:#f3d097}
:root[data-theme=dark][data-accent=rose] {--accent:#efa1b3;--accent-hover:#f5c6d1;--accent-text:#efa1b3;--accent-soft:#422c35;--focus:#ffc0cf}
* {box-sizing:border-box}
body {margin:0;min-width:320px}
button,input,select,textarea {font:inherit;color:inherit}
a,button,input,select,textarea { -webkit-tap-highlight-color:transparent }
a,button {touch-action:manipulation}
a {color:inherit;text-decoration:none}
a:hover {color:var(--accent-text)}
button {cursor:pointer}button:disabled {cursor:not-allowed;opacity:.45}
h1,h2,h3,p,figure {margin:0}h1,h2,h3 {font-weight:600;line-height:1.3}
h1 {font-size:28px;letter-spacing:-.7px}h2 {font-size:17px;letter-spacing:-.2px}h3 {font-size:15px}
p,h1,h2,h3,strong,a {overflow-wrap:anywhere}
svg {flex-shrink:0;vertical-align:middle}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible {outline:2px solid var(--focus);outline-offset:3px}
[hidden] {display:none!important}
.main-content:focus,.active-main:focus {outline:none}
.skip-link {position:fixed;left:12px;top:-80px;z-index:200;background:var(--text);color:var(--surface);padding:10px 16px;border-radius:4px}
.skip-link:focus {top:12px}
::selection {background:var(--accent-soft);color:var(--accent-text)}
/* Shell. The page heading is the heading; desktop has no duplicated breadcrumb bar. */
.app-shell {display:grid;grid-template-columns:204px minmax(0,1fr);min-height:100dvh}
.sidebar {position:sticky;top:0;height:100dvh;padding:28px 16px 16px;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:20px;overflow-y:auto;overscroll-behavior:contain}
.brand,.mobile-brand {display:flex;align-items:center;gap:10px;flex-shrink:0}
.brand {padding:0 10px;font-size:19px;letter-spacing:-.6px}
.brand>svg,.mobile-brand>svg {width:24px;height:24px;color:var(--text)}
.sidebar-nav {display:flex;flex-direction:column;gap:2px}
.nav-group-label {font-size:11px;font-weight:500;color:var(--faint);padding:20px 12px 5px}
.nav-group-label:first-child {padding-top:0}
.nav-link {display:flex;align-items:center;gap:10px;padding:9px 12px;min-height:40px;color:var(--muted);font-size:13px;border-radius:4px;position:relative}
.nav-link>svg {width:17px;height:17px}
.nav-link:hover {background:var(--surface-hover);color:var(--text)}
.nav-link.active {background:var(--accent-soft);color:var(--accent-text);font-weight:600}
.nav-link.active::before {content:"";position:absolute;left:0;top:11px;bottom:11px;width:2px;background:var(--accent)}
.settings-nav {margin-top:18px;border-top:1px solid var(--border);border-radius:0;padding-top:14px}
.sidebar-footer {margin-top:auto;border-top:1px solid var(--border);padding-top:12px}
.sidebar-footer>.button {width:100%;justify-content:flex-start;font-size:12px;color:var(--muted)}
.app-body {min-width:0}.topbar,.mobile-nav {display:none}
.main-content {width:100%;max-width:1380px;margin:0 auto;padding:44px clamp(24px,3.1vw,56px) 64px}
.page {min-width:0;width:100%}
.page-heading {display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:32px}
.page-heading-text {min-width:0}.page-heading p {font-size:13px;margin-top:7px;color:var(--muted);max-width:64ch}
.page-heading>.actions {padding-top:2px;justify-content:flex-end;flex-shrink:0;flex-wrap:wrap}
.eyebrow {font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px}
.page-footer {display:flex;gap:12px;justify-content:flex-end;padding:24px 0 0}
.back-link {display:inline-flex;align-items:center;font-size:13px;color:var(--muted);gap:8px;margin-bottom:20px}
.back-link::before {content:"←"}
/* Small set of controls and semantic surfaces. */
.actions {display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.button {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:8px 13px;border:1px solid transparent;border-radius:4px;background:transparent;font-size:13px;font-weight:500;line-height:1.4;text-align:center;transition:background-color 100ms,border-color 100ms}
.button>svg {width:17px;height:17px}
.button.primary {background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.button.primary:hover {background:var(--accent-hover);border-color:var(--accent-hover)}
.button.secondary {background:var(--surface);border-color:var(--border-strong);color:var(--text)}
.button.secondary:hover {background:var(--surface-hover)}
.button.ghost:hover,.button:not(.primary):not(.secondary):not(.danger):hover {background:var(--surface-hover)}
.button.danger {color:var(--danger);background:var(--danger-bg);border-color:var(--danger)}
.button.compact {padding:6px 10px;min-height:32px;font-size:12px}
.icon-button,.button.icon-button {display:inline-flex;justify-content:center;align-items:center;width:36px;height:36px;min-height:36px;padding:6px;flex-shrink:0;border:1px solid transparent;background:transparent;border-radius:4px;color:var(--muted)}
.icon-button:hover {background:var(--surface-hover);color:var(--text)}
.text-link {display:inline-flex;gap:7px;align-items:center;font-size:13px;color:var(--accent-text);text-underline-offset:3px}
.text-link:hover {text-decoration:underline}
.search-trigger {background:transparent;border-color:var(--border);color:var(--muted);justify-content:flex-start;min-height:34px;padding:6px 9px}
.search-trigger kbd {margin-left:auto;font-size:10px}
kbd {font-family:var(--mono);font-size:11px;border:1px solid var(--border);padding:2px 5px;border-radius:3px;color:var(--muted);background:var(--surface-soft);white-space:nowrap}
.panel {min-width:0;padding:20px 0;border-top:1px solid var(--border);margin-bottom:24px}
.section-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.section-title {display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;min-width:0}
.section-title h2 {font-size:15px;font-weight:600}.section-title>.small {font-size:12px}
.panel>p+p {margin-top:12px}.panel>.actions {margin-top:20px}
.label {display:block;font-size:12px;font-weight:500;color:var(--muted)}
.muted {color:var(--muted)}.small,.tiny {font-size:12px}.pre-line {white-space:pre-line}
.sticking {font-family:var(--mono);letter-spacing:.05em;font-weight:500}
.truncate {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:240px}
.line-clamp {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.split {display:flex;align-items:center;justify-content:space-between;gap:12px}.wrap {flex-wrap:wrap}
.badge {display:inline-flex;align-items:center;color:var(--muted);font-size:11px;line-height:1.5;white-space:normal}
.badge.accent {color:var(--accent-text);font-weight:600}
.tag-row,.attempt-tags {display:flex;gap:6px 12px;flex-wrap:wrap}.tag-row {margin-top:12px}
.empty-state {padding:28px 0;display:flex;align-items:flex-start;flex-direction:column;gap:10px}
.empty-state h3 {font-size:16px}.empty-state p {max-width:58ch;color:var(--muted);font-size:13px}.empty-state>.button,.empty-state>.actions {margin-top:8px}
.two-column {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}
.two-column.wide-left {grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.stats-strip {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--border);padding:20px 0;margin-bottom:28px}
.stat {min-width:0;display:flex;flex-direction:column;padding:0 24px;border-right:1px solid var(--border);gap:4px}.stat:first-child {padding-left:0}.stat:last-child {border:0}
.stat-value {font-size:28px;line-height:1.25;letter-spacing:-.7px;font-variant-numeric:tabular-nums;font-weight:550}
.progress-track {height:3px;background:var(--border);overflow:hidden;width:100%;border-radius:0}
.progress-fill {height:100%;background:var(--accent)}
/* Today: agenda first, supporting material in the margin. */
.today-grid {display:grid;grid-template-columns:minmax(0,2.6fr) minmax(210px,1fr);gap:32px;align-items:start}
.plan-panel {container-type:inline-size;border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);padding:0;overflow:visible}
.plan-panel>.section-heading {padding:20px 22px 16px;margin:0;border-bottom:1px solid var(--border);align-items:center}
.plan-panel>.section-heading .section-title {display:block}.plan-panel>.section-heading .section-title>.small {display:block;margin-top:4px}
.plan-panel>.empty-state {padding:32px 24px}
.plan-footer {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;border-top:1px solid var(--border);flex-wrap:wrap}
.block-list {container-type:inline-size}
.plan-columns {display:flex;justify-content:space-between;padding:10px 106px 8px 60px;font-size:10px;color:var(--faint)}
.block-row {display:grid;grid-template-columns:24px minmax(0,1fr) 122px var(--block-action-width,76px);gap:14px;align-items:center;padding:16px 20px;border-top:1px solid var(--border)}
.block-index {color:var(--faint);font-family:var(--mono);font-size:11px;display:flex;flex-direction:column;align-items:center;gap:5px}
.drag-handle {display:inline-flex;cursor:grab}.block-row.dragging {opacity:.45}
.block-title {min-width:0}.block-title>strong {display:block;font-size:14px;font-weight:550;line-height:1.4}
.block-subtitle {display:flex;gap:6px 10px;flex-wrap:wrap;margin-top:3px;font-size:11px}.block-subtitle:empty {display:none}
.block-cue {color:var(--muted);font-size:12px;margin-top:6px;white-space:normal}
.block-numbers {display:flex;align-items:center;gap:12px;justify-content:flex-end}
.block-numbers>label {display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;color:var(--muted)}
.inline-number {border:1px solid transparent;border-radius:3px;width:54px;min-width:0!important;height:32px;min-height:32px!important;text-align:center;padding:4px!important;border-color:transparent!important;background:var(--surface-soft)!important;font-family:var(--mono);font-size:13px!important}
.inline-number:hover,.inline-number:focus {border-color:var(--border-strong)!important}
.block-actions {display:flex;gap:4px;justify-content:flex-end}
.block-add {padding:8px 16px}.block-add>.button {width:100%;justify-content:flex-start;color:var(--muted);font-weight:400}
.today-side {min-width:0}.today-side>.panel {margin-bottom:20px}
.suggestion-row {display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 0;border-bottom:1px solid var(--border)}
.suggestion-row:last-child {border:0}.suggestion-row>div {display:flex;flex-direction:column;gap:3px;min-width:0}
.suggestion-row .text-link {color:var(--text);font-weight:500}
.week-summary {border-top:1px solid var(--border);padding-top:18px;display:flex;flex-direction:column;gap:6px}
.week-time {display:flex;gap:8px;align-items:baseline;font-family:var(--mono);font-size:26px;letter-spacing:-1px}
.today-overview {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;margin-top:10px}
.overview-panel {padding-top:18px;border-top:1px solid var(--border)}
.goal-summary {padding:10px 0}.goal-summary .progress-track {margin-top:8px}
.recent-row {display:block;min-height:44px;padding:12px 0;border-bottom:1px solid var(--border);font-size:13px;color:var(--text)}
.recent-row:last-child {border:0}
.history-link,.routine-summary {display:flex;justify-content:space-between;gap:10px;padding:12px 0}
/* Collections: aligned, searchable, bounded rendering. */
.library-toolbar,.filter-line {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.search-field {min-width:180px;flex:1}.library-toolbar select {width:auto;max-width:190px}
.filter-line {font-size:12px;justify-content:space-between}
.segmented {display:inline-flex;padding:2px;border:1px solid var(--border);border-radius:4px;gap:2px}
.button.segmented-button {min-height:30px;font-size:12px;padding:5px 10px}
.segmented .button[aria-pressed=true],.segmented .button.active,.segmented .button.selected {background:var(--surface);box-shadow:0 1px 2px #0001;color:var(--accent-text)}
.exercise-list,.routine-collection,.song-collection,.history-list {border-top:1px solid var(--border)}
.exercise-card {min-width:0;background:transparent}
.exercise-list .exercise-card {display:grid;grid-template-columns:150px minmax(0,1fr) 148px;align-items:center;gap:2px 20px;padding:16px 12px;border-bottom:1px solid var(--border)}
.exercise-list .exercise-card:hover,.song-row:hover,.routine-row:hover,.history-card:hover {background:var(--surface-soft)}
.exercise-card-top {display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.exercise-list .exercise-card-top {grid-column:1;grid-row:1 / 3;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px}
.exercise-list .exercise-card>h2 {grid-column:2;grid-row:1}
.exercise-list .exercise-card>p {grid-column:2;grid-row:2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.exercise-list .exercise-card-bottom {grid-column:3;grid-row:1 / 3}
.exercise-card h2 {font-size:14px;line-height:1.5;letter-spacing:0}.exercise-card h2 a {font-size:14px;color:var(--text);font-weight:550}
.exercise-card .small-sticking,.exercise-description {margin-top:5px;color:var(--muted);font-size:12px}
.exercise-card-bottom {display:flex;align-items:center;justify-content:space-between;gap:12px}
.exercise-card-bottom>div {display:flex;flex-direction:column;gap:3px}
.exercise-card-bottom strong {font-family:var(--mono);font-size:15px;font-weight:500;font-variant-numeric:tabular-nums}
.exercise-card-bottom>.button {min-width:36px;flex-shrink:0}
.exercise-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px;border-top:1px solid var(--border)}
.exercise-grid .exercise-card {padding:20px 0;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:16px}
.exercise-grid .exercise-card-bottom {margin-top:auto}
.show-more {margin:20px auto;display:flex}
.routine-card {border-bottom:1px solid var(--border);min-width:0}
.routine-row {display:flex;align-items:center;gap:20px;padding:20px 12px 12px}
.routine-identity {min-width:0;flex:1}.routine-identity h2 a {font-size:16px;color:var(--text)}
.routine-identity p {font-size:12px;margin-top:4px}.routine-schedule {display:block;font-size:11px;color:var(--muted);margin-top:5px}
.routine-duration {font-family:var(--mono);font-size:17px;font-weight:500;white-space:nowrap}
.routine-disclosure {padding:0 12px 12px}.routine-disclosure summary {font-size:12px;color:var(--muted);padding:8px 0;cursor:pointer}
.routine-preview {list-style:none;padding:0 0 0 12px;margin:8px 0 14px;border-left:2px solid var(--border);max-width:600px}
.routine-preview li {display:flex;align-items:baseline;justify-content:space-between;gap:16px;font-size:12px;padding:6px 0}
.song-row {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) 90px auto;align-items:center;gap:20px;padding:18px 12px;border-bottom:1px solid var(--border)}
.repertoire-identity {min-width:0}.repertoire-identity h2 a {font-size:15px;font-weight:550;color:var(--text)}
.repertoire-identity p {margin-top:3px;font-size:12px}.repertoire-arrangement {display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted)}
.song-status {font-size:11px}.song-status[data-status=performance-ready] {color:var(--accent-text);font-weight:600}
.song-tempo {display:flex;flex-direction:column;align-items:flex-end;gap:2px}.song-tempo strong {font-family:var(--mono);font-size:20px;font-weight:500}.song-tempo small {font-size:10px;color:var(--muted)}
/* Object-specific details. */
.sticking-panel {padding:24px;background:var(--surface);border:1px solid var(--border);border-radius:6px}
.sticking-panel .sticking {font-size:24px;line-height:1.8;white-space:pre-wrap}
.clean-highlight {color:var(--accent-text)}
.detail-actions {display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:20px 0}
.section-row {display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}
.section-info {min-width:0;flex:1}.section-info strong {display:block;font-weight:550}.section-info .small {display:block;margin-top:3px}
.section-row .actions {flex-shrink:0}.target-input {width:90px!important}
.weekdays {display:flex;gap:6px;flex-wrap:wrap}.weekday-button {min-width:40px}.weekday-button.selected {background:var(--accent-soft);color:var(--accent-text);border-color:var(--accent)}
.setlist-collection {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.setlist-collection>.setlist-card {padding:20px 0;display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--border)}
.setlist-collection .setlist-card h2 a {color:var(--text);font-size:18px}
.setlist-preview {margin:0 0 4px;padding-left:22px;font-size:13px;color:var(--muted)}.setlist-preview li {padding:4px 0}
.setlist-song-row {display:flex;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--border)}
.song-row-title {flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.song-row-title>a {font-size:16px;font-weight:550;color:var(--text)}
.song-row-meta {display:flex;flex-direction:column;gap:3px;font-size:12px;min-width:130px}.song-row-meta strong {font-family:var(--mono);font-weight:500}
.goal-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px}
.goal-card {min-width:0;padding:16px 0 20px;border-top:1px solid var(--border)}.goal-card h2 {font-size:17px;margin:8px 0}.goal-card>p {font-size:13px}
.goal-value {font-family:var(--mono);font-size:22px;font-weight:500;display:block;margin:16px 0 10px;letter-spacing:-.5px}
.goal-footer {margin-top:12px;flex-wrap:wrap}.goal-card>.button {margin-top:14px}.goal-done h2 {color:var(--muted)}
.history-card {display:flex;align-items:center;gap:24px;padding:22px 12px;border-bottom:1px solid var(--border)}
.history-date {display:flex;flex-direction:column;min-width:72px;font-size:12px;color:var(--muted)}.history-date strong {font-size:15px;color:var(--text);font-weight:550}
.history-main {flex:1;min-width:0}.history-main h2 {font-size:16px;margin-bottom:4px}.history-main>p {font-size:12px;color:var(--muted)}
.history-duration {display:flex;flex-direction:column;align-items:flex-end;gap:6px}.history-duration>strong {font-family:var(--mono);font-size:23px;font-weight:500;white-space:nowrap}
.history-block-row {display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid var(--border);font-size:13px}
.history-block-row>p {flex-basis:100%}.history-block-row .attempt-tags {margin-left:auto}
.review-block {padding:20px 0;border-top:1px solid var(--border)}.review-block .split h3 {font-size:16px}.review-block>p {margin-top:12px}
.review-metrics {display:flex;gap:24px;margin:14px 0}.review-metrics>div {display:flex;flex-direction:column;gap:4px}.review-metrics strong {font-family:var(--mono);font-size:16px}
/* Progress charts keep a readable coordinate system at narrow widths. */
.range-toolbar {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:24px}.range-toolbar .field {margin:0;min-width:140px}
.range-toolbar .actions {margin-left:auto}
.tempo-chart-header {display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}
.tempo-chart-header>.field {max-width:340px;flex:1;min-width:200px}
.tempo-chart-stats {display:flex;gap:20px}.tempo-chart-stats .stat {padding:0 20px 0 0}.tempo-chart-stats .stat-value {font-size:23px}
.inset-stats {border:0;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:0}
.chart {width:100%;margin:12px 0 0}.chart>svg {display:block;width:100%;height:auto;max-height:240px}
.chart figcaption {margin-top:12px;font-size:12px;line-height:1.5}.chart-empty {padding:28px 0;color:var(--muted);font-size:13px;min-height:130px}
.distribution-row {display:grid;grid-template-columns:110px minmax(40px,1fr) auto;gap:12px;align-items:center;padding:9px 0;font-size:12px}
.distribution-row .progress-track {height:5px}
.data-details {margin-top:16px}.data-details summary {padding:10px 0;font-size:12px;color:var(--muted)}
table {width:100%;border-collapse:collapse;font-size:12px}th,td {padding:10px 8px;text-align:left;border-bottom:1px solid var(--border);overflow-wrap:anywhere}th {font-weight:550;color:var(--muted)}
/* Launch and precision instrument. */
.launch-sequence {list-style:none;padding:0;margin:0 0 20px}.launch-sequence>li {display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--border);font-size:13px}
.launcher-options {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--border);margin:0 0 28px}
.launcher-option,.button.launcher-option {display:flex;align-items:center;justify-content:flex-start;gap:8px;padding:16px 8px;border:0;border-radius:0;font-size:13px;color:var(--muted)}
.launcher-option>svg {width:17px;height:17px}.launcher-option:hover {background:var(--surface-soft);color:var(--text)}
.quick-exercises {display:flex;gap:12px;flex-wrap:wrap}.button.quick-exercise {justify-content:flex-start;border-bottom:1px solid var(--border);border-radius:0;padding-left:0}
.metronome-grid {display:grid;grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr);gap:40px;align-items:start}
.metronome-main {background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:22px 28px;margin:0}
.instrument-heading {display:flex;justify-content:space-between;align-items:center}
.status-label {font-size:11px;color:var(--muted);font-weight:500}
.tempo-display {display:flex;align-items:center;justify-content:center;margin:14px 0 10px}
input.metronome-bpm {width:100%;max-width:320px;text-align:center;font-family:var(--mono);font-size:110px;height:130px;min-height:0;padding:0;letter-spacing:-8px;font-weight:500;border:1px solid transparent;background:transparent;border-radius:4px;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}
input.metronome-bpm:hover {border-color:var(--border-strong)}
.standalone-tempo-steps {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:6px 0 8px}
.button.tempo-step {border:1px solid var(--border-strong);background:var(--surface);padding:7px 4px;font-size:13px;font-family:var(--mono);font-weight:400}
.metronome-transport {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:start;gap:16px;margin:16px 0 24px}
.metronome-play {min-height:46px}.tap-tempo {display:flex;flex-direction:column;align-items:center;gap:5px}.tap-tempo>.button {width:100%;min-height:46px}.tap-tempo>.small {font-size:11px;text-align:center}
.meter-workspace {border-top:1px solid var(--border);padding-top:18px}
.metronome-config {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);gap:10px}
.metronome-config .field {margin-bottom:14px}.metronome-config label {font-size:11px}.metronome-config select {font-size:12px;padding:8px;min-width:0}
.metronome-beats {display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:4px 0 8px}
.button.metronome-beat {flex:1;min-width:42px;max-width:70px;display:flex;flex-direction:column;gap:1px;min-height:54px;padding:6px;border:1px solid var(--border-strong);border-radius:3px;font-family:var(--mono);font-weight:500}
.metronome-beat small {font-family:inherit;font-size:9px;color:var(--muted)}
.metronome-beat.accent-2 {border-top:3px solid var(--accent);padding-top:4px}.metronome-beat.accent-0 {border-style:dashed}
.button.metronome-beat.on {background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.metronome-beat.on small {color:var(--on-accent)}
.accent-help {text-align:center;font-size:11px}.meter-workspace>.field-hint {margin-top:12px}
.volume-row {display:flex;align-items:center;gap:12px;border-top:1px solid var(--border);padding-top:16px;margin-top:18px;font-size:12px}
.volume-row>.field {flex:1;min-width:80px;margin:0}.volume-row>.button {font-size:12px;padding-inline:8px}
.metronome-side .section-heading {gap:6px}.preset-row {display:flex;gap:8px;align-items:center;border-bottom:1px solid var(--border);padding:10px 0}
.preset-button {flex:1;min-width:0;text-align:left;justify-content:flex-start;padding-left:0;font-size:13px;font-weight:500}.preset-row>.small {white-space:nowrap;font-family:var(--mono);font-size:11px}
.inset {padding:8px 0}.playback-help {border-top:1px solid var(--border);padding:16px 0;font-size:13px}.playback-help summary {cursor:pointer}.playback-help p {margin-top:14px}
/* Active practice. All frequent controls share one compact work surface. */
.active-main {min-height:100dvh}.active-page {max-width:1200px;margin:auto;padding:24px 32px 40px}
.practice-header {display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--border);padding-bottom:16px}
.practice-header>.actions {justify-content:flex-end}.practice-header .button {font-size:12px}
.active-grid {display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:48px;align-items:start;max-width:1000px;margin:28px auto 0}
.active-page.focused .active-grid {display:block;max-width:620px}.active-page.focused .practice-queue {display:none}
.practice-workspace {min-width:0}.practice-identity {margin-bottom:20px}.practice-state {display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.practice-state .eyebrow {margin:0;font-size:11px}.active-title {font-size:27px;letter-spacing:-.7px}.active-sticking {font-size:16px;color:var(--muted);margin-top:8px}
.practice-readouts {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-block:1px solid var(--border);padding:16px 0;gap:24px;align-items:start}
.time-readout {padding-right:24px;border-right:1px solid var(--border)}.active-timer {display:flex;flex-direction:column;gap:4px;margin:8px 0 14px}
.active-time {font-size:52px;font-family:var(--mono);letter-spacing:-3px;line-height:1.2;font-weight:500;font-variant-numeric:tabular-nums}.timer-target {font-size:12px;color:var(--muted);font-family:var(--mono)}
input.active-bpm {background:transparent;border:1px solid transparent;border-radius:3px;width:100%;font-family:var(--mono);font-size:52px;letter-spacing:-2px;min-height:0;height:68px;padding:0;line-height:1;font-weight:500}
input.active-bpm:hover {border-color:var(--border-strong)}
.active-tempo-controls {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.active-tempo-controls .tempo-step {min-height:32px;font-size:12px}
.practice-beats {display:flex;gap:6px;flex-wrap:wrap;margin:16px 0;height:auto;min-height:14px;align-items:stretch}
.practice-beat {flex:1;min-width:14px;max-width:80px;height:16px;line-height:16px;text-align:center;font-family:var(--mono);font-size:9px;color:var(--muted);background:var(--surface-soft);border:1px solid var(--border-strong);border-radius:1px}
.practice-beat.on {background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.practice-main-controls {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:10px}.start-practice {min-height:48px;font-size:15px}.practice-main-controls>.ghost {font-size:12px;background:var(--surface-soft)}
.attempt-section {margin-top:22px}.attempt-section>.label {margin-bottom:8px;font-size:11px}
.rating-buttons {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.button.rating-button {min-height:44px;padding:8px 3px;border:1px solid var(--border-strong);font-size:12px;font-weight:400;background:var(--surface)}
.button.clean-rating {background:var(--accent-soft);color:var(--accent-text);font-weight:600;border-color:var(--accent)}
.attempt-feedback {min-height:0;font-size:11px;color:var(--accent-text)}.attempt-feedback:not(:empty) {margin-top:6px}
.block-transition-controls {display:flex;gap:6px;border-top:1px solid var(--border);padding-top:16px;margin-top:18px;flex-wrap:wrap}.block-transition-controls>.button {min-height:44px}.block-transition-controls>.secondary {flex:1;font-size:13px}.block-transition-controls>.ghost {font-size:11px;padding-inline:8px}
.practice-tools {display:flex;gap:8px;justify-content:center;margin-top:10px}.practice-tools .button {font-size:12px;color:var(--muted)}
.trainer-status:not(:empty),.active-note-preview:not(:empty) {padding:10px 0;font-size:12px}
.next-block {border-top:1px solid var(--border);padding-top:14px;margin-top:14px;display:flex;gap:12px;font-size:12px;align-items:baseline}.next-block .label {font-size:11px;flex-shrink:0}.next-block strong {font-size:12px;font-weight:400;color:var(--muted)}
.queue-block {display:flex;gap:12px;padding:14px 10px;border-bottom:1px solid var(--border)}.queue-block.current {background:var(--accent-soft)}.queue-number {font-family:var(--mono);font-size:11px;color:var(--muted)}.queue-block>div {display:flex;flex-direction:column;gap:4px;min-width:0}.queue-block strong {font-size:13px;font-weight:500}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
/* Forms and overlays. */
input:not([type=checkbox]):not([type=range]):not([type=file]):not(.active-bpm):not(.metronome-bpm):not(.inline-number),select,textarea {max-width:100%;border:1px solid var(--border-strong);border-radius:4px;background:var(--surface);padding:9px 11px;font-size:14px;width:100%;min-height:40px}
input[type=number] {appearance:textfield;-moz-appearance:textfield;font-variant-numeric:tabular-nums}
input::-webkit-inner-spin-button,input::-webkit-outer-spin-button {-webkit-appearance:none;margin:0}
/* These readouts intentionally differ from ordinary form fields. */
input.metronome-bpm {font-size:110px;min-height:0;height:130px;max-width:320px;padding:0;border-color:transparent;background:transparent}
input.active-bpm {font-size:52px;min-height:0;height:68px;padding:0;border-color:transparent;background:transparent}
textarea {resize:vertical;line-height:1.5;min-height:92px}
input[type=range] {accent-color:var(--accent);width:100%;height:32px;min-width:0;margin:0;cursor:pointer}
input[type=checkbox] {accent-color:var(--accent);width:16px;height:16px;flex-shrink:0;margin:0}
.field {display:flex;flex-direction:column;gap:6px;min-width:0;margin-bottom:16px}.field>label,.appearance-fieldset legend {font-size:12px;font-weight:500;color:var(--muted)}
.field-hint {font-size:12px;line-height:1.5;color:var(--muted);margin-top:8px}
.form-grid {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px}.form-grid>.field {min-width:0}
.checkbox {display:flex;gap:10px;align-items:center;min-height:36px;font-size:13px;cursor:pointer}.checkbox>span {overflow-wrap:anywhere}
.form-actions {display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:24px;padding-top:16px;border-top:1px solid var(--border)}
.form-error:empty {display:none}
.form-error,.practice-error {color:var(--danger);font-size:13px;line-height:1.5}.form-error:not(:empty),.practice-error:not(:empty) {padding:12px 0}
fieldset {min-width:0;border:1px solid var(--border);padding:14px;margin:12px 0}legend {font-size:13px;padding:0 5px}
.dialog {width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 40px);padding:0;border:1px solid var(--border-strong);border-radius:8px;box-shadow:var(--shadow);color:var(--text);background:var(--surface);overscroll-behavior:contain}
.dialog::backdrop {background:#10190f55}
.dialog-header {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);z-index:1}
.dialog-header h2 {font-size:17px;line-height:1.4;min-width:0}.dialog-content {padding:24px}.dialog-content>p {font-size:14px}
.dialog-footer {display:flex;justify-content:flex-end;gap:10px;padding:0 24px 24px;flex-wrap:wrap}
.block-menu-dialog {width:min(340px,calc(100vw - 24px))}.block-menu-dialog .dialog-content {padding:6px}
.block-menu {display:flex;flex-direction:column;gap:2px}.button.block-menu-action {justify-content:flex-start;min-height:44px;padding:12px;font-size:13px;font-weight:400}.block-menu-action:last-child {color:var(--danger);border-top:1px solid var(--border);margin-top:4px;border-radius:0}
.command-input {font-size:16px!important}.command-items {margin-top:12px;max-height:52dvh;overflow-y:auto}.command-item {width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;text-align:left;border:0;background:transparent;border-radius:3px;font-size:13px}.command-item.highlighted {background:var(--accent-soft);color:var(--accent-text)}.command-item>small {margin-left:auto;color:var(--muted);font-size:11px}.command-item>span {text-align:left}.command-item>div {display:flex;flex-direction:column;gap:3px}.result-meta {margin-bottom:12px;color:var(--muted);font-size:11px}.command-hint {font-size:11px;color:var(--muted);margin-top:12px}
.welcome-intro {font-size:14px;color:var(--muted);margin-bottom:24px}.onboarding-actions {display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}
.more-nav {display:grid;grid-template-columns:1fr 1fr;gap:4px}.more-nav .button {justify-content:flex-start;min-height:44px}
/* Appearance and settings. */
.settings-grid {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:start}.settings-grid>div {min-width:0}.settings-grid .panel {margin-bottom:32px}.settings-grid .panel>p {font-size:13px}.settings-grid .panel>.actions {gap:8px}
.settings-toggles {margin:8px 0 16px}.settings-form>.button {margin-top:16px}
.appearance-fieldset {border:0;margin:0 0 20px;padding:0}.appearance-fieldset legend {padding:0;margin-bottom:10px}
.theme-options {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.button.theme-choice {border:1px solid var(--border-strong);min-height:42px;background:var(--surface);font-size:12px}
.theme-choice[aria-pressed=true] {background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text);box-shadow:inset 0 -2px var(--accent)}
.accent-options {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.button.accent-choice {justify-content:flex-start;padding:8px;border:1px solid transparent;font-size:12px;gap:8px}.accent-choice[aria-pressed=true] {border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text)}
.accent-swatch {width:18px;height:18px;border-radius:50%;background:var(--swatch);display:grid;place-items:center;color:#fff;flex-shrink:0}.accent-swatch>svg {visibility:hidden;width:12px;height:12px}.accent-choice[aria-pressed=true] .accent-swatch>svg {visibility:visible}
.accent-choice[data-accent=graphite] {--swatch:#343b34}.accent-choice[data-accent=blue] {--swatch:#2a5ba7}.accent-choice[data-accent=forest] {--swatch:#24654a}.accent-choice[data-accent=plum] {--swatch:#794799}.accent-choice[data-accent=amber] {--swatch:#8b5818}.accent-choice[data-accent=rose] {--swatch:#a33e55}
:root[data-theme=dark] .accent-choice[data-accent=graphite] {--swatch:#c9d3c5}:root[data-theme=dark] .accent-choice[data-accent=blue] {--swatch:#99b9ed}:root[data-theme=dark] .accent-choice[data-accent=forest] {--swatch:#8ccca7}:root[data-theme=dark] .accent-choice[data-accent=plum] {--swatch:#d5aae9}:root[data-theme=dark] .accent-choice[data-accent=amber] {--swatch:#e7bc76}:root[data-theme=dark] .accent-choice[data-accent=rose] {--swatch:#efa1b3}:root[data-theme=dark] .accent-swatch {color:#192119}
.appearance-hint {font-size:11px}.appearance-dialog {max-width:440px}
.shortcut-list {margin:16px 0 0;padding:0;font-size:12px}.shortcut-list>div {display:flex;gap:16px;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border)}.shortcut-list dd {margin:0;text-align:right;color:var(--muted)}.playback-help .shortcut-list {display:grid;grid-template-columns:1fr auto;gap:8px}
.danger-zone {border-top:1px solid var(--border);padding:24px 0;display:flex;justify-content:space-between;align-items:center;gap:20px}.danger-zone h2 {font-size:15px}.danger-zone p {margin-top:6px}.danger-text {color:var(--danger)}.warning-text {color:var(--warning)}
/* Status belongs near the action, not in permanent promotional chrome. */
.recovery-banner,.session-recovery,.info-banner {padding:16px 20px;border-left:3px solid var(--accent);background:var(--accent-soft);margin-bottom:24px;display:flex;gap:16px;align-items:center;justify-content:space-between;font-size:13px}
.recovery-banner>div {display:flex;flex-direction:column;gap:4px;min-width:0}.recovery-banner strong {font-weight:600}.recovery-banner span {color:var(--muted);font-size:12px}
.session-recovery {display:block;margin:20px 0}.session-recovery>p {margin:8px 0 16px}.info-banner {display:block}
.update-banner {display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:12px 24px;background:var(--accent-soft);font-size:12px}
.notifications {position:fixed;right:24px;bottom:24px;z-index:100;display:flex;flex-direction:column;gap:8px;max-width:440px;pointer-events:none}
.toast {pointer-events:auto;display:flex;align-items:center;gap:10px;border:1px solid var(--border-strong);background:var(--surface);padding:10px 12px;border-radius:6px;box-shadow:var(--shadow);font-size:13px}.toast>span {min-width:0}.toast>.icon-button {margin-left:auto}.toast.error {border-color:var(--danger);color:var(--danger)}
.boot {max-width:560px;margin:15vh auto;padding:24px;display:flex;flex-direction:column;gap:16px}.boot>svg {width:36px;height:36px}
/* A shorter labeled rail on tablets, not an unexplained column of glyphs. */
@media (max-width:1199px) and (min-width:760px) {
  .app-shell {grid-template-columns:92px minmax(0,1fr)}
  .sidebar {padding:20px 8px 12px;gap:18px;align-items:stretch}.brand {justify-content:center;padding:0}.brand strong {display:none}
  .nav-group-label {display:none}.nav-link {flex-direction:column;gap:4px;padding:8px 2px;min-height:54px;font-size:10px}.nav-link>svg {width:18px;height:18px}.nav-link.active::before {top:14px;bottom:14px}
  .sidebar-nav {gap:1px}.settings-nav {margin-top:10px;padding-top:12px}.sidebar .search-trigger {justify-content:center;padding:8px}.sidebar .search-trigger span,.sidebar .search-trigger kbd {display:none}
  .sidebar-footer .button {font-size:10px;flex-direction:column;padding:4px;gap:4px}.main-content {padding:32px 28px 48px}
  .today-grid {grid-template-columns:minmax(0,1fr)}.today-side {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px}.today-side .panel {margin:0}.week-summary {margin:0;padding-top:20px}
  .exercise-list .exercise-card {grid-template-columns:108px minmax(0,1fr) 130px;gap:12px}.exercise-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .settings-grid {gap:28px}.metronome-grid {grid-template-columns:minmax(0,1fr);gap:24px}.metronome-main {max-width:640px;width:100%;margin:0 auto}.metronome-side {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px}
  .metronome-side .panel {margin:0}.playback-help {padding-top:20px}.two-column.wide-left {grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .song-row {grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 65px auto;gap:12px}.active-grid {grid-template-columns:minmax(0,1fr) 210px;gap:32px}
}
@media (min-width:760px) and (max-height:780px) {
  .sidebar {gap:12px;padding-top:18px}.nav-group-label {padding-top:12px}.nav-link {min-height:34px;padding-block:7px}.sidebar-footer {padding-top:6px}.sidebar-footer .button {min-height:32px}
}
@media (max-width:959px) and (min-width:760px) {
  .settings-grid {grid-template-columns:minmax(0,1fr)}.settings-grid .panel {margin-bottom:24px}.two-column,.two-column.wide-left {grid-template-columns:minmax(0,1fr);gap:0}.stats-strip .stat {padding-inline:14px}.stats-strip .stat:first-child {padding-left:0}.stat-value {font-size:25px}.launcher-options {grid-template-columns:repeat(2,minmax(0,1fr))}.section-row {flex-wrap:wrap}.song-row-meta {min-width:110px}
}
@container (max-width:620px) {
  .plan-columns {display:none}.block-row {grid-template-columns:20px minmax(0,1fr) var(--block-action-width,84px);gap:10px;padding:14px 16px}
  .block-index {grid-column:1;grid-row:1}.block-title {grid-column:2;grid-row:1}.block-actions {grid-column:3;grid-row:1}.block-numbers {grid-column:2 / -1;grid-row:2;justify-content:flex-start;gap:18px}.block-numbers>label {flex-direction:row;gap:6px;font-size:11px}
  .block-cue {font-size:11px}.plan-panel>.section-heading {padding:16px}.plan-panel>.section-heading .button {font-size:12px;padding:8px 10px}
}
@media (max-width:759px) {
  body {font-size:14px}.app-shell {display:block}.sidebar {display:none}
  .topbar {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;border-bottom:1px solid var(--border);background:var(--bg)}
  .mobile-brand {font-size:17px;letter-spacing:-.5px;gap:8px}.mobile-brand>svg {width:22px;height:22px}
  .topbar .actions {gap:4px}.topbar .search-trigger {width:40px;min-height:40px;padding:8px;justify-content:center;border:0}.topbar .search-trigger span,.topbar .search-trigger kbd {display:none}
  .main-content {padding:24px 18px calc(94px + env(safe-area-inset-bottom))}.page-heading {gap:12px;margin-bottom:24px;flex-wrap:wrap}.page-heading h1 {font-size:25px}.page-heading p {font-size:12px}.page-heading>.actions {width:100%;justify-content:flex-start;gap:8px;padding:0}
  .page-heading .button {min-height:44px}.panel {padding-top:18px;margin-bottom:24px}.section-heading {gap:10px;margin-bottom:14px}.section-title {gap:5px 10px}.section-title h2 {font-size:15px}
  .button {min-height:44px;font-size:13px}.button.compact {min-height:40px}.icon-button,.button.icon-button {width:40px;height:44px;min-height:44px}.topbar .icon-button {width:40px;min-height:40px;height:40px}
  .back-link {min-height:36px;margin-bottom:12px}.actions {gap:8px}.text-link {font-size:13px}.label {font-size:11px}
  .today-grid,.today-overview,.two-column,.two-column.wide-left,.settings-grid {grid-template-columns:minmax(0,1fr);gap:24px}
  .today-grid {gap:24px}.today-overview {margin-top:24px}.today-side {display:block}.today-side>.panel {margin-bottom:24px}
  .plan-panel {padding:0}.plan-panel>.section-heading {padding:16px;gap:8px}.plan-panel>.section-heading .section-title h2 {font-size:14px}.plan-panel>.section-heading .section-title>.small {font-size:11px}.plan-panel>.section-heading .button {font-size:12px;min-height:40px;padding:7px 10px}.plan-panel>.section-heading .button>svg {width:14px}
  .plan-footer {padding:8px 14px;font-size:12px}.plan-footer>.button {padding-inline:4px}.plan-panel>.empty-state {padding:24px 18px}.plan-panel .empty-state>.actions {align-items:stretch;flex-direction:column;width:100%}
  .block-row {padding:12px;gap:8px;grid-template-columns:16px minmax(0,1fr) 84px}.block-title>strong {font-size:13px}.block-cue {font-size:11px}.block-numbers {gap:18px}.inline-number {min-height:36px!important;height:36px;font-size:14px!important;width:52px}.block-numbers>label {font-size:11px}.block-add {padding:4px 12px}
  .stats-strip {grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 0;padding:18px 0}.stat {padding:0 16px}.stat:nth-child(2n) {border:0}.stat:nth-child(2n+1) {padding-left:0}.stat-value {font-size:26px}
  .inset-stats {grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.inset-stats .stat {padding:0 10px}.inset-stats .stat:first-child {padding-left:0}.inset-stats .stat:nth-child(2) {border-right:1px solid var(--border)}.inset-stats .stat-value {font-size:22px}
  .library-toolbar {gap:8px;align-items:stretch}.search-field {flex-basis:100%;min-width:0}.library-toolbar select {flex:1 1 40%;min-width:0;max-width:none;font-size:13px;min-height:44px}.filter-line {gap:8px}
  .exercise-list .exercise-card {grid-template-columns:minmax(0,1fr) 112px;gap:5px 10px;padding:14px 4px}.exercise-list .exercise-card-top {grid-column:1 / -1;grid-row:1;flex-direction:row;justify-content:flex-start;gap:10px}.exercise-list .exercise-card h2 a {font-size:14px}.exercise-list .exercise-card>h2 {grid-column:1;grid-row:2}.exercise-list .exercise-card>p {grid-column:1;grid-row:3}.exercise-list .exercise-card-bottom {grid-column:2;grid-row:2 / 4;justify-content:flex-end;gap:8px}.exercise-card-bottom strong {font-size:13px}.exercise-card-bottom .tiny {font-size:9px}.exercise-card-bottom>div {gap:2px}.exercise-card-bottom>.button {min-width:40px;padding:6px;font-size:12px}
  .exercise-card .small-sticking {font-size:11px}.exercise-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.exercise-grid .exercise-card {padding:16px 0;gap:12px}.exercise-grid .exercise-card-bottom {flex-wrap:wrap}.exercise-grid h2 a {font-size:13px}
  .routine-row {padding:16px 4px 6px;gap:10px;flex-wrap:wrap}.routine-identity {flex-basis:calc(100% - 70px)}.routine-identity h2 a {font-size:15px}.routine-row>.button {margin-left:auto;min-height:40px;padding:6px 10px;font-size:12px}.routine-duration {font-size:15px}.routine-disclosure {padding-inline:4px;margin-top:-42px;padding-bottom:10px;max-width:65%}.routine-disclosure[open] {max-width:100%;margin-top:0}.routine-disclosure summary {min-height:44px;padding:12px 0}.routine-disclosure[open] .routine-preview {max-width:none}
  .song-row {grid-template-columns:minmax(0,1fr) 58px auto;gap:4px 10px;padding:16px 4px}.repertoire-arrangement {grid-column:1;grid-row:2}.repertoire-identity {grid-column:1;grid-row:1}.song-tempo {grid-column:2;grid-row:1 / 3}.song-row>.button {grid-column:3;grid-row:1 / 3;padding:8px;font-size:12px}.song-tempo strong {font-size:20px}.song-tempo small {font-size:9px}.repertoire-identity h2 a {font-size:14px}
  .setlist-collection,.goal-grid {grid-template-columns:minmax(0,1fr);gap:24px}.setlist-collection>.setlist-card {margin:0}.goal-grid {gap:12px}.goal-card h2 {font-size:16px}.goal-value {font-size:23px}
  .section-row {gap:10px;flex-wrap:wrap}.section-info {flex:1;min-width:120px}.section-row>.actions {flex-basis:100%;justify-content:flex-end}.sticking-panel {padding:20px}.sticking-panel .sticking {font-size:19px}
  .setlist-song-row {display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px}.setlist-song-row>.block-index {grid-row:1 / 3}.song-row-title {grid-column:2}.song-row-meta {grid-column:2;min-width:0}.setlist-song-row>.actions {grid-column:2;justify-content:flex-end}.song-row-title>a {font-size:15px}
  .history-card {gap:12px;padding:18px 4px;align-items:flex-start;flex-wrap:wrap}.history-date {min-width:64px;font-size:11px}.history-main {min-width:140px}.history-main h2 {font-size:14px}.history-duration {flex-direction:row;flex-basis:100%;align-items:center;justify-content:space-between;padding-left:76px}.history-duration>strong {font-size:20px}.history-block-row {gap:10px;font-size:12px}.history-block-row .attempt-tags {margin:0}.review-metrics {flex-wrap:wrap;gap:16px}.review-block>.split {flex-wrap:wrap}
  .range-toolbar {gap:10px}.range-toolbar>.field {min-width:100px;flex:1}.range-toolbar>.actions {margin:0;flex-basis:100%}.range-toolbar .segmented {flex-wrap:wrap}.tempo-chart-stats {margin-bottom:14px}.tempo-chart-header>.field {max-width:none;min-width:0;flex-basis:100%}.distribution-row {grid-template-columns:92px minmax(30px,1fr) auto;gap:8px}
  .launcher-options {grid-template-columns:repeat(2,minmax(0,1fr))}.launcher-option,.button.launcher-option {padding:14px 4px;font-size:12px}.launch-sequence>li {flex-wrap:wrap;gap:3px 12px}.quick-exercises {gap:8px}
  .metronome-grid {grid-template-columns:minmax(0,1fr);gap:24px}.metronome-main {padding:16px}.metronome-side .panel {margin-bottom:16px}.metronome-page .page-heading {margin-bottom:20px}
  input.metronome-bpm {font-size:88px;height:108px;letter-spacing:-5px}.tempo-display {margin:8px 0}.standalone-tempo-steps {gap:4px}.button.tempo-step {font-size:12px;min-height:40px}
  .metronome-transport {gap:10px;margin:12px 0 20px}.metronome-play {font-size:12px}.tap-tempo>.button {font-size:12px}.tap-tempo>.small {font-size:10px}.metronome-config {grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:8px}.metronome-config>.field:last-child {grid-column:1 / -1}.metronome-config .field:last-child {display:grid;grid-template-columns:1fr 1fr;align-items:center;margin-bottom:12px}.metronome-config select {font-size:13px;min-height:44px}.metronome-config label {font-size:11px}.meter-workspace {padding-top:16px}
  .metronome-beats {gap:5px}.button.metronome-beat {min-width:40px;min-height:52px;max-width:70px}.volume-row {gap:8px;flex-wrap:wrap}.volume-row>.field {min-width:110px;flex-basis:50%}.volume-row>.button {font-size:11px}.accent-help {font-size:10px}
  .active-page {padding:10px 16px calc(24px + env(safe-area-inset-bottom))}.practice-header {gap:4px;padding-bottom:10px}.practice-header>.actions {gap:4px}.practice-header .button {font-size:11px;padding:6px;gap:4px;min-height:44px}.practice-header .button>svg {width:14px;height:14px}.practice-header>.button {white-space:nowrap}
  .active-grid {display:block;margin-top:16px}.practice-queue {margin-top:28px}.practice-identity {margin-bottom:12px}.active-title {font-size:23px}.practice-state {margin-bottom:6px}.active-sticking {font-size:13px;margin-top:5px}.practice-state .eyebrow,.status-label {font-size:10px}
  .practice-readouts {gap:16px;padding:12px 0}.time-readout {padding-right:16px}.active-time {font-size:42px;letter-spacing:-2px}.active-timer {gap:4px;margin:7px 0 12px}.timer-target {font-size:11px}
  input.active-bpm {font-size:42px;height:56px;letter-spacing:-2px}.active-tempo-controls {gap:4px}.active-tempo-controls .tempo-step {font-size:12px;padding:6px 1px;min-height:44px}.practice-beats {gap:4px;margin:12px 0}.practice-beat {height:12px;line-height:10px;font-size:8px}
  .practice-main-controls {gap:8px}.start-practice {min-height:46px;font-size:13px}.practice-main-controls>.ghost {font-size:11px;padding:6px}.attempt-section {margin-top:16px}.attempt-section>.label {font-size:10px;margin-bottom:6px}.rating-buttons {gap:4px}.button.rating-button {font-size:11px;padding:6px 1px;min-height:44px}.attempt-feedback {font-size:10px}
  .block-transition-controls {gap:4px;margin-top:14px;padding-top:12px}.block-transition-controls>.button {min-height:44px}.block-transition-controls>.secondary {font-size:12px;padding:8px}.block-transition-controls>.ghost {font-size:10px;padding:6px;min-height:44px}.block-transition-controls .button>svg {width:14px;height:14px}
  .practice-tools {margin-top:6px;gap:6px}.practice-tools .button {font-size:11px;min-height:40px}.next-block {margin-top:8px;padding-top:10px;font-size:11px}.next-block strong {font-size:11px}.next-block .label {font-size:10px}
  input:not([type=checkbox]):not([type=range]):not([type=file]):not(.active-bpm):not(.metronome-bpm):not(.inline-number),select,textarea {font-size:16px;min-height:44px}.field>label {font-size:12px}.form-grid {gap:0 12px}.field {margin-bottom:14px}.checkbox {min-height:44px}.form-actions {margin-top:18px}
  .dialog {width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:6px}.dialog-header {padding:10px 16px}.dialog-header h2 {font-size:16px}.dialog-content {padding:18px}.dialog-footer {padding:0 18px 18px;gap:8px}.dialog-footer>.button {flex:1}.dialog::backdrop {background:#10190f66}
  .block-menu-dialog {width:calc(100vw - 24px);max-width:360px}.block-menu-dialog .dialog-content {padding:6px}.button.block-menu-action {min-height:46px}.more-nav .button {font-size:13px}.onboarding-actions>.button {flex:1;font-size:12px}.welcome-intro {font-size:13px}
  .theme-options {gap:6px}.button.theme-choice {font-size:12px;min-height:44px;padding:8px 6px;gap:5px}.accent-options {gap:6px}.button.accent-choice {font-size:11px;min-height:44px;gap:7px;padding:6px}.appearance-hint {font-size:11px}
  .settings-grid {gap:0}.settings-grid .panel {margin-bottom:24px}.shortcut-list>div {gap:12px}.shortcut-list dd {text-align:left;flex:1}.shortcut-list dt {flex:0 0 110px}.danger-zone {flex-wrap:wrap;gap:14px}.danger-zone .button {font-size:12px}
  .recovery-banner {padding:14px;gap:12px;align-items:flex-start;flex-wrap:wrap}.session-recovery {padding:14px}.session-recovery>p {font-size:12px}.info-banner {padding:14px}
  .notifications {left:12px;right:12px;bottom:calc(82px + env(safe-area-inset-bottom));max-width:none}.practice-route .notifications {bottom:calc(12px + env(safe-area-inset-bottom))}.toast {font-size:12px;padding:8px;gap:8px}.toast .icon-button {width:32px;min-height:36px;height:36px}
  .mobile-nav {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;z-index:20;bottom:0;left:0;right:0;border-top:1px solid var(--border);background:var(--surface);padding:4px 8px calc(4px + env(safe-area-inset-bottom))}
  .mobile-nav>a,.button.mobile-more {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:54px;font-size:10px;font-weight:500;color:var(--muted);padding:6px 0;border:0;border-radius:0;background:transparent;position:relative}
  .mobile-nav>a.active,.mobile-more.active {color:var(--accent-text)}.mobile-nav>a.active::before,.mobile-more.active::before {content:"";position:absolute;left:26%;right:26%;top:-4px;height:2px;background:var(--accent)}
  .mobile-more>svg {width:20px;height:20px}.update-banner {padding:12px 18px}
}
@media (max-width:359px) {
  .main-content {padding-inline:14px}.topbar {padding-inline:14px}.plan-panel>.section-heading {padding:14px 12px}.plan-panel>.section-heading .button {font-size:11px;padding:6px}.plan-panel>.section-heading .button>svg {display:none}
  .block-row {grid-template-columns:14px minmax(0,1fr) var(--block-action-width,80px);gap:6px;padding-inline:10px}.block-title>strong {font-size:12px}.block-cue {font-size:10px}.block-actions {gap:0}.block-numbers {gap:14px}
  .active-page {padding-inline:12px}.practice-header .button {font-size:11px;min-height:44px}.practice-header>.actions {gap:2px}.practice-header .button>svg {width:12px}.active-grid {margin-top:12px}.active-title {font-size:20px}.active-sticking {font-size:12px}.practice-readouts {gap:12px;padding:10px 0}.time-readout {padding-right:12px}.active-time {font-size:37px}input.active-bpm {font-size:37px;height:52px}.practice-beats {margin:10px 0}.attempt-section {margin-top:12px}.button.rating-button {font-size:11px}.block-transition-controls>.ghost {font-size:9px;padding:6px 4px}.practice-tools .button {font-size:10px}.next-block {gap:8px}
  .metronome-main {padding:14px}.metronome-play {font-size:11px;padding:8px 6px}.tap-tempo>.button {font-size:11px;padding:8px 6px}.form-grid {grid-template-columns:minmax(0,1fr)}.exercise-list .exercise-card {grid-template-columns:minmax(0,1fr) 104px}.exercise-card-bottom .tiny {font-size:9px}.button.accent-choice {font-size:10px}.accent-swatch {width:16px;height:16px}
}
@media (pointer:coarse) {
  .block-row {--block-action-width:92px}
  .inline-number {min-height:44px!important;height:44px;font-size:16px!important}
  .nav-link {min-height:44px}.button.compact,.button.segmented-button,.block-actions>.button {min-height:44px}.icon-button,.button.icon-button {min-width:44px;min-height:44px}
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media (forced-colors:active) {
  .theme-choice[aria-pressed=true],.accent-choice[aria-pressed=true],.nav-link.active,.metronome-beat.on,.practice-beat.on {outline:2px solid Highlight}.accent-swatch {forced-color-adjust:none}.progress-fill {background:Highlight}
}

/* Practice profiles share the existing visual language, not instrument-colored skins. */
.profile-trigger{max-width:100%;min-height:44px;justify-content:space-between;padding:8px 12px;overflow:hidden;text-overflow:ellipsis}
.sidebar>.profile-trigger{margin:0 12px 12px;width:calc(100% - 24px);border:1px solid var(--border-strong)}
.profile-picker-list{display:flex;flex-direction:column;gap:8px}.profile-choice{justify-content:flex-start;min-height:44px}
.profile-choice[aria-pressed=true]{background:var(--accent-soft);color:var(--accent-text);border-color:var(--accent)}
.profile-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}
.profile-row:last-child{border-bottom:0}.profile-row>div{min-width:0}.profile-row .actions{flex-wrap:wrap;justify-content:flex-end;max-width:55%}
.profile-row strong{overflow-wrap:anywhere}.profiles-panel .button{min-height:44px}
.profile-picker-item{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;padding-bottom:6px;border-bottom:1px solid var(--border)}.profile-picker-item:last-of-type{border-bottom:0}
.compact-profile-note,.profile-session-pin{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin-bottom:12px}.profile-session-pin{margin-top:14px}
.profile-focus-group{border:0;padding:0;margin:0}.profile-focus-group legend{font-weight:600;margin-bottom:4px}.profile-focus-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px;margin-top:10px}.profile-focus-option{min-height:40px}
.profile-row-main{flex:1}.profile-row-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.profile-focus-tags{margin-top:8px}.historical-profile{border-left:2px solid var(--border-strong);padding-left:14px}.profiles-page .profiles-panel{margin-top:24px}.profile-stats .stat{min-width:0}.profile-history-note{margin-top:24px}.settings-profile-summary .actions{margin-top:12px}.history-toolbar .field{margin:0;min-width:180px}.history-toolbar .field select{width:100%;max-width:260px}
.plan-builder{display:flex;gap:12px;align-items:flex-end;margin:0 0 20px;flex-wrap:wrap}
.plan-builder .field{max-width:150px;margin:0}.plan-builder .field-hint{flex:1;min-width:160px;margin:0}
.protocol-editor{display:flex;flex-direction:column;gap:12px;border-block:1px solid var(--border);padding:16px 0}
.protocol-editor .field{margin:0}.protocol-editor .form-grid{margin:0}.protocol-editor [hidden]{display:none!important}
.key-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;border:0;padding:0;margin:0}
.key-options legend{margin-bottom:8px}.key-options .checkbox{min-height:44px;gap:6px}.key-options input{min-width:18px}
.protocol-task:empty{display:none}.protocol-task{padding:18px 0;margin:0;border-top:1px solid var(--border)}
.task-heading{font-size:14px;font-weight:600;margin:0 0 8px;color:var(--muted)}
.task-cue{font-size:clamp(18px,2.5vw,26px);line-height:1.35;font-weight:600;margin:0 0 8px;overflow-wrap:anywhere}
.task-actions{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 8px}.task-actions>.button{min-height:44px}
.task-feedback{font-size:13px;min-height:20px;margin:4px 0;color:var(--accent-text)}
.task-result{margin:4px 0 12px;overflow-wrap:anywhere}.note-answers{display:grid;grid-template-columns:repeat(6,minmax(44px,1fr));gap:6px;width:100%}
.note-answer{min-height:48px;padding:8px}.voice-safety{font-size:13px;line-height:1.55;border-left:2px solid var(--border-strong);padding:4px 0 4px 12px;color:var(--muted);margin:10px 0}
.without-tempo .practice-readouts{grid-template-columns:1fr}.practice-workspace [hidden]{display:none!important}
.protocol-summary{margin:20px 0}.metric-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px;row-gap:4px;padding:14px 0;border-bottom:1px solid var(--border)}
.metric-row>span{text-align:right;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.metric-row .field-hint{grid-column:1/-1;margin:0}
.block-cue:not(.sticking){font-size:12px;font-family:var(--font-ui);line-height:1.4;overflow-wrap:anywhere;color:var(--muted);margin:4px 0 0;max-width:55ch}
.library-toolbar{flex-wrap:wrap}.library-toolbar>select{min-width:120px}
@media(min-width:641px) and (max-width:1100px){.sidebar>.profile-trigger{padding:8px 4px;font-size:12px}.sidebar>.profile-trigger span{white-space:normal;overflow-wrap:anywhere}.profile-row{flex-direction:column}.profile-row .actions{max-width:100%;justify-content:flex-start}}
@media(max-width:640px){
 .topbar .profile-trigger{max-width:120px;font-size:12px;padding:6px;overflow-wrap:anywhere}.topbar .actions{gap:4px}
 .profile-row{flex-direction:column;gap:10px}.profile-row .actions{max-width:100%;justify-content:flex-start}
 .profile-focus-options{grid-template-columns:minmax(0,1fr)}.profile-picker-item{padding-bottom:8px}.history-toolbar .field{flex:1 1 100%;min-width:0}.history-toolbar .field select{max-width:none}
 .plan-builder{gap:8px}.plan-builder .field-hint{flex-basis:100%}
 .key-options{grid-template-columns:repeat(4,minmax(0,1fr))}
 .note-answers{grid-template-columns:repeat(4,minmax(44px,1fr))}
 .task-actions>.button{flex:1 1 auto;min-height:44px}.task-cue{font-size:20px}.protocol-task{padding:12px 0}
 .practice-route .practice-main-controls{position:fixed;z-index:20;bottom:0;left:0;right:0;display:flex;gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border);margin:0}
 .practice-route .practice-main-controls .button{flex:1 1 0;min-width:0;min-height:48px;padding:8px 6px;font-size:12px;white-space:normal}
 .practice-route .practice-main-controls .button svg{display:none}
 .practice-route .active-page{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
 .practice-route .practice-header{flex-wrap:wrap;gap:4px}.practice-route .practice-header .actions{gap:2px}.practice-route .practice-header .button{font-size:11px;padding:6px;min-height:44px}
 .practice-route .practice-header .button svg{display:none}
 .protocol-practice .practice-readouts{margin-bottom:8px}.protocol-practice .active-time{font-size:48px}
 .library-toolbar>select{flex:1 1 130px;min-width:0}.library-toolbar>.search-field{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){.protocol-task *{scroll-behavior:auto}}

.song-part-workspace{margin:0 0 24px;padding:16px 0;border-block:1px solid var(--border)}
.song-part-toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.song-part-toolbar .field{min-width:200px;flex:1}
.part-notes{padding-top:12px}.part-notes>p{margin-top:6px}.outcome-history{margin:12px 0;padding-left:20px}.outcome-history>li{padding:6px 0;font-size:13px;line-height:1.55}.session-profile{margin:8px 0 20px}
@media(max-width:640px){.song-part-toolbar .field{min-width:100%}.song-part-toolbar>.button{min-height:44px;flex:1}.outcome-history{font-size:12px}.song-part-workspace{margin-bottom:16px}}

.active-cues{padding:8px 0;border-top:1px solid var(--border)}
.active-cues>summary{min-height:44px;display:list-item;cursor:pointer;padding:12px 0;font-size:13px;color:var(--text)}
.active-cues>p{font-size:14px;line-height:1.6;padding:0 0 12px;max-width:65ch}

/* Practice transport remains usable from a music stand at every breakpoint. */
.practice-main-controls > .button {min-height:44px}
@media (min-width:641px) {
 .practice-main-controls{grid-template-columns:minmax(0,1.1fr) repeat(2,minmax(0,1fr))}
 .without-tempo .practice-main-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Guided learning: readable teaching, restrained layout, and preserved theme tokens. */
.learning-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid var(--border-strong);border-left:4px solid var(--accent);padding:20px;margin-bottom:24px;background:var(--surface)}
.learning-summary>div:first-child{min-width:0;flex:1}.learning-summary h2{font-size:18px}.learning-summary p{margin:6px 0}.learning-summary .progress-track{max-width:400px;margin-top:12px}.learning-summary>.actions{flex:0 1 auto}
.course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0}.course-card{display:flex;flex-direction:column;gap:14px;padding:22px;border:1px solid var(--border);background:var(--surface);min-width:0}.course-card h2{font-size:20px}.course-card>.progress-track{margin-top:auto}.course-card>.button{align-self:flex-start}
.learning-page .button,.learning-summary .button{min-height:44px;white-space:normal;text-align:center}.learning-footnote{color:var(--muted);font-size:13px;max-width:85ch}.course-overview{padding:22px 0;border-bottom:1px solid var(--border);display:grid;gap:14px}.course-overview ul{padding-left:22px;margin:0}.course-overview .progress-track{max-width:600px}.course-lesson-list{list-style:none;padding:0;margin:0}.course-lesson-list>li{display:flex;gap:16px;padding:12px 0;border-bottom:1px solid var(--border);min-width:0;align-items:flex-start}.lesson-number{font-family:var(--mono);color:var(--muted);font-size:13px;padding-top:12px}.course-lesson-list>li>div{min-width:0;flex:1}.course-lesson-link{display:block;min-height:44px;padding:10px 0;font-weight:550}.course-lesson-link[aria-current=page]{color:var(--accent-text);text-decoration:underline;text-underline-offset:4px}.course-sources{margin:24px 0;border-top:1px solid var(--border);padding-top:16px}.course-sources>summary,.lesson-outline>summary{min-height:44px;cursor:pointer;padding:10px 0;font-weight:600}.course-sources p{margin:12px 0;font-size:13px;line-height:1.65}.course-sources a{text-decoration:underline;text-underline-offset:3px}.lesson-layout{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:36px;align-items:start}.lesson-layout>aside{position:sticky;top:24px;min-width:0}.lesson-outline .course-lesson-list>li{gap:8px;padding:8px 0}.lesson-outline .course-lesson-link{font-size:13px}.lesson-outline .muted{font-size:12px}.lesson-body{min-width:0;max-width:78ch}.lesson-body>section{margin-bottom:30px}.lesson-body h2{font-size:21px;margin-bottom:12px}.lesson-body h3{font-size:16px;margin-top:16px}.lesson-body p{line-height:1.75;margin:10px 0;font-size:16px}.lesson-body p.field-hint{font-size:13px}.lesson-state{display:inline-block;padding:5px 12px;background:var(--accent-soft);color:var(--accent-text);font-size:13px!important;margin:0 0 24px!important}.lesson-example{border-left:3px solid var(--accent);padding:20px;background:var(--surface-soft)}.lesson-score{font:14px/1.85 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;margin:14px 0;max-width:100%}.score-scroll{overflow-x:auto;max-width:100%;padding:4px 0}.lesson-rhythm{border-collapse:collapse;width:max-content;min-width:100%;font:13px/1.5 var(--mono)}.lesson-rhythm caption{text-align:left;font-family:inherit;font-size:12px;padding:8px 0;max-width:65ch;white-space:normal}.lesson-rhythm td,.lesson-rhythm th{padding:8px;border:1px solid var(--border-strong);text-align:center}.lesson-rhythm th[scope=row]{text-align:left;font-family:inherit}.lesson-chords{display:flex;flex-wrap:wrap;gap:14px;margin:16px 0}.lesson-chord{min-width:0;max-width:100%;padding:10px;border:1px solid var(--border-strong);background:var(--surface)}.lesson-chord figcaption{font-weight:600;margin-bottom:8px}.lesson-chord table{font:13px/1.5 var(--mono);border-collapse:collapse;width:100%}.lesson-chord th,.lesson-chord td{padding:8px 7px;text-align:center;min-width:24px;border-bottom:1px solid var(--border)}.lesson-keyboard{display:flex;margin-top:18px;max-width:420px;min-height:76px;border:1px solid var(--border-strong)}.lesson-key{flex:1;min-width:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;border-right:1px solid var(--border-strong);background:var(--surface);font-size:12px;color:var(--text)}.lesson-key.accidental{align-self:flex-start;min-height:48px;background:var(--text);color:var(--surface)}.lesson-key.used{box-shadow:inset 0 -5px var(--accent)}.lesson-task{padding:14px 0;border-bottom:1px solid var(--border)}.lesson-guided>.actions{margin-top:18px}.lesson-adjustments{padding-top:20px;border-top:1px solid var(--border)}.lesson-assessment{border:1px solid var(--border-strong);padding:20px}.lesson-assessment ul{padding-left:22px;line-height:1.75}.latest-lesson-review{margin-top:20px;border-top:1px solid var(--border);padding-top:6px}.latest-lesson-review>p{font-size:14px}.lesson-checks{border:1px solid var(--border);padding:14px;min-width:0}.lesson-checks .checkbox{margin:12px 0;align-items:flex-start;min-height:44px}.lesson-checks legend{font-weight:600;padding:0 6px}.off-app-evidence{display:grid;gap:12px;margin:12px 0;padding:14px;background:var(--surface-soft)}.learning-safety{border-left:3px solid var(--warning);background:var(--surface-soft);padding:14px;margin:16px 0;font-size:14px;line-height:1.7}.lesson-pagination{display:flex;justify-content:space-between;gap:12px;margin:30px 0}.lesson-setup-tasks{padding-left:22px;line-height:1.65;margin:12px 0}.lesson-setup-tasks>li{margin:12px 0}.lesson-setup-tasks p{font-size:14px}.reference-root{display:flex;gap:14px;align-items:center}.reference-root input{max-width:100px}.learning-placement{background:var(--surface-soft);padding:14px;line-height:1.65}
@media(max-width:1200px){.course-grid{grid-template-columns:1fr}.course-card h2{font-size:19px}.lesson-layout{grid-template-columns:minmax(0,1fr) 210px;gap:24px}}
@media(max-width:960px){.lesson-layout{display:flex;flex-direction:column}.lesson-layout>aside{position:static;order:-1;width:100%}.lesson-outline>.course-lesson-list{max-height:250px;overflow-y:auto;padding:0 6px}.lesson-outline{border:1px solid var(--border);padding:0 14px}.lesson-body{max-width:100%}.learning-summary{align-items:flex-start;flex-direction:column}.learning-summary>.actions{width:100%}}
@media(max-width:560px){.learning-summary{padding:16px;gap:10px}.learning-summary h2{font-size:17px}.learning-summary .actions{align-items:stretch}.learning-summary .button{flex:1 1 130px}.course-card{padding:18px}.lesson-example,.lesson-assessment{padding:14px}.lesson-body p{font-size:15px}.lesson-body h2{font-size:19px}.lesson-score{font-size:12px}.lesson-guided>.actions{flex-direction:column;align-items:stretch}.lesson-chord th,.lesson-chord td{padding:7px 5px}.lesson-outline>.course-lesson-list{max-height:200px}.lesson-pagination{flex-wrap:wrap}.lesson-pagination>.button{flex:1}.lesson-key{font-size:10px}}
@media print{.lesson-layout{display:block}.lesson-layout>aside,.lesson-pagination,.lesson-body .actions,.lesson-body button{display:none}.lesson-body{max-width:none}.lesson-score{white-space:pre-wrap}}