@font-face{font-family:Inter;src:url('./fonts/Inter_500Medium.ttf') format('truetype');font-weight:400 500;font-display:swap}
@font-face{font-family:Inter;src:url('./fonts/Inter_600SemiBold.ttf') format('truetype');font-weight:600 800;font-display:swap}
@font-face{font-family:'DM Serif Display';src:url('./fonts/DMSerifDisplay_400Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Music Symbols';src:url('./fonts/DejaVuSans-Bold-music.ttf') format('truetype');unicode-range:U+266D-266F;font-display:swap}
@font-face{font-family:Gabarito;src:url('./fonts/Gabarito_400Regular.ttf') format('truetype');font-weight:400 500;font-display:swap}
@font-face{font-family:Gabarito;src:url('./fonts/Gabarito_700Bold.ttf') format('truetype');font-weight:600 800;font-display:swap}
@font-face{font-family:'Gravitas One';src:url('./fonts/GravitasOne_400Regular.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--ground:#F1EBDE;--surface:#F1EBDE;--line:#5C544A;--card:#F1EBDE;--text:#1C1916;--muted:#5C544A;--accent:#A87626;--on-accent:#1C1916;--paper:#F1EBDE;--ink:#1C1916;--focus:var(--accent);--shadow:var(--ground);color-scheme:light;font-family:Gabarito,sans-serif;font-synthesis:none}
:root[data-theme=C]{--ground:#0B2A1F;--surface:#12382A;--line:#215240;--card:#185340;--text:#F1EBDD;--muted:#B7C9BE;--accent:#D2B26E;--on-accent:#0B1A13}
:root[data-theme=A],:root[data-theme=B],:root[data-theme=C]{--paper:#F1EBDD;--ink:#16130F;color-scheme:dark}
:root[data-theme=A]{--ground:#0D1611;--surface:#15231B;--line:#24382D;--card:#1E3428;--text:#F1EBDD;--muted:#B9C2B8;--accent:#C9A869;--on-accent:#14110B}
:root[data-theme=B]{--ground:#0F0F0E;--surface:#1A1918;--line:#2E2C29;--card:#173D2F;--text:#F1EBDD;--muted:#B4AB9B;--accent:#3FB386;--on-accent:#0B1A13}
*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--text);font-size:16px;line-height:1.55}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit;color:var(--text)}button,a,input,select{touch-action:manipulation}button,a.button{cursor:pointer}button:disabled{cursor:default}h1,h2,h3,h4{font-family:'Gravitas One',serif;font-weight:400;line-height:1.12;margin:0;text-wrap:balance}h1{font-size:clamp(32px,4vw,50px)}h2{font-size:clamp(25px,3vw,32px)}h3{font-size:24px}p{margin:12px 0}img{max-width:100%}:focus-visible{outline:3px solid var(--focus);outline-offset:4px}button,select,input[type=search]{min-height:44px}button{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:10px 16px}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:999px;padding:12px 22px;border:1px solid var(--muted);text-decoration:none;line-height:1.3;font-weight:600;text-align:center;white-space:normal}.button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.button:disabled{opacity:.65}.button svg,.icon-button svg{width:20px;height:20px;flex:none}.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;padding:0;background:transparent;text-decoration:none}.skip-link{position:fixed;top:-100px;left:12px;z-index:50;background:var(--accent);color:var(--on-accent);padding:12px}.skip-link:focus{top:8px}.topbar{max-width:1240px;margin:auto;padding:24px 32px 12px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-family:'Gravitas One',serif;font-size:34px;line-height:1;text-decoration:none;white-space:nowrap}.brand span{color:var(--accent)}.top-actions{display:flex;gap:10px}.page{max-width:1120px;margin:0 auto;padding:28px 32px 140px;min-width:0}.page>section+section{margin-top:38px}.page>header{margin-bottom:28px}.page header p{max-width:70ch}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:600;color:var(--accent);margin:0 0 12px}.muted,.meta,.fine{color:var(--muted)}.fine{font-size:12px;line-height:1.5}.meta{font-size:14px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.row.between{justify-content:space-between}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.actions>.button{flex:0 1 auto}.panel{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px}.start-panel h1{font-size:32px}.start-panel .actions>.button{flex:1}.home-layout{display:grid;grid-template-columns:1fr 1.6fr;gap:24px;align-items:start}.home-layout .continue-panel{grid-column:1}.feature h2{font-size:clamp(28px,3.5vw,40px);max-width:24ch}.feature .score-frame{margin-top:18px}.feature .actions{display:grid;grid-template-columns:minmax(100px,.8fr) minmax(170px,1.2fr)}.feature .button{padding-inline:12px;width:100%;white-space:nowrap}.score-frame{background:var(--paper);color:var(--ink);border-radius:12px;padding:14px;overflow:auto;max-width:100%;position:relative}.score-frame img{display:block;width:100%;min-width:280px;max-width:none;mix-blend-mode:multiply}.score-frame.zoomed img{width:180%;min-width:640px}.score-frame figcaption{font-size:12px;color:var(--ink)}.score-frame .missing{color:var(--ink);padding:16px}.score-wrap{margin:20px 0}.score-toolbar{display:flex;justify-content:flex-end;margin:0 0 8px}.score-toolbar button{font-size:13px;padding:8px 12px}.shelf{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x proximity;padding:6px 0 16px;margin-top:18px}.shelf>*{scroll-snap-align:start;flex:0 0 190px;min-width:0}.player-card{margin:0}.player-card>a{display:block;text-decoration:none}.portrait{display:flex;align-items:center;justify-content:center;aspect-ratio:1;background:var(--card);border-radius:14px;overflow:hidden;color:var(--accent);font:48px 'Gravitas One',serif}.portrait img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}.player-name{display:block;font-size:16px;line-height:1.3;margin-top:10px;font-weight:600}.photo-credit{display:block;font-size:10px;line-height:1.4;color:var(--muted);margin:7px 0}.photo-credit a{display:inline;min-height:0}.idea-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:20px}.idea-tile{display:block;text-decoration:none;min-height:120px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px}.idea-tile h3{font-size:23px;margin-bottom:12px}.idea-tile:hover,.line-row:hover{border-color:var(--muted)}.watch-card{flex-basis:300px}.watch-card .portrait{aspect-ratio:16/9}.watch-card h3{margin-top:14px}.watch-card .panel{height:100%}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:20;background:var(--ground);border-top:1px solid var(--line);padding:10px max(12px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:flex;justify-content:center;gap:28px}.bottom-nav a{min-width:90px;min-height:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-decoration:none;color:var(--muted);font-size:12px}.bottom-nav svg{width:23px;height:23px}.bottom-nav a[aria-current=page]{color:var(--accent)}.back-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--muted);margin-bottom:16px}.section-title{font-family:'Music Symbols','Gravitas One',serif;font-weight:400;font-size:22px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin:20px 0}.filters label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}.filters input,.filters select,.settings select{width:100%;min-width:0;background:var(--ground);border:1px solid var(--muted);border-radius:8px;padding:10px 12px}.filters .search-field{grid-column:span 2}.filters .filter-actions{display:flex;align-items:end;gap:12px}.line-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.line-row{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:20px;display:block;text-decoration:none;min-width:0}.line-code{color:var(--accent);font-size:13px;letter-spacing:.08em;margin-bottom:8px}.line-row h3{font-size:24px}.line-row .meta{margin-bottom:6px}.line-row .chords{font-size:15px;margin-top:12px}.quiet-label{font-size:12px;color:var(--muted);margin-top:8px}.pagination{display:flex;gap:18px;justify-content:center;align-items:center;flex-wrap:wrap;margin:28px 0}.detail-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,.8fr);gap:28px}.detail-layout>*{min-width:0}.detail-main .panel+.panel{margin-top:24px}.detail-title .meta{font-size:17px}.chord-flow{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.chord-flow>div{background:var(--surface);border-bottom:1px solid var(--muted);padding:12px 18px;min-width:100px}.chord-flow small{display:block;color:var(--muted)}.chord-flow strong{font-size:20px}.tags{display:flex;gap:8px 16px;flex-wrap:wrap;font-size:13px;color:var(--muted)}.read-text{line-height:1.75;overflow-wrap:anywhere}.read-text p{margin:14px 0}.read-text h3{margin:28px 0 14px;font-size:22px}.read-text .list-line{padding-left:20px;position:relative}.read-text .list-line:before{content:'•';position:absolute;left:0;color:var(--accent)}.read-text .table-line{font-size:13px;white-space:pre-wrap}.player-heading{display:grid;grid-template-columns:160px 1fr;gap:26px;align-items:center}.player-heading figure{margin:0}.tune-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.tune-list a{display:flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:8px;text-decoration:none}.course-card{flex-basis:240px}.course-card h3{font-size:24px}.course-card .button{margin-top:14px}.parts{display:grid;gap:32px}.lesson-list{list-style:none;padding:0;margin:16px 0}.lesson-list li{border-bottom:1px solid var(--line)}.lesson-list a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;min-height:80px;padding:16px 0;text-decoration:none}.lesson-list a:has(.lesson-number){grid-template-columns:38px minmax(0,1fr) auto}.lesson-list strong{min-width:0;overflow-wrap:normal}.lesson-number{font:32px 'Gravitas One',serif;color:var(--accent)}.lesson-list strong{font-weight:500}.lesson-list .status{font-size:12px;color:var(--muted)}.step-nav{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.step-nav a{display:flex;align-items:center;min-height:44px;padding:10px 14px;border:1px solid var(--line);border-radius:8px;text-decoration:none;font-size:13px}.step-nav a[aria-current=step]{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.lesson-body{max-width:850px}.lesson-body>.panel{margin-top:20px}.lesson-body .idea-sentence{font:28px/1.4 'Gravitas One',serif}.lesson-bottom{display:flex;justify-content:space-between;gap:16px;margin-top:28px}.practice-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:20px 0}.practice-controls label{display:flex;gap:8px;align-items:center;min-height:44px}.practice-controls select{background:var(--ground);border:1px solid var(--muted);border-radius:8px;padding:10px}.key-grid{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.key-grid button[aria-pressed=true]{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.practice-player{max-width:900px}.practice-status{min-height:26px;font-size:14px;color:var(--muted)}.settings{max-width:700px}.settings details{margin-top:24px;border-top:1px solid var(--line);padding-top:18px}.settings summary{cursor:pointer;min-height:44px}.install-instructions{padding:16px 0}.install-instructions ol{padding-left:24px}.install-instructions li{margin:10px 0}.empty{padding:30px 0;color:var(--muted)}.error-box{border:1px solid var(--muted);padding:20px;border-radius:12px}.studio-footer{margin-top:42px;border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted)}#notice:empty{display:none}#notice{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);max-width:min(90vw,650px);background:var(--paper);color:var(--ink);padding:14px 20px;border-radius:10px;z-index:40;box-shadow:0 5px 20px var(--shadow)}[hidden]{display:none!important}
@media(min-width:900px){.topbar{padding-top:32px}.home-layout .feature{grid-column:2;grid-row:1/span 2}.home-layout .start-panel{grid-column:1}.home-layout .continue-panel{margin-top:0}.feature .score-frame{padding:20px}.page.narrow{max-width:900px}}
@media(max-width:900px){.idea-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-layout{display:flex;flex-direction:column;gap:18px}.home-layout>*{width:100%}.detail-layout{grid-template-columns:1fr}.detail-layout aside{order:2}.filters{grid-template-columns:1fr 1fr}.filters .search-field{grid-column:1/-1}.filters .filter-actions{grid-column:1/-1}.shelf>*{flex-basis:165px}.watch-card{flex-basis:260px}.bottom-nav{gap:10px}.bottom-nav a{min-width:80px}}
@media(max-width:600px){body{font-size:15px}.topbar{padding:24px 20px 10px}.brand{font-size:32px}.page{padding:20px 16px 130px}.panel{padding:22px 20px;border-radius:20px}.page>section+section{margin-top:30px}.home-layout{gap:16px}.start-panel h1{font-size:29px}.start-panel .actions{display:flex}.start-panel .actions>.button{flex-basis:100%}.start-panel .actions>.button.secondary-choice{border:0;padding-block:8px;min-height:44px;text-decoration:underline}.feature h2{font-size:32px}.feature .actions{gap:10px;grid-template-columns:minmax(100px,.9fr) minmax(166px,1.1fr)}.feature .button{font-size:14px;padding-inline:8px}.score-frame{padding:12px}.score-frame img{min-width:230px}.bottom-nav{gap:0;justify-content:space-around;padding-inline:4px}.bottom-nav a{flex:1;min-width:0;font-size:10px;gap:5px}.bottom-nav svg{width:22px;height:22px}.shelf{gap:12px}.shelf>*{flex-basis:140px}.watch-card{flex-basis:260px}.idea-tile{padding:16px;min-height:115px}.idea-tile h3{font-size:23px}.line-list{grid-template-columns:1fr}.filters{gap:12px}.player-heading{grid-template-columns:100px 1fr;gap:18px}.player-heading h1{font-size:32px}.chord-flow>div{min-width:75px;padding:10px 12px}.lesson-list a{grid-template-columns:minmax(0,1fr);gap:8px}.lesson-list a:has(.lesson-number){grid-template-columns:28px minmax(0,1fr)}.lesson-list .status{grid-column:1}.lesson-list a:has(.lesson-number) .status{grid-column:2}.step-nav{display:grid;grid-template-columns:1fr 1fr}.step-nav a:last-child{grid-column:1/-1}.lesson-bottom .button{padding-inline:16px;flex:1}.actions>.button{max-width:100%}.photo-credit{font-size:10px}.fine{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
summary{cursor:pointer;min-height:44px;padding:10px 0}
.idea-example{margin-top:20px}.idea-example h3{font-size:26px}
body,button,input,select{font-family:'Music Symbols',Gabarito,sans-serif}h1,h2,h3,h4,.brand{font-family:'Music Symbols','Gravitas One',serif}.section-title{font-family:'Music Symbols','Gravitas One',serif}main:focus{outline:none}.photo-credit a{display:block;min-height:44px;padding-top:6px}.portrait{color:var(--text)}input{accent-color:var(--accent)}.source-link,.studio-footer a{display:inline-flex;align-items:center;min-height:44px}.brand{display:inline-flex;align-items:center;min-height:44px}

/* Keep discovery visible and place optional controls behind one disclosure. */
.filters{grid-template-columns:1fr}.filters .search-field{grid-column:1/-1}.filters .filter-actions{align-items:center;flex-wrap:wrap}.filter-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.filter-panel>.button{justify-self:start;grid-column:1/-1}.idea-summary{margin-top:8px}
@media(max-width:600px){.library-ideas .idea-grid{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:12px}.library-ideas .idea-tile{flex:0 0 165px;scroll-snap-align:start}.library-ideas .idea-tile h3{font-size:21px}.filter-actions>.button{padding-inline:16px}}

/* Paper uses gold as an accent; text remains ink/brown on paper (>=4.5:1). */
:root[data-theme=D]{--ground:#F1EBDE;--surface:#F1EBDE;--line:#5C544A;--card:#F1EBDE;--text:#1C1916;--muted:#5C544A;--accent:#A87626;--on-accent:#1C1916;--paper:#F1EBDE;--ink:#1C1916;color-scheme:light}
[data-theme=D] .eyebrow,[data-theme=D] .line-code,[data-theme=D] .lesson-number,[data-theme=D] .brand span,[data-theme=D] .bottom-nav a[aria-current=page]{color:var(--text)}
[data-theme=D] .button.primary,[data-theme=D] .skip-link,[data-theme=D] .step-nav a[aria-current=step],[data-theme=D] .key-grid button[aria-pressed=true]{background:var(--paper);color:var(--ink);border:2px solid var(--accent)}
[data-theme=D] .bottom-nav a[aria-current=page]{border-top:3px solid var(--accent);font-weight:700}
[data-theme=D] .brand span{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:3px;text-underline-offset:6px}
[data-theme=D] .score-frame img{filter:url(#paper-notation);mix-blend-mode:normal}
.notation-filter{position:absolute;width:0;height:0;pointer-events:none}
@media(max-width:600px){[data-theme=D] h1{font-size:28px;line-height:1.2}[data-theme=D] .feature h2{font-size:27px;line-height:1.2}[data-theme=D] .start-panel h1{font-size:26px}[data-theme=D] .idea-tile h3{font-size:19px;line-height:1.2}}

.filters input::placeholder{color:var(--muted);opacity:1}

.continue-panel h1{font-size:clamp(26px,3vw,32px)}

.brand-byline{font-size:14px;color:var(--muted);margin:0 0 20px}
.review-banner{padding:12px 16px;margin-bottom:24px;border:1px solid var(--muted);border-radius:10px;font-size:14px;line-height:1.45;color:var(--text);background:var(--surface)}
.account-form{max-width:480px;display:grid;gap:18px}.account-form label{display:grid;gap:8px}.account-form input{width:100%;min-width:0;font-size:18px;padding:12px;color:var(--text);background:var(--ground);border:1px solid var(--muted);border-radius:6px}.account-summary,.member-gate{margin:20px 0}.account-summary p{overflow-wrap:anywhere}.form-status:empty,.sync-status:empty{display:none}.member-gate>p{max-width:55ch}
.voicing-rooms,.bar-choices{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}.voicing-rooms .button{font-size:15px}.bar-choices .button{font-size:14px}.bar-read{display:grid;grid-template-columns:150px 1fr;gap:10px 20px}.bar-read dt{font-weight:700}.bar-read dd{margin:0;white-space:pre-line}.voicing-read>p{white-space:pre-line}.voicing-table{border-collapse:collapse;width:100%;margin:24px 0;font-size:16px}.voicing-table th,.voicing-table td{border-bottom:1px solid var(--line);padding:12px;vertical-align:top;text-align:left}.voicing-filters{display:flex;flex-wrap:wrap;gap:16px;align-items:end}.voicing-filters label{display:grid;gap:6px;flex:1;min-width:160px}.draft-questions{border:2px solid var(--accent)}.event-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px}.event-list h3{font-family:Gabarito,sans-serif;font-size:23px}.voicing-note-text{margin-top:22px}[aria-current=true].button{border-width:2px;font-weight:700}
@media(max-width:600px){.bar-read{display:block}.bar-read dt{margin-top:18px;color:var(--muted);font-size:14px}.bar-read dd{margin-top:6px}.voicing-table thead{display:none}.voicing-table,.voicing-table tbody,.voicing-table tr,.voicing-table td{display:block}.voicing-table tr{border:1px solid var(--line);border-radius:8px;margin:16px 0;padding:8px}.voicing-table td{border:0;padding:7px}.voicing-table td:before{content:attr(data-label);display:block;font-size:12px;font-weight:700;color:var(--muted)}.voicing-rooms .button{flex:1;min-width:130px}}

/* The score is the first teaching layer; Fred's full read stays one level below. */
.detail-layout{display:block}.detail-layout>aside{display:grid;grid-template-columns:140px minmax(0,1fr);gap:12px 26px;margin-top:32px;padding-top:26px;border-top:1px solid var(--line)}.detail-layout>aside>figure{grid-row:1/span 2}.detail-layout>aside>p,.detail-layout>aside>section{grid-column:2}.detail-layout>aside .portrait{width:140px}.detail-layout>aside .tune-list{margin-top:12px}.detail-main{min-width:0}
.score-study-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:start}.score-music-column{min-width:0}.study-score-frame{padding:32px 18px;scrollbar-gutter:stable;overscroll-behavior-x:contain}.teaching-score .is-wide .score-artwork{min-width:720px}.score-artwork>img,.score-artwork>.annotated-score{display:block;width:100%;height:auto;min-width:0;max-width:none}.score-artwork .annotated-score,.score-artwork .definition-scale{color:var(--ink);fill:var(--ink)}.score-artwork [fill=black]{fill:var(--ink)}.score-artwork [stroke=black]{stroke:var(--ink)}.score-artwork .score-annotation-mark{fill:none;pointer-events:none}.score-view-status:empty{display:none}.score-scroll-hint{margin:8px 0 0}.score-toolbar{gap:10px;flex-wrap:wrap}.score-toolbar button{min-height:44px}.score-cues{min-width:0}.cue-heading{margin:0 0 12px}.cue-choices{display:grid;gap:8px}.cue-choice{display:flex;align-items:center;gap:10px;text-align:left;font-size:16px;line-height:1.3;min-height:52px;width:100%;padding:12px;border:1px solid var(--muted);border-radius:10px;background:var(--surface)}.cue-choice[aria-pressed=true]{border:2px solid var(--accent);padding:11px;font-weight:700}.cue-number{display:flex;align-items:center;justify-content:center;flex:none;min-width:24px;height:24px;border:1px solid var(--muted);border-radius:50%;font-size:12px;color:var(--text)}.cue-choice[aria-pressed=true] .cue-number{border-color:var(--accent)}.cue-quote{font-size:15px;line-height:1.55;color:var(--muted);margin:14px 0 0}.full-read{margin-top:24px}.full-read summary{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;font-size:18px;font-weight:700;list-style:disclosure-closed}.full-read summary>span:first-child:before{content:'＋';margin-right:12px;font-weight:400}.full-read[open] summary>span:first-child:before{content:'−'}.full-read summary .fine{font-weight:400}.full-read[open] summary{padding-bottom:16px;border-bottom:1px solid var(--line)}.idea-example>.full-read{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:14px 0 0}.practice-player,.lesson-body{max-width:none}.lesson-connections{margin-top:28px}.study-entry{margin-bottom:0}.study-entry .source-link{font-size:14px}.score-preview .score-study-layout{display:block}.score-preview .study-score-frame{padding:14px}
@media(min-width:1100px){.has-cues .score-study-layout{grid-template-columns:minmax(0,1fr) 244px}.cue-quote{font-size:14px}.score-scroll-hint{display:none}.teaching-score .is-wide .score-artwork{min-width:640px}}
@media(max-width:600px){.study-score-frame{padding:30px 10px}.teaching-score .is-wide .score-artwork{min-width:680px}.score-study-layout{gap:16px}.cue-choice{min-height:48px;font-size:15px}.cue-quote{font-size:15px}.full-read{padding:18px}.full-read summary{font-size:16px}.detail-layout>aside{grid-template-columns:80px minmax(0,1fr);gap:12px 18px}.detail-layout>aside .portrait{width:80px}.detail-layout>aside h2{font-size:20px}.detail-layout>aside .tune-list{grid-column:1/-1}.line-list .line-row h3{font-size:22px}.score-toolbar button{font-size:12px}.score-cues .eyebrow{font-size:11px}}

.score-playback-slot:empty{display:none}.score-playback-slot .practice-status:empty{display:none}.score-playback-slot .actions,.score-playback-slot .practice-controls{margin:16px 0 0}

.full-read:not([open])>:not(summary){display:none}.line-heading h1{font-size:clamp(28px,3vw,40px);max-width:32ch;line-height:1.18}.practice-player h1{font-size:clamp(28px,3vw,38px)}
details:not([open])>:not(summary){display:none!important}
.voicing-read{overflow-wrap:anywhere;min-width:0}.bar-read dd{min-width:0;overflow-wrap:anywhere}
/* Marks sit on the paper notation surface in every theme. */
:root{--annotation-accent:#A87626}

/* Long lesson and line titles use the compact reading face; short headings keep Gravitas. */
h1.long-title,h2.long-title,h3.long-title,h4.long-title,
.feature h2.long-title,.line-heading h1.long-title,.practice-player h1.long-title{
  font-family:'Music Symbols',Gabarito,sans-serif;font-weight:700;
  font-size:clamp(26px,3vw,36px);line-height:1.16;max-width:36ch;text-wrap:balance;
}
/* Home shows one readable bar and opens the complete marked read on a tap. */
a.study-score-frame{display:block;text-decoration:none}.score-bar-preview .study-score-frame{padding:14px;overflow:hidden;scrollbar-gutter:auto}
.score-bar-preview .score-artwork>.annotated-score{overflow:hidden}.score-bar-preview .score-artwork>img{min-width:680px}
@media(max-width:600px){
  h1.long-title,h2.long-title,h3.long-title,h4.long-title,
  [data-theme=D] h1.long-title,[data-theme=D] .feature h2.long-title,
  .line-heading h1.long-title,.practice-player h1.long-title{font-size:25px;line-height:1.2}
  .score-bar-preview .study-score-frame{padding:12px 8px}
}

/* Practice opens directly on playable music; sources remain nearby. */
.practice-tabs{display:flex;gap:10px;margin:0 0 22px}.practice-tabs .button{flex:0 1 180px}.practice-tabs [aria-current=page]{border:2px solid var(--accent);font-weight:700}.voicing-context{margin:0 0 18px}.voicing-context>summary{font-size:14px;color:var(--muted)}.voicing-context .voicing-rooms{margin-top:8px}.voicing-exercise-card{padding:18px}.voicing-exercise-card .eyebrow{margin-bottom:8px}.voicing-exercise-card h3{font-family:'Music Symbols',Gabarito,sans-serif;font-size:23px;line-height:1.2;font-weight:700;text-wrap:initial}.voicing-card-score{background:var(--paper);color:var(--ink);border-radius:8px;padding:12px 8px;margin:14px 0;overflow:hidden;min-height:95px;display:flex;align-items:center}.voicing-card-score img{width:100%;height:auto;display:block;min-width:0;filter:url(#paper-notation)}.voicing-player .score-wrap{margin-top:0}.voicing-player>.practice-controls{margin-top:12px}.voicing-source-credit{margin:20px 0}.audio-region{margin-top:20px;padding:12px 16px}.audio-region>summary{font-size:15px}.audio-region-fields{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.audio-region-fields label{display:grid;gap:6px;font-size:13px}.audio-region-fields input,.audio-region-fields select{width:130px;min-width:0;min-height:44px;background:var(--ground);border:1px solid var(--muted);border-radius:7px;padding:8px}.audio-region-fields button{font-size:13px}.measure-region:not(:empty){border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:18px}
@media(max-width:600px){.voicing-card-score{min-height:105px}.voicing-exercise-card h3{font-size:22px}.practice-tabs .button{flex:1}.voicing-player{padding:18px 14px}.audio-region{padding:10px 12px}.audio-region-fields{display:grid;grid-template-columns:1fr 1fr}.audio-region-fields input,.audio-region-fields select{width:100%}.audio-region-fields button{min-height:44px;padding:9px}.voicing-exercise-card .eyebrow{font-size:10px}}

/* Original-source study: hear and try before revealing the transcription. */
.source-piano .practice-controls{margin-top:20px}.source-understand{margin-top:24px}.source-understand>.panel+.panel{margin-top:18px}.source-pdf{display:block;width:100%;height:650px;border:1px solid var(--muted);border-radius:8px;background:var(--paper);margin-top:18px}.source-transcription .button{margin-top:18px}.source-reveal{margin-top:20px}.source-piano>.source-link{margin-top:18px}
@media(max-width:600px){.source-pdf{height:500px}.source-transcription{padding-inline:12px}.source-piano>h2{font-size:24px}}

/* Actual source PDF pages stay readable in browsers without a PDF plug-in. */

[data-theme=D] .source-page-frame{background:var(--paper)}[data-theme=D] .source-page-image{mix-blend-mode:multiply}
/* Original transcription pages: private images keep the source readable in browsers without a PDF viewer. */
.source-pages{margin-top:20px}.source-page-controls{align-items:center;gap:10px}.source-page-status{margin:0;min-width:90px;text-align:center}.source-page-frame{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:8px;background:#fff;max-height:80vh;overscroll-behavior:contain}.source-page-image{display:block;width:100%;height:auto;max-width:none}.source-page-frame[data-enlarged="true"] .source-page-image{width:max(100%,1100px)}.voicing-library-entry{min-width:0}.voicing-context-link{padding:0 4px 12px;margin:8px 0 0}.voicing-source-credit>.source-link{display:block;margin-top:12px}
@media(max-width:600px){.source-page-controls{display:grid;grid-template-columns:1fr 1fr}.source-page-controls .source-page-status{grid-column:1/-1;grid-row:1}.source-page-controls .button:last-child{grid-column:1/-1}.source-page-frame{max-height:74vh}.source-page-frame[data-enlarged="true"] .source-page-image{width:900px}.voicing-context-link{line-height:1.5}}

/* Fred's Oct 23 doors keep the Paper room and its existing learning path. */
.players-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.players-grid .player-card{margin:0;min-width:0}.player-gallery .player-card{flex-basis:160px}.harmonic-shelves{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}.harmonic-shelf{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid var(--muted);border-radius:12px;text-decoration:none;min-width:0}.harmonic-shelf strong{font-size:19px}.harmonic-shelf .meta{font-size:14px;line-height:1.35}.harmonic-shelf[aria-current=page]{border:2px solid var(--accent);padding:15px}.library-ideas{margin:18px 0}.topic-path{padding-left:24px}.topic-path li{padding:14px 0;border-bottom:1px solid var(--line)}.topic-path a{display:flex;flex-direction:column;gap:8px;min-height:44px;text-decoration:none}.player-tune+.player-tune{margin-top:30px}.player-tune>h3{font-family:'Music Symbols',Gabarito,sans-serif;font-weight:700;font-size:25px}
@media(max-width:900px){.players-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.harmonic-shelves{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.players-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}.harmonic-shelves{display:flex;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity}.harmonic-shelf{flex:0 0 172px;scroll-snap-align:start}.harmonic-shelf strong{font-size:18px}.player-gallery .player-card{flex-basis:145px}}
.line-entry{display:block;text-decoration:none}.line-context-link{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:13px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Compact Home doors keep the music close; the full gallery stays in Players. */
.home-doors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:28px}.home-doors>.home-door{margin:0;padding:20px;min-width:0}.home-door .section-title{font-size:23px;line-height:1.15}.home-door>.muted{font-size:15px;line-height:1.4;margin:10px 0 14px}.home-topic-options{display:flex;gap:8px;flex-wrap:wrap}.home-topic-options>.button{flex:1;padding:10px 14px;min-height:44px}.home-topics>.source-link{font-size:14px;margin-top:8px}.home-player-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0 12px}.home-player-card{margin:0;min-width:0}.home-player-card>a{display:block;text-decoration:none}.home-player-card .portrait{max-width:82px;aspect-ratio:1;border-radius:10px}.home-player-card .player-name{font-size:12px;line-height:1.25;margin-top:6px}.home-player-card .photo-credit{margin:0;font-size:10px}.home-player-card summary{font-size:10px;min-height:30px;padding:5px 0}.home-player-card .photo-credit a{padding:0;font-size:10px;min-height:44px;overflow-wrap:anywhere}.home-players>.button,.home-library-door>.button{min-height:44px;font-size:14px;padding:10px 16px}
@media(max-width:600px){.home-doors{gap:12px}.home-doors>.home-door{padding:16px}.home-topics,.home-players{grid-column:1/-1}.home-door .section-title{font-size:21px}.home-player-preview{gap:14px;margin:12px 0}.home-player-card .portrait{max-width:66px}.home-player-card .player-name{font-size:12px}.home-players>.button{margin-top:0}.home-library-door .section-title{font-size:18px;line-height:1.2}.home-library-door>.muted{font-size:14px;margin:10px 0 12px}.home-library-door>.button{padding:9px 11px;font-size:13px;width:100%}}

/* Harmony uses the same small lesson pages as Lines; capture logs stay private. */
.voicing-lesson-list{list-style:none;padding:0;margin:20px 0 32px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.voicing-lesson-list>.voicing-lesson-card{padding:22px;border:1px solid var(--line);min-width:0}.voicing-lesson-card h2{font-family:'Music Symbols',Gabarito,sans-serif;font-size:25px;line-height:1.2;font-weight:700}.voicing-lesson-card .actions>.button{display:inline-flex;flex-direction:row;font-size:14px;min-height:44px;padding:10px 16px}.voicing-lesson-card .meta{line-height:1.5}.voicing-stage-label{margin:0 0 18px}.voicing-lesson-body{max-width:900px}.voicing-lesson-body .practice-player{margin-top:20px}.voicing-focused-read .bar-read{margin-top:18px}.voicing-lesson-body>.actions{margin-bottom:24px}.content-review{margin-top:32px}.content-review>summary{cursor:pointer;min-height:44px}
@media(max-width:600px){.voicing-lesson-list{grid-template-columns:1fr;gap:14px}.voicing-lesson-list>.voicing-lesson-card{padding:20px}.voicing-lesson-card h2{font-size:23px}.voicing-lesson-card .actions>.button{flex:1}.voicing-lesson-body .practice-player{padding:18px 14px}}
.voicing-lesson-body .idea-sentence{font-family:'Music Symbols',Gabarito,sans-serif;font-size:21px;font-weight:400;line-height:1.5;max-width:65ch}

/* The app frame has its own palette. Paper teaching and notation keep their
   existing tokens and layout; the dark frame never recolors the score. */
:root{--frame-ground:#171D19;--frame-panel:#20372A;--frame-line:#758375;--frame-text:#F1EBDE;--frame-muted:#C6C4B7;--frame-accent:#D5B26E}
:root[data-theme=A]{--frame-ground:#0D1611;--frame-panel:#1E3428}
:root[data-theme=B]{--frame-ground:#0F0F0E;--frame-panel:#173D2F}
:root[data-theme=C]{--frame-ground:#0B2A1F;--frame-panel:#164D3B}
.topbar,.bottom-nav{--text:var(--frame-text);--muted:var(--frame-muted);--line:var(--frame-line);--accent:var(--frame-accent);--focus:var(--frame-accent);background:var(--frame-ground);color:var(--frame-text)}
.topbar{max-width:none;padding:22px max(32px,calc((100vw - 1176px)/2));border-bottom:1px solid var(--frame-line)}
.topbar .brand{color:var(--frame-text)}.topbar .brand span{color:var(--frame-accent);text-decoration:none}
.topbar .icon-button{color:var(--frame-text);border-color:var(--frame-line)}
.topbar .icon-button:hover{border-color:var(--frame-accent);background:var(--frame-panel)}
.bottom-nav{border-top-color:var(--frame-line);box-shadow:0 -4px 20px #171D1910}
.bottom-nav a{color:var(--frame-muted)}.bottom-nav a[aria-current=page],[data-theme=D] .bottom-nav a[aria-current=page]{color:var(--frame-accent);border-top:3px solid var(--frame-accent);font-weight:700}
.topbar :focus-visible,.bottom-nav :focus-visible{outline-color:var(--frame-accent)}

/* A compact green introduction gives Home and each player a sense of place.
   These are entry headers, never full-height promotional panels. */
.home-hero,.player-heading{--text:var(--frame-text);--muted:var(--frame-muted);--line:var(--frame-line);--surface:var(--frame-panel);--card:var(--frame-panel);--accent:var(--frame-accent);--focus:var(--frame-accent);background:var(--frame-panel);color:var(--frame-text);border:1px solid var(--frame-line);border-top:3px solid var(--frame-accent);border-radius:18px;padding:28px;min-width:0}
.home-hero{margin-bottom:24px}.home-hero h1{font-size:clamp(28px,3.5vw,40px);max-width:24ch;line-height:1.16}.home-hero p{max-width:62ch}.home-hero .eyebrow,.player-heading .eyebrow{color:var(--frame-accent)}
.home-hero .meta,.home-hero .muted,.home-hero .fine,.player-heading .meta,.player-heading .muted,.player-heading .photo-credit{color:var(--frame-muted)}
.home-hero .brand-byline{margin-bottom:12px;color:var(--frame-muted)}
.home-hero .button,.player-heading .button{color:var(--frame-text);border-color:var(--frame-line);background:transparent}
.home-hero .button.primary,.player-heading .button.primary{background:var(--frame-accent);color:var(--frame-ground);border:2px solid var(--frame-accent)}
.home-hero .portrait,.player-heading .portrait{background:var(--frame-ground);color:var(--frame-text)}
.home-hero-media img{display:block;max-height:240px;object-fit:cover;border-radius:12px;filter:grayscale(1)}
.home-continue{border-left:4px solid var(--accent)}
.player-heading{margin-bottom:26px;grid-template-columns:180px minmax(0,1fr)}.player-heading .portrait{border-radius:10px;min-width:0}.player-heading h1{font-size:clamp(28px,3.6vw,42px);line-height:1.15;overflow-wrap:anywhere}
.player-heading .photo-credit a{color:var(--frame-muted)}
.player-card .portrait,.players-grid .portrait{border:1px solid var(--line);border-bottom:3px solid var(--accent)}

/* Topic entrances are concrete, quiet shelves. The existing lesson steps,
   annotated score, full read and key practice controls stay in place. */
.topic-shelf{margin-top:26px;padding:24px;border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:14px;background:var(--surface);min-width:0}
.topic-shelf h2,.topic-shelf h3{max-width:30ch;line-height:1.2}.topic-shelf>p{max-width:65ch}.topic-shelf .lesson-list{margin-bottom:0}
.topic-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:14px;color:var(--muted);margin:0 0 14px;line-height:1.5}.topic-breadcrumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--text)}
.lesson-context{padding:14px 18px;border-left:3px solid var(--accent);background:var(--surface);margin:16px 0 20px;max-width:80ch}.lesson-context p{margin:4px 0}.lesson-context .meta,.lesson-context .fine{color:var(--muted)}
.artist-performance{margin:24px 0;border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--surface);min-width:0}.artist-performance h2,.artist-performance h3{font-family:'Music Symbols',Gabarito,sans-serif;font-weight:700;font-size:24px;line-height:1.25}.artist-performance iframe{display:block;aspect-ratio:16/9;width:100%;height:auto;border:0;border-radius:8px;margin-top:16px;background:var(--frame-ground)}
.teacher-card{border-top:1px solid var(--line);padding-top:24px;margin-top:30px;max-width:760px}.teacher-card h2,.teacher-card h3{font-family:'Music Symbols',Gabarito,sans-serif;font-weight:700;font-size:24px;line-height:1.25}.teacher-card p{max-width:65ch}.teacher-card .portrait{width:80px;border-radius:50%}
.review-access{border:1px solid var(--line);border-left:3px solid var(--accent);padding:16px 18px;border-radius:10px;background:var(--surface);margin:18px 0}.review-access p{margin:4px 0 10px;max-width:65ch}.review-access .fine{color:var(--muted)}

@media(min-width:800px){.home-hero:has(.home-hero-media){display:grid;grid-template-columns:minmax(0,1.5fr) minmax(180px,.7fr);gap:24px;align-items:center}}
@media(max-width:600px){.topbar{padding:19px 20px}.topbar .brand{font-size:30px}.home-hero,.player-heading{padding:22px 18px;border-radius:14px}.home-hero h1{font-size:28px}.home-hero .actions{margin-top:16px}.home-hero-media{margin-top:18px}.home-hero-media img{max-height:160px;width:100%}.player-heading{grid-template-columns:86px minmax(0,1fr);gap:16px}.player-heading h1{font-size:27px;line-height:1.2}.player-heading .meta{font-size:14px}.topic-shelf{padding:20px 18px;margin-top:22px}.topic-shelf h2{font-size:24px}.topic-breadcrumb{font-size:13px;gap:3px 8px}.lesson-context{padding:12px 14px;font-size:14px}.artist-performance{padding:18px}.artist-performance h2,.teacher-card h2{font-size:23px}.review-access{padding:14px}.home-hero .button{padding-inline:18px}.topbar .brand span{color:var(--frame-accent)}}

/* Portrait fallbacks use plain words; embedded players keep usable controls. */
.portrait .portrait-name{font-family:Gabarito,sans-serif;font-size:16px;line-height:1.3;padding:12px;text-align:center}
/* Home now has a full player shelf; give photographs more presence than the
   earlier small portraits inside a navigation card. Keep the phone row compact. */
.home-player-preview{max-width:760px;gap:24px}
.home-player-card .portrait{width:100%;max-width:180px;border-bottom:3px solid var(--accent)}
.home-player-card .player-name{font-size:16px;margin-top:10px}
@media(max-width:600px){.home-player-preview{gap:16px}.home-player-card .portrait{max-width:92px}.home-player-card .player-name{font-size:13px}}
.artist-performance iframe{min-width:200px;min-height:200px;width:100%;border:0}

/* Player rows have no number column. Keep the welcome compact on phones. */
.lesson-list a>strong,.lesson-list a{min-width:0}.policy-page{max-width:75ch}.policy-page section{margin-top:28px}.policy-links{display:flex;flex-wrap:wrap;gap:8px 20px}.coming-note{margin-top:28px}.studio-footer{align-items:start}
@media(max-width:600px){.home-hero{padding:18px 20px}.home-hero h1{font-size:27px}.home-hero .eyebrow{margin-bottom:8px}.home-hero>p:last-child{font-size:14px;line-height:1.4;margin-bottom:0}.lesson-list a{line-height:1.45}}

/* Fred's welcome clips (Studio home and the top of each player's room). */
.welcome-video{margin:0 0 24px}.welcome-video video{display:block;width:100%;max-width:820px;aspect-ratio:16/9;background:var(--ink);border-radius:14px}
.members-only{display:inline-flex;align-items:center;gap:5px;vertical-align:middle}.members-only svg{width:13px;height:13px;flex:none}.trial-includes .lesson-list a{min-height:64px}.trial-includes h2{margin-bottom:4px}.transcribe-check{margin-top:24px}.transcribe-check h2{font-size:24px}
.account-form .show-password{display:flex;flex-direction:row;align-items:center;gap:8px;font-size:14px;margin-top:8px}.account-form .show-password input{width:20px;height:20px;min-height:0}
.account-form~.source-link+.source-link{margin-left:18px}

/* Written-key flips stay inside their parent passage and focused lesson. */
.written-flip{min-width:0}.written-flip+.written-flip{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}.written-flip .written-flip-sources{margin:0 0 8px}.written-flip .written-flip-practice{margin:0 0 12px}.written-flip-status:empty{display:none}.written-flip .score-toolbar{margin-top:16px}
/* Oct 29 teaching model: the next-step card, the sign-up question, the first week and the four progress marks. Paper look: ink, one gold accent. */
.next-step{border-left:4px solid var(--accent);margin:0 0 24px}.next-step h2{margin:4px 0 8px}.next-step>p{max-width:62ch}
.focus-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.focus-option,.mark{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);cursor:pointer;min-height:48px;min-width:0}
.focus-option strong,.mark strong{font-size:16px}.focus-option .fine,.mark .fine{color:var(--muted)}
.focus-option:hover,.mark:hover{border-color:var(--accent)}.focus-option.chosen,.mark.reached{border:2px solid var(--accent);padding:13px 15px}
.mark.reached strong::before{content:'✓ ';color:var(--accent)}
.mark-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
.progress-marks{margin-top:22px}
.week-strip{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:18px 0 0}
.week-strip a{display:inline-flex;width:36px;height:36px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;text-decoration:none;font-size:14px;color:var(--text)}
.week-strip .done a{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.week-strip .current a{border:2px solid var(--accent);font-weight:700}
.next-step-locked p{margin:6px 0 10px}
.explore-title{margin:40px 0 4px}
.lesson-outcomes{margin:18px 0}.lesson-outcomes h2{font-size:20px;margin:0 0 6px}.lesson-outcomes ul{margin:0;padding-left:22px}.lesson-outcomes li{margin:4px 0}
.lesson-more{margin:24px 0}.lesson-more h2{font-size:22px;margin:0 0 4px}
.progress-marks h2{font-size:22px;margin:0 0 4px}
@media(max-width:600px){.focus-options{grid-template-columns:1fr}.mark-row{grid-template-columns:repeat(2,minmax(0,1fr))}.mark{padding:12px}.mark.reached{padding:11px}}

/* Watch with the score (Claude, Oct 30 2026). Paper look; analysis colors approved by Fred Oct 30:
   gold targets, green enclosures, red triads / chord tones — on notes only. */
.perform [hidden]{display:none!important}
.perform{margin:24px 0;min-width:0;--mk-tgt:#A87626;--mk-enc:#2F7D55;--mk-tri:#B8453A}
.perform-head h1,.perform-head h2{margin:2px 0 4px}
.perform-head .meta{margin:0 0 14px}
.perform-video{position:relative;aspect-ratio:16/9;width:min(100%,calc(46vh * 16 / 9));margin:0 auto;min-height:200px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--paper)}
.perform-video>div,.perform-video iframe{width:100%;height:100%;min-width:200px;min-height:200px;border:0;display:block}
.perform-poster{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px;text-align:center}
.perform-poster p{margin:0}
.perform-read-row{display:flex;gap:12px;align-items:flex-start;margin:14px 0 8px}
.perform-play{flex:none;min-width:96px;margin-top:4px}
.perform-read{flex:1;margin:0;min-height:62px;border-left:3px solid var(--accent);padding:4px 12px}
.perform-read p{margin:0}.perform-read-bars{font-size:13px;color:var(--muted)}.perform-read-text{font-size:17px;line-height:1.35;margin-top:2px!important}
.perform-quiz{border:2px solid var(--mk-tgt);border-radius:10px;padding:12px 14px;margin:8px 0}
.perform-quiz p{margin:0 0 6px}.perform-quiz-bar{font-size:13px;color:var(--muted)}.perform-quiz-options{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}
.perform-quiz-options .right{border-color:var(--mk-enc);border-width:2px}
.perform-score{position:relative;height:150px;overflow:hidden;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);cursor:pointer;touch-action:pan-y;user-select:none}
@media(min-width:900px){.perform-score{height:190px}}
.perform-track{position:absolute;top:0;left:0;height:100%;will-change:transform}
.perform-track svg{display:block;color:var(--ink);fill:var(--ink)}
.perform svg .mk-tgt{fill:var(--mk-tgt);color:var(--mk-tgt)}
.perform svg .mk-enc{fill:var(--mk-enc);color:var(--mk-enc)}
.perform svg .mk-tri{fill:var(--mk-tri);color:var(--mk-tri)}
.perform.hide-tgt svg .mk-tgt,.perform.hide-enc svg .mk-enc,.perform.hide-tri svg .mk-tri{fill:var(--ink);color:var(--ink)}
.perform-labels{position:absolute;left:0;right:0;bottom:3px;height:20px;pointer-events:none}
.perform-label{position:absolute;bottom:0;font-weight:700;font-size:12px;line-height:1.2;border-top:3px solid currentColor;padding-top:1px;text-align:center;white-space:nowrap}
.perform-label.mk-enc{color:var(--mk-enc)}.perform-label.mk-tri{color:var(--mk-tri)}
.perform.hide-enc .perform-label.mk-enc,.perform.hide-tri .perform-label.mk-tri{visibility:hidden}
.perform-loop{position:absolute;top:0;bottom:0;background:rgba(168,118,38,.12);border-left:2px solid var(--mk-tgt);border-right:2px solid var(--mk-tgt);pointer-events:none}
.perform-playhead{position:absolute;top:6px;bottom:4px;left:30%;width:3px;margin-left:-1px;background:var(--mk-tgt);pointer-events:none}
.perform-cover{position:absolute;inset:0;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:10px}
.perform-cover p{margin:0}
.perform.hear-first .perform-keys .k.on{background:#FAF8F2}.perform.hear-first .perform-keys .k.b.on{background:var(--ink)}
.perform-free{margin:6px 0 10px}
.perform-keys{position:relative;display:flex;height:46px;margin:4px 0 12px}
.perform-keys .k.w{flex:1;background:#FAF8F2;border:1px solid var(--line);border-right-width:0}
.perform-keys .k.w:last-of-type{border-right-width:1px}
.perform-keys .k.b{position:absolute;top:0;height:62%;background:var(--ink);z-index:1;border-radius:0 0 2px 2px}
.perform-keys .k.on{background:var(--mk-tgt)}.perform-keys .k.b.on{background:#D6A04A}
.perform-legend,.perform-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.perform-speeds{display:flex;gap:6px;flex-wrap:wrap}
.chip-toggle{border:1px solid var(--line);border-radius:999px;padding:6px 12px;background:var(--paper);color:var(--ink);font:inherit;font-size:14px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.chip-toggle[aria-pressed=false]{opacity:.55}
.chip-toggle[aria-pressed=true]{border-color:var(--accent)}
.perform-legend .sw{width:12px;height:12px;border-radius:50%;display:inline-block}
.perform-legend .sw.mk-tgt{background:var(--mk-tgt)}.perform-legend .sw.mk-enc{background:var(--mk-enc)}.perform-legend .sw.mk-tri{background:var(--mk-tri)}
.perform-chips-title{font-size:18px;margin:20px 0 8px}
.perform-chips{display:flex;flex-wrap:wrap;gap:8px}
.perform-chip{display:inline-flex;align-items:center;gap:6px}
.perform-chip .chip{border:1px solid var(--line);border-radius:12px;padding:8px 12px;background:var(--paper);color:var(--ink);font:inherit;text-align:left;cursor:pointer;display:flex;flex-direction:column}
.perform-chip .chip .bars{font-size:12px;color:var(--muted)}
.perform-chip .steal{font-size:14px;font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent)}
.perform-credit{margin-top:16px}
.button.small{padding:6px 12px;font-size:14px}
/* Protected piano snippets reuse the performance controls and the annotated Library score. */
.line-snippet{margin:12px 0 18px}
.line-snippet .score-music-column{position:relative}
.line-snippet .snippet-playhead{position:absolute;top:0;left:0;width:3px;background:var(--mk-tgt);pointer-events:none;z-index:4}
.line-snippet .snippet-visuals{margin-top:10px}
.line-snippet .perform-keys{margin-top:10px}
.line-snippet.hide-tgt .score-annotation-mark{display:none}
.line-snippet .perform-legend:empty{display:none}
.line-snippet .perform-controls{margin:8px 0}
.line-snippet .perform-read-row{margin:6px 0}

/* Transcribe with me (Claude, Oct 30 2026) */
.perform-modes{display:flex;gap:8px;margin:12px 0 8px}
.tx-intro{border-left:3px solid var(--accent);padding:6px 12px;margin:0 0 10px}
.tx-intro ol{margin:6px 0 6px 18px;padding:0}.tx-intro li{margin:2px 0}
.tx-intro-title{font-weight:700;margin:0}
.perform.transcribing svg g.measure:not(.tx-revealed) :is(g.note,g.rest,g.beam,g.tuplet,g.tie,g.slur,g.chord,g.ledgerLines,g.dots,g.accid){visibility:hidden}
.perform.transcribing svg g.measure.tx-revealed g.note{fill:var(--ink)}
.perform.transcribing .perform-labels{display:none}
.perform.transcribing .perform-keys .k.w.on{background:#FAF8F2}.perform.transcribing .perform-keys .k.b.on{background:var(--ink)}
.tx-bars{position:absolute;inset:0;pointer-events:none}
.tx-bar{position:absolute;top:0;bottom:0;border-radius:4px}
.tx-bar.spot{box-shadow:inset 0 0 0 2px var(--mk-tgt);background:rgba(168,118,38,.06)}
.tx-bar.selected{background:rgba(168,118,38,.14)}
.tx-bar.got::after{content:'✓';position:absolute;top:2px;right:6px;font-weight:700;color:var(--mk-enc)}
.tx-num{position:absolute;top:2px;left:4px;font-size:11px;color:var(--muted)}
.tx-grid{position:absolute;left:0;right:0;bottom:4px;height:12px}
.tx-beat{position:absolute;bottom:0;text-align:left;font-size:11px;color:var(--muted);border-left:1px solid rgba(92,84,74,.35);padding-left:2px;line-height:1}
.tx-beat.and{color:rgba(92,84,74,.6);border-left-style:dotted}
.tx-dots{position:absolute;left:0;right:0;bottom:20px;height:10px}
.tx-dot{position:absolute;width:8px;height:8px;margin-left:-1px;border-radius:50%;background:var(--mk-tgt)}
.tx-panel{border:2px solid var(--accent);border-radius:10px;padding:12px 14px;margin:10px 0}
.tx-panel p{margin:0 0 6px}
.tx-title{font-weight:700;font-size:17px}
.tx-spot-tag{margin-left:8px;font-size:12px;font-weight:700;color:var(--mk-tgt);border:1px solid var(--mk-tgt);border-radius:999px;padding:1px 8px}
.tx-actions{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.tx-progress{margin-top:4px}
/* Home pitch for visitors (Oct 30) */
.home-pitch .actions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 8px}
.home-pitch .fine{margin:6px 0 0}

/* A fetched member bar is visible only while Transcribe is showing that checked bar. */
.perform:not(.transcribing) svg g.measure.tx-member-score :is(g.note,g.rest,g.beam,g.tuplet,g.tie,g.slur,g.chord,g.ledgerLines,g.dots,g.accid){visibility:hidden}

/* Fred, Oct 30 (late): free rule first on the visitor home; Free tag on open lessons. */
.home-free-rule{font-size:18px;margin:14px 0 4px}.home-price{font-size:14px;color:var(--muted);margin-top:14px}.home-price a{color:var(--text);font-weight:600}
.free-tag{display:inline-block;margin-left:8px;padding:1px 8px;border:1px solid var(--accent);border-radius:999px;color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;vertical-align:middle;line-height:1.6}

/* Oct 31: loop length beside Loop this bar */
.tx-loop{display:inline-flex;gap:6px;align-items:center}.tx-loop-len{min-height:44px;border:1px solid var(--muted);border-radius:999px;background:transparent;padding:0 12px;font-size:14px}

/* Oct 31 (teaching flow A): first win, self-score, check-yourself panels, glossary, before-you-start */
.tx-first-win{font-size:15px;margin:10px 0}.tx-close{margin-top:6px}

/* A thumb-sized, unsnapped selection within the recording's current bars. */
.small-loop-picker{margin:12px 0;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}
.small-loop-strip{position:relative;min-height:64px;width:100%;border:1px solid var(--muted);border-radius:8px;touch-action:none;user-select:none;-webkit-user-select:none;overflow:hidden;cursor:crosshair;background:var(--paper,#F1EBDE)}
.small-loop-grid{position:absolute;inset:0;pointer-events:none}.small-loop-beat{position:absolute;inset-block:0;display:flex;align-items:flex-end;border-left:1px solid rgba(92,84,74,.4);padding:0 0 8px 2px;font-size:11px;color:var(--muted);pointer-events:none}.small-loop-beat.and{border-left-style:dotted}
.small-loop-selection{position:absolute;inset-block:0;left:0;width:100%;background:rgba(168,118,38,.2);border-left:3px solid var(--accent);border-right:3px solid var(--accent);pointer-events:none}.small-loop-selection.is-pending{background:rgba(168,118,38,.1);border-style:dashed}
.small-loop-nudges{display:flex;flex-wrap:wrap;gap:8px 20px;margin:8px 0}.small-loop-edge{display:flex;align-items:center;gap:6px}.small-loop-edge .button{min-width:44px;min-height:44px;padding:6px 12px;font-size:22px;line-height:1}.small-loop-status{margin-top:6px!important}.small-loop-help{margin-bottom:8px!important}
.self-check ul{padding-left:20px}.self-check li{margin:6px 0}.glossary dt{font-weight:600;margin-top:10px}.glossary dd{margin:2px 0 0 0}.before-start{margin:12px 0}.before-start ul{padding-left:20px;margin:8px 0}
.membership-promise{font-family:'Gravitas One',serif;font-size:20px;line-height:1.35}
/* B1: one account-owned practice focus, with optional edits kept folded. */
.weekly-practice{max-width:900px}.weekly-practice h2{margin:0 0 20px}.weekly-practice h3{font-family:Gabarito,sans-serif;font-size:21px;margin:24px 0 10px}.weekly-practice p{max-width:65ch}.practice-tunes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.practice-tune{min-width:0;border-top:1px solid var(--line);padding-top:12px}.practice-tune>strong{display:block;font-size:21px;overflow-wrap:anywhere}.practice-tune .fine{margin-top:0}.practice-tune-edit,.practice-own-line{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.practice-tune-edit label,.practice-own-line label{display:grid;gap:6px;flex:1;min-width:150px}.weekly-practice input[type=text]{min-width:0;width:100%;min-height:44px;padding:10px;color:var(--text);background:var(--ground);border:1px solid var(--muted);border-radius:6px;font:inherit}.practice-count{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.practice-count select{min-height:44px}.practice-comfort{display:inline-flex;gap:12px;align-items:center;min-height:48px;padding:8px 14px;margin:0 12px 8px 0;border:1px solid var(--line);border-radius:8px;cursor:pointer}.practice-comfort input{width:22px;height:22px}.practice-comfort strong{font-size:21px;min-width:28px}.practice-return{border-left:3px solid var(--accent);padding-left:16px;margin-bottom:20px}.practice-return p{font-weight:700}.practice-fred-checks{margin-top:20px;border-top:1px solid var(--line)}.practice-fred-checks li{margin-bottom:10px}.weekly-practice [role=status]:empty{display:none}
@media(max-width:600px){.practice-tunes{grid-template-columns:1fr;gap:10px}.weekly-practice h2{font-family:Gabarito,sans-serif;font-size:25px}.practice-tune>strong{font-size:20px}.practice-own-line .button,.practice-tune-edit .button{width:100%}}
.perform-chip{flex-wrap:wrap}.perform-chip .spot-lesson{flex-basis:100%;margin:2px 0 0 4px}
/* Nov 1 (Chat audit): first task beside Play; a shorter Home pitch on phones */
.tx-start{margin:6px 0 10px;padding:10px 14px;border-left:3px solid var(--accent,#A87626);font-size:15px}
@media(max-width:600px){.home-pitch{padding:16px 16px}.home-pitch .eyebrow{display:none}.home-pitch h1{font-size:25px;margin-bottom:6px}.home-pitch p{font-size:15px;line-height:1.4;margin:6px 0}.home-pitch .actions{margin:10px 0 6px}.home-pitch .home-price{font-size:14px}}
/* Nov 1 (Fred, option #2): Dark mode. The viewer's choice (◐ in the top bar); Paper stays the default.
   The score turns light-on-dark through the same --paper/--ink tokens the notation already uses. */
:root[data-mode=dark]{--ground:#16130F;--surface:#1E1A16;--card:#1E1A16;--line:#5A5146;--text:#EDE5D4;--muted:#A99E8C;--accent:#D2A24C;--on-accent:#16130F;--paper:#1E1A16;--ink:#EDE5D4;--focus:var(--accent);--shadow:var(--ground);--annotation-accent:#D2A24C;--frame-ground:#0E0C0A;--frame-panel:#1E1A16;--frame-line:#5A5146;--frame-text:#EDE5D4;--frame-muted:#A99E8C;--frame-accent:#D2A24C;color-scheme:dark}
:root[data-mode=dark] .perform{--mk-tgt:#D2A24C;--mk-enc:#5BB487;--mk-tri:#DB7466}
:root[data-mode=dark] .perform-keys .k.b,:root[data-mode=dark] .perform.hear-first .perform-keys .k.b.on,:root[data-mode=dark] .perform.transcribing .perform-keys .k.b.on{background:#1C1916}
:root[data-mode=dark] .tx-beat,:root[data-mode=dark] .small-loop-beat{border-left-color:rgba(169,158,140,.4)}
:root[data-mode=dark] .tx-beat.and{color:rgba(169,158,140,.75)}
:root[data-mode=dark] .score-frame img,:root[data-mode=dark] .voicing-card-score img{filter:url(#dark-notation)}
:root[data-mode=dark] .source-page-frame,:root[data-mode=dark] .source-pdf{background:#F1EBDE}
.mode-toggle{cursor:pointer}

/* Nov 2: one member next step; the week is a separate optional disclosure. */
.member-next-step+.weekly-practice{margin-top:24px}.weekly-practice{margin-bottom:24px}
.member-next-step{max-width:900px;min-width:0}.member-next-step h1{font-size:clamp(26px,3.2vw,38px);line-height:1.2;margin:0 0 20px;overflow-wrap:anywhere}.member-next-step .meta{margin:0 0 20px}.member-next-step .button{min-height:48px}.weekly-practice>summary{display:block;position:relative;padding:0 28px 0 0;list-style:none}.weekly-practice>summary::-webkit-details-marker{display:none}.weekly-practice>summary:after{content:'＋';position:absolute;right:0;top:0;font-size:24px;line-height:1.3}.weekly-practice[open]>summary:after{content:'−'}.weekly-practice>summary h2{margin:0 0 16px;font-size:26px}.weekly-practice>summary p{margin:10px 0 0;overflow-wrap:anywhere}.practice-week-body{padding-top:18px;margin-top:20px;border-top:1px solid var(--line)}.practice-tune-settings .practice-tunes{padding-bottom:12px}.weekly-practice .practice-week-body>h3:first-of-type{margin-top:20px}
@media(max-width:600px){.member-next-step h1{font-size:26px;line-height:1.2}.member-next-step .button{width:100%}.weekly-practice>summary h2{font-size:25px}.practice-week-summary p{font-size:15px;line-height:1.5}}
/* Nov 2: the Library line layout inside lesson steps; every flip written out. */
.line-study,.line-again,.flips-panel,.use-it{margin-top:20px}.line-study h2,.line-again h2{font-size:clamp(24px,2.6vw,30px)}
.flips-panel>.meta{margin-bottom:8px}.flip-card{min-width:0}.flips-panel>.written-flip,.flips-panel>.flip-card{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.flips-panel .practice-player{border:0;background:transparent;padding:0;border-radius:0}.flips-panel .practice-player h2{font-size:clamp(22px,2.4vw,26px)}.practice-note{max-width:70ch}
.use-it h3{font-size:20px;margin-top:18px}.apply-tunes{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:12px 0}.apply-tunes li{border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:15px;background:var(--ground)}
