/* Songward — Editorial Songbook. Presentation only;
legacy surfaces keep their controllers. */
:root.songbook {
  --book-page:#f4f0e6;
  --book-spine:#eae6da;
  --book-ink:#292b27;
  --book-muted:#686c60;
  --book-rule:#d0ccbf;
  --book-red:#a54636;
  --book-serif:Baskerville,"Times New Roman",serif;
  --book-ui:"Helvetica Neue",Arial,sans-serif;
  --book-gutter:clamp(24px,3.6vw,52px);
  --book-motion:160ms;
  --bg:var(--book-page);
  --panel:var(--book-page);
  --panel-2:var(--book-spine);
  --text:var(--book-ink);
  --muted:var(--book-muted);
  --line:var(--book-rule);
  --brand:var(--book-red);
  --brand-hover:#87392d;
  --brand-strong:var(--book-red);
  --brand-ink:var(--book-red);
  --brand-soft:var(--book-spine);
  --success:#526748;
  --success-strong:#40563a;
  --danger:#a54636;
  --record-accent:var(--book-red);
  --shadow:none;
  --library-surface:var(--book-page);
  --library-row-surface:transparent;
  --library-row-hover:var(--book-spine);
  --performance-bg:var(--book-page);
  color-scheme:light
}
:root.songbook:not(.light) {
  --book-page:#222620;
  --book-spine:#2c312a;
  --book-ink:#f1ecdf;
  --book-muted:#b6b9a9;
  --book-rule:#4b5145;
  --book-red:#e2a18d;
  --brand-hover:#f0b6a5;
  --success:#869a79;
  --success-strong:#b7c9a9;
  color-scheme:dark
}
body {
  background:var(--book-page);
  font-family:var(--book-ui);
  font-weight:400
}
body::before,body::after {
  display:none
}
h1,h2,h3,h4,p {
  overflow-wrap:break-word
}
button,input,select,textarea {
  font-family:var(--book-ui)
}
body:not(.focus-mode-open) button {
  font-weight:500!important;
  transition:background var(--book-motion),color var(--book-motion);
  box-shadow:none!important
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
  outline:2px solid var(--book-red);
  outline-offset:4px
}
button:disabled {
  opacity:.45;
  cursor:not-allowed
}
button.primary,.primary {
  background:var(--book-red);
  color:var(--book-page);
  border-color:var(--book-red);
  border-radius:3px;
  box-shadow:none
}
.secondary,.mini-button,.step-button,.icon-button {
  background:transparent;
  border:1px solid var(--book-rule);
  border-radius:3px;
  box-shadow:none;
  color:var(--text)
}
input,select,textarea {
  background:var(--book-page);
  border:1px solid var(--book-rule);
  color:var(--book-ink);
  border-radius:2px;
  max-width:100%
}
input[type=range] {
  accent-color:var(--book-red)
}
.eyebrow,.book-running {
  font:500 10px/1.7 var(--book-ui);
  text-transform:uppercase;
  letter-spacing:1.6px;
  color:var(--book-muted)
}
.hidden {
  display:none!important
}
.app-shell {
  display:grid;
  grid-template-columns:184px minmax(0,1fr);
  gap:0;
  width:100%;
  max-width:none;
  margin:0;
  min-height:100vh;
  padding:0
}
.app-sidebar {
  position:sticky;
  top:0;
  height:100vh;
  overflow:auto;
  padding:36px 24px;
  background:var(--book-spine);
  border:0;
  border-radius:0;
  box-shadow:none;
  display:flex;
  flex-direction:column
}
.brand-block {
  padding:0;
  border:0;
  background:none
}
.book-brand {
  font:30px/1 var(--book-serif);
  letter-spacing:-1.5px;
  text-decoration:none;
  color:var(--text)
}
.book-edition {
  font-size:10px;
  line-height:1.9;
  letter-spacing:1.4px;
  text-transform:uppercase;
  color:var(--muted);
  margin:18px 0 36px
}
.book-edition span {
  display:block;
  color:var(--book-red);
  font-size:9px
}
.app-nav {
  gap:24px
}
.nav-section {
  gap:10px
}
.nav-item,.nav-item.active {
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  padding:10px 0;
  min-height:40px;
  font-size:13px;
  text-align:start;
  color:var(--book-muted)
}
.nav-item::before {
  display:none
}
.nav-item.active {
  color:var(--book-red);
  text-decoration:underline;
  text-underline-offset:7px
}
.nav-section-title {
  font:italic 24px/1.3 var(--book-serif);
  font-weight:400;
  color:var(--text);
  padding:18px 0 8px;
  border-top:1px solid var(--book-rule);
  margin-top:12px;
  white-space:normal
}
/* Hebrew sidebar titles stay upright; English song titles retain the editorial italic. */
.nav-section-title[data-hebrew-sidebar-title] {
  font-style:normal;
}
.song-tool-item {
  margin:0
}
.book-signoff {
  font-size:11px;
  line-height:1.8;
  color:var(--muted);
  margin-top:auto;
  padding-top:40px
}
.workspace {
  min-width:0;
  border:0;
  border-radius:0;
  padding:30px var(--book-gutter);
  background:none;
  box-shadow:none
}
.workspace-topbar {
  position:relative;
  background:none;
  border:0;
  border-radius:0;
  padding:0 0 26px;
  margin-bottom:26px;
  align-items:start
}
.workspace-topbar::before,.workspace-topbar::after {
  display:none
}
.workspace-topbar>div {
  width:100%;
  min-width:0
}
.workspace-topbar .eyebrow {
  border-bottom:1px solid var(--book-ink);
  padding:0 90px 20px 0;
  margin:0 0 25px
}
.workspace-topbar h2 {
  font:400 57px/1.1 var(--book-serif);
  letter-spacing:-1.7px
}
.song-status-summary {
  font-size:12px;
  font-weight:400;
  line-height:1.6;
  margin-top:12px;
  color:var(--muted)
}
#themeToggle {
  position:absolute;
  inset-inline-end:0;
  top:0;
  width:32px;
  height:28px;
  min-height:28px;
  border:0
}
.app-view {
  min-width:0
}
.status-panel,.stems-panel,.mixer-panel {
  box-shadow:none
}
body[data-view=learn] .stems-panel,body[data-view=learn] .mixer-panel,body[data-view=learn] .song-view,body[data-view=learn] .learning-panel {
  margin:0;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none
}
body[data-view=learn] .learning-panel::before {
  display:none
}
.empty-state,.learning-status {
  font-size:13px;
  line-height:1.7;
  color:var(--muted)
}
/* Contents spread. Existing actions and filters are retained. */
body[data-view=library] .workspace-topbar {
  padding:0;
  margin:0 0 26px
}
body[data-view=library] .workspace-topbar h2 {
  display:none
}
.library-panel {
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none
}
.library-panel .panel-head {
  margin:0 0 25px;
  padding:0;
  align-items:end
}
.library-panel h2 {
  font:400 57px/1.1 var(--book-serif);
  letter-spacing:-1.7px
}
.library-panel .panel-head p {
  font-size:12px;
  color:var(--muted);
  margin-top:12px
}
.library-toolbar {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  padding:0 0 26px;
  margin:0;
  background:none;
  border:0
}
.library-search {
  flex:1;
  min-width:180px
}
.library-search input {
  border:0;
  border-bottom:1px solid var(--book-rule);
  border-radius:0;
  background:transparent;
  padding:10px 0
}
.library-search>span {
  display:none
}
.library-toolbar select {
  width:auto;
  font-size:11px;
  padding:10px 22px 10px 8px
}
.library-refresh-button {
  font-size:11px
}
.book-library-spread {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,1fr);
  gap:clamp(28px,4.5vw,66px);
  align-items:start
}
.library-list {
  display:block;
  counter-reset:repertoire
}
.library-song-row {
  position:relative;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) minmax(130px,220px) 28px 30px;
  gap:12px;
  align-items:start;
  background:none;
  border:0;
  border-top:1px solid var(--book-rule);
  border-radius:0;
  box-shadow:none;
  padding:17px 0;
  min-width:0;
  cursor:pointer
}
.library-song-row:hover,.library-song-row:focus-visible {
  background:var(--book-spine);
  transform:none
}
.library-song-row::before {
  left:-12px;
  right:auto
}
.library-song-row.is-favorite::before {
  background:var(--warm-accent)
}
.book-song-index {
  grid-column:1;
  grid-row:1;
  font:italic 16px var(--book-serif);
  color:var(--muted);
  padding-top:4px
}
.library-song-row .song-artwork {
  display:none
}
.library-song-main {
  grid-column:2;
  grid-row:1;
  min-width:0
}
.library-song-main strong {
  text-align:left;
  display:block;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  font:400 24px/1.2 var(--book-serif);
  letter-spacing:-.4px
}
.library-song-main small {
  text-align:left;
  font-size:11px;
  font-weight:400;
  white-space:normal;
  line-height:1.5;
  margin:5px 0
}
.library-song-meta {
  gap:5px 10px;
  flex-wrap:wrap;
  font-size:10px;
  line-height:1.6
}
.song-status {
  padding:0;
  border:0;
  background:none;
  font-weight:400;
  color:var(--muted)
}
.library-song-practice {
  display:none
}
.library-song-tags {
  grid-column:3;
  grid-row:1;
  justify-self:end;
  align-self:center;
  display:flex;
  min-width:0;
  max-width:220px;
  overflow:hidden;
  color:var(--muted);
  font-size:10px;
  line-height:1.4;
  white-space:nowrap
}
.library-song-tags span { overflow:hidden; text-overflow:ellipsis }
.library-song-tags .tag-separator {
  flex:none;
  min-width:1.25em;
  overflow:visible;
  color:var(--text);
  font-family:Arial,sans-serif;
  font-size:12px;
  font-weight:700;
  text-align:center
}
.library-song-tags .tag-more { flex:none }
.favorite-button {
  grid-column:4;
  grid-row:1;
  width:28px;
  min-width:0;
  height:32px;
  background:none;
  padding:0;
  color:var(--muted);
  font-size:18px
}
.library-overflow {
  grid-column:5;
  grid-row:1
}
.overflow-button {
  width:30px;
  min-width:0;
  padding:0;
  height:32px
}
.library-menu {
  background:var(--book-page);
  border:1px solid var(--book-rule);
  box-shadow:none;
  z-index:5;
  min-width:190px
}
.library-tags-editor { border-top:1px solid var(--book-rule); margin-top:6px; padding-top:8px }
.library-tags-title { margin:0 0 5px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em }
.library-tags-choices { display:grid; gap:3px; max-height:150px; overflow:auto }
.library-tags-choices label { display:flex; gap:6px; align-items:center; padding:3px 0; font-size:11px; cursor:pointer }
.library-tags-choices input { width:auto; margin:0 }
.library-tags-empty { color:var(--muted); font-size:11px }
.library-tag-create { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px; margin-top:8px }
.library-tag-create input { min-width:0; height:28px; padding:4px 6px; font-size:11px }
.library-tag-create button { min-width:0; height:28px; padding:4px 8px; font-size:11px }
.book-library-stand {
  position:sticky;
  top:32px;
  border-inline-start:1px solid var(--book-rule);
  padding-inline-start:40px;
  min-width:0
}
.book-library-stand h3 {
  text-align:start;
  font:400 52px/1.15 var(--book-serif);
  letter-spacing:-1px;
  margin:22px 0 12px
}
.book-artist {
  font-size:12px;
  color:var(--muted)
}
.book-stand-lyrics,.book-excerpt {
  font:400 29px/1.65 var(--book-serif);
  white-space:pre-line;
  margin:38px 0 28px;
  text-align:start;
  overflow-wrap:anywhere
}
.book-note {
  font:italic 19px/1.55 var(--book-serif);
  color:var(--book-red);
  border-inline-start:2px solid var(--book-red);
  padding-inline-start:20px;
  margin:28px 0;
  max-width:40ch
}
/* Keep a Hebrew stand's annotation on the same reading edge as its title and lyrics. */
.book-library-stand:has(.book-stand-lyrics[dir="rtl"]) .book-note[dir="rtl"] {
  margin-left:auto;
  text-align:start
}
.book-open-song {
  display:flex;
  justify-content:space-between;
  width:100%;
  background:none;
  border:0;
  border-bottom:1px solid var(--book-red);
  border-radius:0;
  color:var(--book-red);
  padding:18px 0;
  font-size:13px;
  margin:20px 0
}
.book-library-stand>.book-running:last-child {
  font-size:9px;
  letter-spacing:.7px
}
/* Annotated learning spread;
all four original routes are the same functional buttons. */
.learning-route-section {
  margin:0 0 28px;
  padding:0;
  background:none;
  border:0
}
.learning-route-head {
  margin:0 0 24px
}
.learning-route-head h3 {
  font:500 10px var(--book-ui);
  letter-spacing:1.7px;
  text-transform:uppercase;
  color:var(--muted)
}
.learning-route-head>p {
  display:none
}
.book-learning-spread {
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:45px
}
.book-learning-excerpt {
  padding-inline-end:34px;
  border-inline-end:1px solid var(--book-rule)
}
.book-learning-excerpt .book-excerpt {
  margin-top:25px;
  font-size:28px
}
.book-learning-excerpt>small {
  font-size:11px;
  color:var(--muted)
}
.learning-route-grid {
  display:block;
  counter-reset:route
}
.learning-route-card {
  position:relative;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:7px 15px;
  padding:24px 0;
  border:0;
  border-top:1px solid var(--book-rule);
  border-radius:0;
  background:none;
  box-shadow:none;
  min-height:132px;
  counter-increment:route
}
.learning-route-card::before {
  content:counter(route,upper-roman);
  grid-column:1;
  grid-row:1/4;
  font:italic 20px var(--book-serif);
  color:var(--book-red);
  padding-top:4px
}
.learning-route-icon {
  display:none
}
.learning-route-card h4 {
  font:400 30px/1.15 var(--book-serif);
  letter-spacing:-.5px;
  grid-column:2;
  margin:0
}
.learning-route-card p {
  grid-column:2;
  font-size:12px;
  font-weight:400;
  line-height:1.5;
  min-height:0;
  margin:0;
  color:var(--muted)
}
.learning-route-card .learning-route-action {
  grid-column:2;
  justify-self:start;
  background:none;
  border:0;
  border-radius:0;
  color:var(--book-red);
  font-size:11px;
  padding:5px 0;
  min-height:30px;
  margin:0;
  text-align:start
}
.learning-route-action::after {
  content:' ↗';
  margin-inline-start:9px
}
.learning-route-action:focus-visible {
  outline-offset:3px
}
.learning-overview .learning-section-editor summary {
  display:block;
  min-height:40px;
  padding:12px 0;
  border:0;
  border-top:1px solid var(--book-rule);
  border-radius:0;
  background:none;
  font-size:12px
}
.learning-overview .learning-section-editor summary::before,.learning-overview .learning-section-editor summary::after {
  display:none
}
.learning-overview .learning-section-editor {
  opacity:1
}
.learning-section-detection-card {
  border-radius:0;
  box-shadow:none;
  background:none
}
/* Practice page retains existing cue/hint/answer semantics. */
.learning-header {
  margin-bottom:24px;
  gap:15px;
  flex-wrap:wrap
}
.learning-header h2 {
  font:400 28px/1.2 var(--book-serif)!important
}
.learning-header p {
  font-size:12px;
  font-weight:400
}
.learning-header-actions {
  gap:10px
}
.learning-header-actions button {
  font-size:12px
}
.learning-layout,.learning-manual.learning-single-section .learning-layout {
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  gap:38px;
  align-items:start
}
.learning-sections,.learning-manual.learning-single-section .learning-sections {
  min-width:0;
  width:auto;
  padding:0 25px 0 0;
  margin:0;
  border:0;
  border-inline-end:1px solid var(--book-rule)
}
.learning-sections h3 {
  font-size:10px;
  letter-spacing:1.4px;
  font-weight:500;
  color:var(--muted)
}
.learning-section-select-wrap {
  font-size:11px
}
.learning-section-select-wrap select {
  width:100%;
  font-size:12px
}
.learning-section-list {
  max-height:270px;
  overflow:auto;
  margin-top:20px
}
.learning-section-button {
  border:0;
  border-bottom:1px solid var(--book-rule);
  border-radius:0;
  background:none;
  padding:13px 0;
  text-align:start;
  box-shadow:none
}
.learning-section-button.active {
  color:var(--book-red);
  background:none;
  border-color:var(--book-red)
}
.learning-section-meta strong {
  font:400 17px var(--book-serif)
}
.learning-section-meta em,.learning-section-button>span:last-child {
  font-size:10px;
  font-weight:400
}
.learning-section-editor {
  font-size:12px
}
.learning-stage,.learning-guided .learning-stage {
  min-width:0;
  min-height:0;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:21px;
  background:none;
  border:0;
  border-radius:0
}
.book-practice-context {
  font:24px/1.4 var(--book-serif);
  color:var(--muted);
  white-space:pre-line;
  order:2
}
.learning-stage-top {
  width:100%;
  font-size:10px;
  letter-spacing:1px;
  font-weight:400;
  text-transform:uppercase;
  order:0
}
.learning-stage>.learning-option-group {
  width:100%;
  justify-items:start;
  order:1
}
.learning-mode-row {
  border:0;
  border-radius:0;
  background:none;
  padding:0;
  justify-content:start
}
.learning-mode-row button {
  font-size:11px;
  padding:8px 12px;
  min-height:36px
}
.learning-mode-row .mini-button.active {
  background:none;
  color:var(--book-red);
  border:0;
  border-bottom:1px solid var(--book-red);
  border-radius:0
}
.learning-playback-practice-row {
  justify-content:start
}
.learning-playback-practice-button {
  font-size:15px;
  padding:8px 0!important;
  border:0;
  background:none;
  color:var(--book-red)
}
.learning-cue,.learning-guided .learning-cue {
  order:3;
  display:block;
  width:100%;
  min-height:130px;
  padding:12px 0 18px;
  background:none;
  border:0;
  border-radius:0;
  text-align:start;
  font:400 clamp(38px,4.7vw,66px)/1.2 var(--book-serif);
  white-space:normal;
  overflow-wrap:anywhere
}
.learning-transition-prompt {
  text-align:start;
  width:100%;
  align-items:start;
  justify-items:start
}
.learning-transition-prompt small {
  font:400 10px/1.6 var(--book-ui);
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--muted)
}
.learning-transition-prompt strong {
  font:inherit;
  font-weight:400;
  display:block;
  line-height:1.2;
  margin-top:14px
}
.learning-transition-prompt p {
  font:400 28px/1.5 var(--book-serif);
  color:var(--muted)
}
.learning-cue[data-direction=rtl],.learning-cue[data-direction=rtl] .learning-transition-prompt {
  text-align:right;
  direction:rtl
}
.learning-guided-actions {
  order:4;
  justify-content:start
}
.learning-self-score {
  order:5;
  justify-content:start
}
.learning-guided-actions button,.learning-self-score button {
  font-size:12px;
  min-width:0!important;
  padding:13px 19px
}
.learning-manual .learning-guided-actions .secondary {
  background:none;
  border-color:var(--book-rule);
  color:var(--book-red)
}
.learning-practice-options {
  order:6;
  width:100%;
  border:0;
  border-top:1px solid var(--book-rule);
  border-radius:0;
  background:none;
  padding:14px 0;
  margin:0;
  font-size:12px
}
.learning-nav-row {
  order:7;
  width:100%!important;
  justify-content:space-between
}
.learning-status {
  order:8;
  text-align:start;
  max-width:65ch
}
.learning-self-score:empty {
  display:none
}
.learning-complete .learning-cue {
  font-family:var(--book-ui);
  font-size:16px
}
.learning-complete .learning-stage {
  min-height:0;
  padding:24px;
  background:none
}
.book-practice-context:empty {
  display:none
}
/* Living folio: scrollable score, no duplicate player, no hidden lyric data. */
.focus-mode-overlay {
  background:var(--book-page);
  color:var(--text);
  padding:30px clamp(24px,4.6vw,66px);
  gap:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto auto;
  overflow:auto
}
.focus-mode-overlay::before,.focus-mode-overlay::after,.focus-mode-topbar::after,.focus-mode-controls::before {
  display:none!important
}
.focus-mode-topbar {
  border:0;
  padding:0 0 24px;
  align-items:start;
  gap:20px
}
.focus-mode-topbar>div {
  flex:1;
  min-width:0
}
.focus-mode-topbar span {
  display:block;
  font:400 10px/1.6 var(--book-ui);
  letter-spacing:1.7px;
  color:var(--text);
  border-bottom:1px solid var(--text);
  padding-bottom:23px;
  margin-bottom:27px
}
.focus-mode-topbar h2 {
  font:400 32px/1.2 var(--book-serif);
  margin:0 0 10px
}
.focus-mode-topbar p {
  font-size:11px;
  font-weight:400;
  color:var(--muted);
  line-height:1.7;
  max-width:95ch
}
.focus-exit-button {
  margin-top:69px;
  background:none;
  border:0;
  color:var(--text);
  font-size:12px;
  min-height:40px
}
.book-focus-spread {
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  gap:48px;
  min-height:0;
  margin-top:12px
}
.book-focus-folio {
  padding:65px 0 0 48px
}
.book-folio-number {
  font:italic 58px/1 var(--book-serif);
  color:var(--book-red)
}
.book-focus-folio p {
  font-size:12px;
  margin-top:24px;
  margin-bottom:6px
}
.book-focus-folio small {
  font-size:11px;
  color:var(--muted)
}
.book-focus-folio .book-running {
  display:block;
  margin-top:34px;
  color:var(--book-red);
  font-size:9px
}
.focus-lyrics-display {
  display:block;
  min-width:0;
  padding:35px 0 100px 40px;
  border-inline-start:1px solid var(--book-rule);
  mask-image:none;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  overflow:auto;
  overscroll-behavior:contain
}
.focus-lyrics-display .lyric-line,.focus-mode-overlay.focus-playback-practice .focus-lyrics-display .lyric-line {
  max-width:100%;
  margin:0;
  padding:18px 10px 18px 0;
  border:0;
  border-radius:0;
  text-align:start;
  color:var(--muted);
  background:none;
  font:400 clamp(25px,2.3vw,32px)/1.5 var(--book-serif);
  box-shadow:none;
  text-shadow:none;
  transition:color var(--book-motion);
  white-space:normal
}
.focus-lyrics-display .lyric-line.active,.focus-mode-overlay.focus-playback-practice .focus-lyrics-display .lyric-line.active,body.recording-active .focus-lyrics-display .lyric-line.active {
  background:none;
  box-shadow:none;
  text-shadow:none;
  color:var(--text);
  font:400 clamp(42px,5.2vw,74px)/1.16 var(--book-serif);
  border-inline-start:3px solid var(--book-red);
  padding-inline-start:25px;
  max-width:19ch;
  margin:12px 0 14px -28px;
  transform:none;
  letter-spacing:-1.5px
}
.focus-lyrics-display .lyric-line::before,.focus-lyrics-display .lyric-line::after {
  display:none
}
.book-focus-guidance {
  margin:22px 0 30px 278px;
  font:italic 19px/1.5 var(--book-serif);
  color:var(--book-red);
  max-width:80ch
}
.focus-mode-controls,body.recording-active .focus-mode-controls {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  background:none;
  border:0;
  border-top:1px solid var(--book-rule);
  border-radius:0;
  box-shadow:none;
  padding:22px 0 0;
  min-height:90px
}
.focus-mode-controls .transport-button {
  flex:none;
  width:36px;
  height:36px;
  background:none;
  border:0;
  border-radius:50%;
  box-shadow:none
}
.focus-mode-controls .focus-play {
  width:48px;
  height:48px;
  background:var(--book-red);
  color:var(--book-page)
}
.focus-mode-controls input[type=range] {
  flex:1;
  min-width:100px;
  width:auto;
  order:4
}
.focus-mode-controls #focusTime {
  order:3;
  font-size:11px;
  min-width:80px;
  font-weight:400
}
.focus-mode-controls #focusGuideVocalButton {
  order:5;
  font-size:11px;
  border:0;
  white-space:nowrap;
  background:none;
  color:var(--text)
}
.focus-mode-controls .focus-tempo-control {
  order:6;
  font-size:11px;
  gap:6px;
  white-space:nowrap
}
.focus-tempo-control .step-button {
  width:30px;
  height:32px;
  min-height:32px;
  border:0;
  background:none
}
.focus-tempo-control strong {
  font-weight:500
}
.focus-mode-controls .focus-record-button {
  order:7;
  min-height:42px;
  padding:10px;
  font-size:12px;
  background:none;
  border:0;
  color:var(--book-red);
  box-shadow:none
}
.focus-record-button span {
  background:var(--book-red)
}
.focus-record-button.recording {
  background:var(--danger-soft);
  border:1px solid var(--book-red)
}
.focus-mode-overlay[data-direction=rtl] .book-focus-spread {
  direction:rtl
}
.focus-mode-overlay[data-direction=rtl] .focus-lyrics-display {
  padding:35px 40px 100px 0
}
.focus-mode-overlay[data-direction=rtl] .lyric-line {
  text-align:right
}
.focus-mode-overlay[data-direction=rtl] .lyric-line.active {
  margin:12px -28px 14px 0
}
.focus-mode-overlay[data-direction=rtl] .book-focus-folio {
  padding:65px 48px 0 0;
  text-align:right
}
.focus-mode-overlay[data-direction=rtl] .book-focus-guidance {
  margin:22px 278px 30px 0
}
@media(max-width:1150px) {
  .app-shell {
    grid-template-columns:160px minmax(0,1fr)
  }
  .app-sidebar {
    padding:28px 18px
  }
  .book-brand {
    font-size:27px
  }
  .book-library-spread {
    grid-template-columns:minmax(0,1fr) minmax(230px,.8fr);
    gap:28px
  }
  .book-library-stand {
    padding-inline-start:24px
  }
  .book-library-stand h3 {
    font-size:42px
  }
  .book-stand-lyrics,.book-excerpt {
    font-size:25px
  }
  .book-learning-spread {
    gap:25px;
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)
  }
  .book-learning-excerpt {
    padding-inline-end:22px
  }
  .learning-route-card h4 {
    font-size:26px
  }
  .learning-layout,.learning-manual.learning-single-section .learning-layout {
    grid-template-columns:190px minmax(0,1fr);
    gap:25px
  }
  .book-focus-spread {
    grid-template-columns:145px minmax(0,1fr);
    gap:25px
  }
  .book-focus-folio {
    padding-inline-start:12px
  }
  .book-focus-guidance {
    margin-inline-start:210px
  }
  .focus-mode-overlay[data-direction=rtl] .book-focus-guidance {
    margin-inline:0 210px
  }
  .focus-mode-controls {
    gap:7px
  }
  .focus-mode-controls input[type=range] {
    min-width:100px
  }
  .focus-mode-controls .focus-record-button {
    padding:8px
  }
  .focus-mode-topbar {
    padding-bottom:12px
  }
}
@media(max-width:900px) {
  .app-shell {
    grid-template-columns:138px minmax(0,1fr)
  }
  .workspace {
    padding:24px
  }
  .app-sidebar {
    padding:25px 14px
  }
  .book-brand {
    font-size:24px
  }
  .workspace-topbar h2,.library-panel h2 {
    font-size:46px
  }
  .book-library-spread {
    grid-template-columns:1fr
  }
  .book-library-stand {
    position:static;
    border:0;
    border-top:1px solid var(--book-rule);
    padding:24px 0;
    grid-row:1
  }
  .book-library-stand .book-stand-lyrics {
    margin:18px 0;
    font-size:24px
  }
  .book-library-stand .book-note {
    display:none
  }
  .book-learning-spread {
    grid-template-columns:1fr
  }
  .book-learning-excerpt {
    border:0;
    border-bottom:1px solid var(--book-rule);
    padding-bottom:22px
  }
  .book-learning-excerpt .book-excerpt {
    margin:16px 0;
    font-size:25px
  }
  .book-learning-excerpt .book-note {
    font-size:17px;
    margin:14px 0
  }
  .learning-layout,.learning-manual.learning-single-section .learning-layout {
    grid-template-columns:1fr
  }
  .learning-sections {
    border:0;
    padding:0
  }
  .learning-section-list {
    display:none
  }
  .learning-section-editor {
    margin-top:12px
  }
  .learning-cue {
    font-size:48px
  }
  .focus-mode-controls input[type=range] {
    flex-basis:30%;
    order:8
  }
  .focus-mode-controls .focus-tempo-control {
    margin-inline-start:auto
  }
  .focus-mode-controls #focusTime {
    order:9
  }
  .book-focus-spread {
    grid-template-columns:115px minmax(0,1fr);
    gap:18px
  }
  .focus-lyrics-display {
    padding-inline-start:25px
  }
  .book-focus-folio {
    padding:40px 0 0
  }
  .book-folio-number {
    font-size:48px
  }
  .book-focus-guidance {
    margin:16px 0 20px 158px;
    font-size:17px
  }
  .focus-mode-overlay[data-direction=rtl] .book-focus-guidance {
    margin:16px 158px 20px 0
  }
  .focus-mode-topbar p {
    font-size:10px
  }
  .focus-mode-topbar h2 {
    font-size:28px
  }
}
@media(max-width:620px) {
  .app-shell {
    display:block
  }
  .app-sidebar {
    position:static;
    height:auto;
    padding:20px 22px
  }
  .brand-block {
    display:flex;
    align-items:center;
    justify-content:space-between
  }
  .book-edition {
    margin:0;
    font-size:8px
  }
  .app-nav {
    display:flex;
    flex-wrap:wrap;
    gap:10px
  }
  .nav-section {
    display:flex;
    flex-wrap:wrap;
    gap:12px
  }
  .nav-section-title {
    width:100%;
    margin:0;
    padding:12px 0 0
  }
  .book-signoff {
    display:none
  }
  .nav-item {
    padding:8px 0
  }
  .workspace {
    padding:22px
  }
  .library-toolbar {
    gap:8px
  }
  .library-search {
    flex-basis:100%
  }
  .book-focus-spread {
    grid-template-columns:68px minmax(0,1fr);
    gap:12px
  }
  .focus-mode-overlay {
    padding:20px
  }
  .book-focus-folio .book-running {
    display:none
  }
  .book-focus-folio small {
    font-size:10px
  }
  .focus-lyrics-display .lyric-line.active {
    font-size:38px;
    letter-spacing:-.7px
  }
  .focus-lyrics-display .lyric-line {
    font-size:23px
  }
  .book-focus-guidance {
    margin:15px 0 15px 100px
  }
  .focus-mode-topbar span {
    font-size:8px;
    letter-spacing:1px
  }
  .focus-exit-button {
    font-size:11px;
    padding:8px;
    margin-top:56px
  }
  .focus-mode-controls {
    padding-top:12px
  }
  .focus-mode-controls .focus-tempo-control {
    margin:0
  }
  .focus-mode-controls input[type=range] {
    min-width:160px
  }
  .learning-header-actions {
    flex-wrap:wrap
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}
/* Remove legacy icon columns and stage overlays from the editorial shell. */
.workspace {
  overflow:visible
}
.workspace::before,.workspace::after {
  display:none
}
.nav-item {
  display:block
}
.nav-item span {
  display:block;
  width:auto;
  white-space:normal;
  overflow:visible;
  text-overflow:clip
}
.library-search {
  display:block;
  padding:0;
  background:none;
  border:0;
  border-radius:0
}
.library-search input {
  width:100%;
  height:42px;
  font-size:12px;
  font-weight:400
}
.library-song-main {
  display:block
}
.library-song-row {
  padding:14px 0
}
.library-song-main small {
  display:block;
  margin:5px 0
}
.library-song-meta {
  margin-top:6px;
  font-weight:400
}
.library-song-meta span {
  font-weight:400
}
.library-song-meta span+span::before {
  display:none
}
.library-song-main .song-status::before {
  display:none
}
.book-library-stand .book-stand-lyrics {
  font-size:27px;
  line-height:1.55;
  margin:30px 0 24px
}
.book-library-stand .book-note {
  font-size:17px;
  line-height:1.5
}
.library-panel .panel-head {
  margin-bottom:22px
}
.book-library-stand h3 {
  margin:20px 0 10px
}
.book-library-stand .book-open-song {
  margin:12px 0;
  padding:14px 0
}
.learning-route-card .learning-route-action {
  width:auto;
  min-width:0;
  max-width:100%;
  justify-self:start;
  display:inline-flex;
  justify-content:start
}
.learning-route-card {
  min-height:120px;
  padding:20px 0
}
.book-learning-excerpt .book-excerpt {
  line-height:1.55
}
.learning-route-head {
  margin-bottom:20px
}
.learning-manual .learning-header {
  padding:0 0 16px;
  margin-bottom:24px;
  align-items:center
}
.learning-manual .learning-header>div:first-child {
  display:flex;
  align-items:baseline;
  gap:16px;
  flex-wrap:wrap
}
.learning-manual .learning-header .eyebrow {
  display:none
}
.learning-manual .learning-header h2,.learning-manual .learning-header p {
  margin:0
}
.learning-manual .learning-stage {
  gap:16px
}
.learning-stage>.learning-option-group {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px
}
.learning-playback-practice-row {
  margin:0
}
.learning-playback-practice-button {
  min-height:36px
}
.learning-cue .learning-transition-prompt {
  gap:12px
}
.learning-cue .learning-transition-prompt strong {
  margin:0
}
.learning-cue .learning-transition-prompt small {
  margin:0
}
.learning-self-score:not(:has(button:not(.hidden))),.learning-guided-actions:not(:has(button:not(.hidden))) {
  display:none
}
.learning-stage #learningStatus {
  order:8;
  font-size:12px;
  line-height:1.6
}
.learning-practice-options summary {
  justify-content:start;
  text-align:start;
  font-size:12px;
  font-weight:400
}
.learning-practice-options summary em {
  font-size:11px;
  font-weight:400
}
.learning-manual .learning-cue {
  min-height:120px;
  padding:12px 0
}
.learning-header-actions button {
  min-height:38px;
  padding:9px 13px
}
.learning-panel {
  position:relative
}
/* One return location in the shared song header, independent of lyric direction. */
.learning-return-control {
  position:static;
  display:flex;
  justify-content:flex-start;
  direction:ltr;
  margin-top:16px;
}
body:not([data-view=learn]) .learning-return-control,
.learning-return-control.hidden { display:none; }
.learning-return-control .mini-button {
  min-height:38px;
  padding:8px 0;
  border:0;
  background:transparent;
  box-shadow:none;
  color:var(--book-muted);
  font:14px/1.5 var(--book-ui);
}
.learning-return-control .mini-button:hover { color:var(--book-red); }
.learning-return-control .mini-button:focus-visible { outline:2px solid var(--book-red);outline-offset:4px; }
.focus-mode-overlay {
  --text:var(--book-ink);
  --muted:var(--book-muted);
  --brand:var(--book-red);
  --brand-ink:var(--book-red);
  --line:var(--book-rule);
  --panel:var(--book-page);
  --panel-2:var(--book-spine)
}
.focus-lyrics-display .lyric-line.active,.focus-mode-overlay.focus-playback-practice .focus-lyrics-display .lyric-line.active {
  max-width:16ch
}
.focus-mode-controls .subtle-transport {
  color:var(--book-muted)
}
.focus-mode-overlay .focus-exit-button {
  color:var(--book-ink)
}
.focus-mode-topbar #bookFocusArtist {
  font-size:12px;
  margin-bottom:8px
}
.focus-mode-topbar #focusModeSummary {
  font-size:10px
}
.focus-mode-topbar #bookFocusArtist:empty {
  display:none
}
@media(min-width:901px) and (max-width:1300px) {
  .learning-manual .learning-cue {
    font-size:48px
  }
  .workspace-topbar {
    padding-bottom:18px;
    margin-bottom:18px
  }
  .learning-manual .learning-header {
    margin-bottom:20px
  }
  .learning-manual .learning-stage {
    gap:13px
  }
  .learning-route-card {
    padding:16px 0;
    min-height:108px
  }
  .learning-route-card h4 {
    font-size:28px
  }
  .book-stand-lyrics {
    font-size:25px
  }
}
body[data-view=library] #songStatusSummary {
  display:none
}
.book-learning-excerpt:has(.book-excerpt[dir=rtl]) .book-running {
  text-align:right
}
.book-learning-excerpt .book-note[dir=rtl] {
  text-align:right
}
.focus-mode-topbar #bookFocusArtist { width: fit-content; max-width: 100%; }
@media(max-width:900px) {
  .library-song-row { grid-template-columns:28px minmax(0,1fr) 28px 30px; }
  .library-song-tags { display:none; }
  .favorite-button { grid-column:3; }
  .library-overflow { grid-column:4; }
  .book-library-stand { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 20px; padding: 18px 0; }
  .book-library-stand h3 { font-size: 30px; margin: 0; grid-column: 1; }
  .book-library-stand .book-running { margin: 0; }
  .book-library-stand .book-artist { margin: 0; grid-column: 1; }
  .book-library-stand .book-stand-lyrics, .book-library-stand .book-note, .book-library-stand>.book-running:last-child { display: none; }
  .book-library-stand .book-open-song { grid-column: 2; grid-row: 1 / 4; align-self: center; gap: 20px; }
}
.focus-mode-topbar { flex-direction: row; flex-wrap: nowrap; }
@media(max-width:900px) {
  .focus-mode-topbar>div { width: auto; }
  .focus-mode-topbar .focus-exit-button { margin-top: 65px; }
}
.book-brand { background: none; border: 0; padding: 0; text-align: start; font-weight: 400 !important; border-radius: 0; }
#bookLibraryStatus { font-size: 13px; line-height: 1.6; color: var(--book-muted); }
#bookLibraryStatus:empty { display: none; }
#bookLibraryStatus[data-state=error] { color: var(--book-red); border-inline-start: 2px solid var(--book-red); padding-inline-start: 12px; }

/* Navigation stays in place while the workspace or performance page scrolls. */
:root { --book-sidebar-width:184px; }
.app-sidebar { position:fixed; inset:0 auto 0 0; width:var(--book-sidebar-width); height:100dvh; z-index:1001; }
.workspace { grid-column:2; }
@media(max-width:1150px) { :root { --book-sidebar-width:160px; } }
@media(max-width:900px) { :root { --book-sidebar-width:138px; } }
@media(max-width:620px) {
  .app-sidebar { position:sticky; top:0; width:100%; height:auto; max-height:45dvh; }
}

/* Song text shares the editorial face in English and Hebrew. UI copy keeps its own face. */
.coach-lyric-stack p,
.lyrics-display .lyric-line {
  font-family:var(--book-serif);
  font-weight:400;
}
.book-saved-art { object-fit:contain; background:transparent; }
.book-saved-art[hidden] { display:none; }
.book-analysis-spread:has(> .book-analysis-art:not([hidden])) { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(340px,1fr); gap:52px; align-items:start; }
.book-analysis-art { width:100%; height:clamp(460px,56vh,720px); margin-top:42px; }
.book-stand-art { display:block; width:100%; height:220px; margin:24px 0; }
:root:not(.light) .book-saved-art { filter:invert(1); opacity:.85; }
@media(max-width:1000px) {
  .book-analysis-spread:has(> .book-analysis-art:not([hidden])) { grid-template-columns:minmax(0,1fr); }
  .book-analysis-art { height:340px; margin-top:0; }
  .book-stand-art { grid-column:1/-1; height:160px; }
}
/* Coach-only pencil rules: vector masks follow theme colors and never intercept input. */
.coach-page {
  --pencil-rule:url('/pencil-rule.svg?v=graphite-2');
  --pencil-divider:url('/pencil-divider.svg');
  --pencil-underline:url('/pencil-underline.svg');
  padding:0; border:0; border-radius:0; background:none; gap:22px;
}
.coach-page .coach-page-head span { font-weight:400; font-size:12px; }
.coach-page .coach-intro { max-width:none; font:400 22px/1.5 var(--book-serif); color:var(--text); }
.coach-page .coach-toolbar { position:relative; border:0; padding:22px 0; }
.coach-page .coach-toolbar::before,.coach-page .coach-toolbar::after {
  content:""; position:absolute; inset-inline:0; height:8px; background:var(--text); opacity:.9;
  mask:var(--pencil-rule) center/100% 100% no-repeat; pointer-events:none;
}
.coach-page .coach-toolbar::before { top:-4px; }
.coach-page .coach-toolbar::after { bottom:-4px; transform:scaleX(-1); }
.coach-page .coach-toolbar label { font-weight:400; }
.coach-page .coach-lyrics { border:0; border-radius:0; background:none; padding:40px 0 26px; }
.coach-page .coach-lyric-stack { width:min(1100px,100%); gap:18px; }
.coach-page .coach-panel-grid { gap:0; }
.coach-page .coach-panel,.coach-page .coach-missing { border:0; border-radius:0; background:none; padding:12px 30px; position:relative; }
.coach-page .coach-panel:first-child { padding-inline-start:0; }
.coach-page .coach-panel:last-child { padding-inline-end:0; }
.coach-page .coach-panel + .coach-panel::before {
  content:""; position:absolute; inset-inline-start:-4px; top:0; bottom:0; width:8px;
  background:var(--text); opacity:.65; mask:var(--pencil-divider) center/100% 100% no-repeat; pointer-events:none;
}
.coach-page .coach-panel:nth-child(3)::before { transform:scaleY(-1); }
.coach-page .coach-panel p,.coach-page .coach-missing { font:400 20px/1.5 var(--book-serif); }
.coach-page .coach-panel h4 { font-size:12px; font-weight:600; margin-bottom:12px; }
.coach-page .coach-emphasis-tags { gap:14px 25px; }
.coach-page .coach-emphasis-tags span { position:relative; border:0; border-radius:0; padding:0 0 8px; background:none; color:var(--text); font:400 22px/1.3 var(--book-serif); }
.coach-page .coach-emphasis-tags span::after {
  content:""; position:absolute; bottom:0; inset-inline:0; height:8px; background:var(--brand-ink);
  mask:var(--pencil-underline) center/100% 100% no-repeat; pointer-events:none;
}
.coach-page .coach-emphasis-tags span:nth-child(even)::after { transform:scaleX(-1); }
.coach-page .coach-nav { margin-top:10px; }
body:has(.learning-coach-view:not(.hidden) .coach-page) .workspace-topbar .eyebrow { position:relative; border-bottom:0; }
body:has(.learning-coach-view:not(.hidden) .coach-page) .workspace-topbar .eyebrow::after {
  content:""; position:absolute; inset-inline:0; bottom:-4px; height:8px; background:var(--text); opacity:.9;
  mask:url('/pencil-rule.svg?v=graphite-2') center/100% 100% no-repeat; pointer-events:none;
}
@media(max-width:760px) {
  .coach-page .coach-panel-grid { grid-template-columns:1fr; gap:22px; }
  .coach-page .coach-panel { padding:16px 0 0; }
  .coach-page .coach-panel + .coach-panel::before { inset:0 0 auto; width:100%; height:8px; mask-image:var(--pencil-rule); }
  .coach-page .coach-toolbar label { min-width:0; width:100%; }
}
/* Result UI follows the interface language; only song text follows lyric direction. */
.learning-cue .learning-review-summary { direction:ltr; text-align:left; unicode-bidi:isolate; }
.learning-review-summary .learning-review-line strong,
.learning-review-summary .learning-review-cue bdi { font-family:var(--book-serif); font-weight:400; unicode-bidi:isolate; }
.learning-review-summary .learning-review-line strong { display:block; text-align:start; }
.learning-review-summary .learning-review-cue { text-align:left; }

/* Word-level recall notes stay in the lyric, without changing its typography. */
.learning-cue button.lyric-word {
  display: inline; padding: 0; margin: 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; color: inherit; font: inherit;
  letter-spacing: inherit; line-height: inherit; cursor: pointer;
}
.lyric-word[aria-pressed="true"], .lyric-word-mark {
  text-decoration: underline; text-decoration-color: var(--book-accent, #ad4934);
  text-decoration-thickness: 2px; text-underline-offset: .16em;
  text-decoration-skip-ink: auto;
}
.learning-cue button.lyric-word:hover { text-decoration-line: underline; text-underline-offset: .16em; }
.learning-cue button.lyric-word:focus-visible { outline: 2px solid var(--book-accent, #ad4934); outline-offset: 4px; }
.learning-cue .word-mark-instruction { font: 14px/1.5 var(--book-sans, sans-serif); color: var(--book-muted, #73766b); margin-top: 24px; }
.learning-retry-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:24px 0; }
.learning-retry-actions button { padding:10px 18px; }
.learning-retry-actions button:first-child { background:var(--book-accent, #ad4934); color:#fff; border-color:transparent; }
.learning-retry-actions small { flex-basis:100%; font:14px/1.5 var(--book-sans, sans-serif); }
.learning-retry-success ul { list-style:none; padding:0; }
.learning-retry-success h4 { font:600 14px/1.5 var(--book-sans, sans-serif); color:var(--book-accent, #ad4934); }
