:root{--paper: #f4efe0;--paper-shadow: rgba(0, 0, 0, .5);--ink: #2a2520;--ink-soft: #4a4035;--ink-faint: #8a8478;--pencil: #5f72a8;--pencil-dim: rgba(95, 114, 168, .15);--pencil-glow: rgba(95, 114, 168, .35);--highlight: #f6c453;--highlight-glow: rgba(246, 196, 83, .55);--success: #4f8f5f;--warning: #a8763f;--danger: #a8453f;--danger-dim: rgba(168, 69, 63, .12);--radius-sm: 2px;--radius-md: 3px;--radius-lg: 3px;--radius-pill: 3px;--nav-height: 3.75rem;font-family:Georgia,Times New Roman,serif;line-height:1.55;color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-height:100vh}a{color:var(--ink);text-decoration:none;transition:color .15s ease}a:hover{color:var(--pencil)}.app{min-height:100vh;display:flex;flex-direction:column;position:relative}.app-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:var(--paper)}.page-loading{display:flex;align-items:center;justify-content:center;min-height:12rem;color:var(--ink-faint)}.main{flex:1;display:flex;justify-content:center;padding:4vh 2vw 6vh;width:100%;position:relative;z-index:1}.page{position:relative;width:min(100%,640px);background:var(--paper);padding:3.25rem 2.6rem 2.2rem;color:var(--ink)}.page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.5;mix-blend-mode:multiply;border-radius:inherit;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");background-size:220px 220px}.page.practice{width:min(100%,960px);padding-top:5.35rem;padding-bottom:9rem}.page>*{position:relative;z-index:1}.page-header-wrap--floating{position:fixed;top:0;left:50%;transform:translate(-50%);width:min(94vw,960px);z-index:40;background:var(--paper)}.page-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;gap:1rem;padding-bottom:.6rem;border-bottom:1px solid rgba(42,37,32,.15);margin-bottom:1.4rem;font-size:.72rem;font-style:italic;color:var(--ink-soft)}.page-header>a,.page-header>span:first-child{grid-column:1;justify-self:start}.page-header-brand{grid-column:2;justify-self:center;display:inline-flex;align-items:center;gap:.35rem;font-style:normal;font-weight:600;font-size:.75rem;letter-spacing:.03em;color:var(--ink-soft)}.page-header-brand-icon{width:.7rem;height:1.05rem;flex:none}.page-header-wrap--floating .page-header{position:relative;padding:.7rem 1.5rem;margin-bottom:0;border-bottom:none}.page-header-wrap--floating .page-header:after{content:"";position:absolute;left:1.5rem;right:1.5rem;bottom:0;height:1px;background:#2a252026}.page-header a{color:var(--ink-soft);text-decoration:none;border-bottom:1px dotted var(--ink-soft)}.page-header a:hover{color:var(--ink)}.page-header .device{grid-column:3;justify-self:end;display:flex;align-items:center;gap:.5rem;font-style:normal;letter-spacing:.02em;white-space:nowrap}.page-header-titleblock{position:relative;text-align:center;padding:.7rem 1.5rem .9rem}.page-header-wrap .page-header-titleblock h1{font-family:Georgia,serif;font-weight:600;margin:0;font-size:1.2rem;line-height:1.15;letter-spacing:.01em;color:var(--ink)}.page-header-titleblock p{margin:.1rem 0 0;font-size:.85rem;font-style:italic;color:var(--ink-soft)}.page-header-wrap--floating .page-header-titleblock:after{content:"";position:absolute;left:1.5rem;right:1.5rem;bottom:0;height:1px;background:#2a252026}.seal{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:var(--ink-faint);box-shadow:0 0 0 2px #8a847826}.seal.connected{background:var(--pencil);box-shadow:0 0 0 2px var(--pencil-dim)}.gear{background:none;border:none;padding:0;cursor:pointer;color:var(--ink-soft);line-height:1;font-size:.95rem;font-style:normal}.gear:hover{color:var(--ink)}.breadcrumb{margin:0 0 1.5rem;font-size:.78rem;font-style:italic;color:var(--ink-soft)}.breadcrumb a{color:var(--ink-soft)}.breadcrumb a:hover{color:var(--pencil)}.breadcrumb .sep{margin:0 .35rem;opacity:.6}.breadcrumb .current{color:var(--ink);font-style:normal}.page h1{font-family:Georgia,serif;font-weight:600;font-size:clamp(1.7rem,4vw,2.2rem);line-height:1.15;margin:0 0 .75rem;letter-spacing:.01em;color:var(--ink)}.page h2{font-family:Georgia,serif;font-weight:600;font-size:1.25rem;margin:2rem 0 .75rem;letter-spacing:.01em;color:var(--ink)}.muted{color:var(--ink-soft)}.empty{margin-top:2rem;color:var(--ink-soft)}.error{color:var(--danger)}.pass{color:var(--success)}.fail{color:var(--warning)}.list-heading{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 1rem;text-align:center}.cover-link{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-decoration:none;padding:2rem 0 1rem}.cover-link .ornament{font-size:1.3rem;color:var(--pencil);opacity:.6;margin-bottom:1rem}.cover-link h1{margin:0;font-size:2.2rem;text-align:center}.cover-link .rule{width:3.5rem;height:1px;background:var(--ink-soft);opacity:.4;margin:1rem 0}.cover-link p{margin:0;font-size:.88rem;font-style:italic;color:var(--ink-soft);max-width:22rem}.cover-link .hint{margin-top:2.5rem;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);opacity:.55}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.5rem 1.05rem;border:1px solid rgba(42,37,32,.3);border-radius:var(--radius-sm);background:transparent;color:var(--ink);cursor:pointer;font:inherit;font-size:.85rem;transition:background .15s ease,border-color .15s ease,color .15s ease}.btn:hover{border-color:var(--pencil);color:var(--pencil)}.btn:active{transform:scale(.98)}.btn.primary{background:var(--ink);border-color:var(--ink);color:var(--paper);font-weight:600}.btn.primary:hover{background:var(--pencil);border-color:var(--pencil);color:var(--paper)}.import-picker{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin-top:1.5rem;padding:2.75rem 1.5rem;border:1px dashed rgba(42,37,32,.35);border-radius:var(--radius-sm);cursor:pointer;text-align:center;color:var(--ink-soft);transition:border-color .15s ease,color .15s ease,background .15s ease}.import-picker:hover{border-color:var(--pencil);background:var(--pencil-dim)}.import-picker .plus{font-style:normal;font-size:1.4rem;color:var(--ink-faint);line-height:1;margin-bottom:.3rem}.import-picker:hover .plus{color:var(--pencil)}.import-picker-title{font-size:.95rem;color:var(--ink)}.import-picker:hover .import-picker-title{color:var(--pencil)}.import-picker-hint{font-size:.75rem;font-style:italic}.song-list,.section-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem}.song-row{display:flex;align-items:stretch;gap:.5rem}.song-row .song-link{flex:1;min-width:0}.song-list a,.section-list a{display:flex;align-items:baseline;gap:.4rem;padding:.4rem .1rem;color:var(--ink);text-decoration:none}.song-list a:hover .song-title,.section-list a:hover .song-title{color:var(--pencil)}.song-list a:hover .song-leader,.section-list a:hover .song-leader{border-bottom-color:var(--pencil)}.song-title{font-size:1rem;white-space:nowrap}.song-leader{flex:1;min-width:1rem;border-bottom:1px dotted var(--ink-soft);height:.6em}.song-meta{font-size:.78rem;font-style:italic;color:var(--ink-soft);white-space:nowrap}.toc-add{margin-top:1.4rem;padding-top:1.2rem;display:flex;justify-content:center}.toc-add a{display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;font-style:italic;color:var(--ink-soft);text-decoration:none;padding:.4rem 1rem;border:1px dashed rgba(42,37,32,.35);border-radius:2px}.toc-add a:hover{color:var(--pencil);border-color:var(--pencil)}.toc-add .plus{font-style:normal;font-size:1rem}.btn-danger{background:transparent;border-color:#a8453f59;color:var(--danger);flex-shrink:0;align-self:center}.btn-danger:hover{background:var(--danger-dim);border-color:#a8453f99;color:var(--danger)}.btn-icon{padding:.5rem;aspect-ratio:1}.trash-icon,.refresh-icon{width:.9rem;height:.9rem;display:block}.section-list .locked{opacity:.45;padding:.4rem .1rem}.section-card{display:flex;flex-direction:column;gap:.5rem;padding:.6rem 0;border-bottom:1px solid rgba(42,37,32,.12)}.section-list .lock{font-size:.8rem;font-style:italic;color:var(--ink-faint)}.section-card strong{font-family:Georgia,serif;font-size:1.05rem;color:var(--ink)}.section-card span{font-size:.78rem;color:var(--ink-soft)}.step-chips{display:flex;flex-wrap:wrap;gap:.9rem}.step-chip{display:inline-flex;align-items:center;justify-content:center;padding:0;background:transparent;border:none;color:var(--ink-soft);font:inherit;font-size:.82rem;cursor:pointer;text-decoration:none;transition:color .15s ease}.step-chip:before{content:"[";margin-right:.1rem;opacity:.5}.step-chip:after{content:"]";margin-left:.1rem;opacity:.5}.step-chip:hover{color:var(--pencil)}.step-chip.active{color:var(--pencil);font-weight:600}.midi-device-row{display:flex;align-items:center;gap:.5rem}.midi-device-row select{flex:1;min-width:0}.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.1rem;font-size:.85rem}.field.checkbox{flex-direction:row;align-items:center;gap:.6rem}.field input[type=range]{accent-color:var(--pencil)}.field input[type=checkbox]{width:1.05rem;height:1.05rem;accent-color:var(--pencil)}.field select{padding:.4rem .6rem;background-color:#fffdf7;color:var(--ink);border:1px solid rgba(42,37,32,.3);border-radius:var(--radius-sm);font:inherit}.field select:focus{outline:none;border-color:var(--pencil)}.dialog{padding:1rem 0}.dialog h2{margin-top:0;font-size:1.05rem}.dialog p{font-size:.85rem;color:var(--ink-soft)}.row{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin-top:1rem}.track-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}.track-row{margin-top:0;gap:.5rem;justify-content:flex-start;cursor:pointer;font-size:.85rem}.track-row input[type=checkbox]{width:1.05rem;height:1.05rem;accent-color:var(--pencil);flex-shrink:0}.score-area{position:relative}.header-dropdown{position:relative;display:inline-block}.header-dropdown-trigger{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-bottom:1px dotted var(--ink-soft);padding:0 1.1rem 0 0;font:inherit;font-style:italic;color:var(--ink-soft);cursor:pointer;position:relative}.header-dropdown-trigger:after{content:"▾";position:absolute;right:0;top:50%;transform:translateY(-50%);font-style:normal;color:var(--ink-faint)}.header-dropdown-trigger:hover,.header-dropdown-trigger[aria-expanded=true]{color:var(--ink);border-bottom-color:var(--ink)}.header-dropdown-menu{position:absolute;top:calc(100% + .5rem);left:50%;transform:translate(-50%);z-index:50;list-style:none;margin:0;padding:.35rem;background:#fffdf7;border:1px solid rgba(42,37,32,.2);border-radius:var(--radius-sm);box-shadow:0 8px 24px #2a25202e;max-height:16rem;overflow-y:auto;min-width:11rem;text-align:left}.header-dropdown-menu button{display:block;width:100%;text-align:left;padding:.4rem .7rem;border:none;background:transparent;font:inherit;font-style:normal;font-size:.85rem;color:var(--ink);border-radius:var(--radius-sm);cursor:pointer}.header-dropdown-menu button:hover{background:var(--pencil-dim)}.header-dropdown-menu button.active{color:var(--pencil);font-weight:600}.page-nav{position:absolute;top:0;bottom:0;width:12%;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .2s ease;background:none;border:none}.page-nav:hover,.page-nav:focus-visible{opacity:1}.page-nav.prev{left:0;justify-content:flex-start}.page-nav.next{right:0;justify-content:flex-end}.page-nav .chevron{font-size:1.8rem;color:var(--ink-soft)}.sheet-footer{margin-top:1rem;display:flex;align-items:center;gap:1.25rem}.progress-hairline{flex:1;min-width:0;height:1px;background:#2a25202e;position:relative}.progress-hairline-fill{position:absolute;left:0;top:-1px;height:3px;background:var(--pencil);opacity:.7;transition:width .2s ease}.sheet-footer .fraction{flex-shrink:0;font-size:.78rem;font-style:italic;color:var(--ink-soft);white-space:nowrap}.practice-footer-bar--floating{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:min(94vw,960px);z-index:40;background:var(--paper);padding:.9rem 1.5rem 1rem;border-radius:0}.practice-footer-bar--floating:before{content:"";position:absolute;left:1.5rem;right:1.5rem;top:0;height:1px;background:#2a252026}.practice-footer-bar--floating .sheet-footer{margin-top:0}.osmd{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:transparent;position:relative}.osmd-surface{width:100%;min-height:100%;overflow-x:hidden}.osmd svg{display:block}.osmd .vf-measure.dimmed{opacity:.22}.osmd .vf-measure.section-active{opacity:1}.osmd .vf-measure.hand-dimmed{opacity:.22}.osmd #cursorImg-0,.osmd .cursor,.osmd .osmdCursor{display:none!important}.osmd .vf-notehead.practice-note-highlight path,.osmd .vf-flag.practice-note-highlight path,.osmd .vf-accidental.practice-note-highlight path,.osmd .vf-articulation.practice-note-highlight path{fill:var(--highlight)!important;stroke:none!important;filter:drop-shadow(0 0 3px var(--highlight-glow))}.osmd .vf-stem.practice-note-highlight path{stroke:var(--highlight)!important;filter:drop-shadow(0 0 3px var(--highlight-glow))}.practice{max-width:none}.practice-score-paper{position:relative;min-height:55vh;display:flex;flex-direction:column}.practice-score-paper .osmd{scrollbar-width:thin;scrollbar-color:rgba(42,37,32,.25) transparent;scrollbar-gutter:stable}.practice-score-paper .osmd::-webkit-scrollbar{width:6px}.practice-score-paper .osmd::-webkit-scrollbar-track{background:transparent}.practice-score-paper .osmd::-webkit-scrollbar-thumb{background-color:#2a252040;border-radius:999px;border:2px solid transparent;background-clip:padding-box}.practice-score-paper .osmd::-webkit-scrollbar-corner{background:transparent}.section-bracket{stroke:var(--pencil)}.practice-prompt{margin:0 0 .85rem;padding-left:.75rem;border-left:2px solid var(--highlight);display:flex;flex-direction:column;gap:.2rem}.practice-prompt strong{font-family:Georgia,serif;font-size:1.3rem;font-weight:600;color:var(--ink)}.practice-prompt .muted{font-size:.82rem}.practice-transition{margin:.75rem 0;padding:.85rem 0;border-top:1px solid rgba(42,37,32,.15);border-bottom:1px solid rgba(42,37,32,.15)}.practice-transition p{margin:0}.continue-btn{margin-bottom:1.25rem}.full-song-btn{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;width:100%;margin-bottom:1.5rem;text-align:left}.full-song-meta{font-size:.8rem;font-style:italic;color:var(--ink-soft)}.settings-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#0a08068c;display:flex;align-items:center;justify-content:center;padding:2rem}.settings-card{width:min(90vw,600px);max-height:85vh;overflow-y:auto;background:var(--paper);border-radius:2px;box-shadow:0 20px 50px #00000080;padding:1.5rem 1.6rem 1.8rem;position:relative}.settings-card h2{margin:0 0 1rem;font-size:1.05rem;font-weight:600;color:var(--ink);border-bottom:1px solid rgba(42,37,32,.15);padding-bottom:.5rem}.settings-close{position:absolute;top:.9rem;right:1rem;background:none;border:none;font-size:1.1rem;color:var(--ink-soft);cursor:pointer}.help-icon-wrap{position:relative;display:inline-flex}.help-icon{width:1.05rem;height:1.05rem;flex-shrink:0;border-radius:50%;border:1px solid var(--pencil);background:none;color:var(--pencil);font-size:.65rem;font-family:Georgia,serif;font-style:italic;line-height:1;padding:0;cursor:pointer}.help-icon:hover{background:var(--pencil-dim)}.help-bubble{position:absolute;z-index:10;top:1.4rem;left:0;width:18rem;max-width:60vw;background:var(--paper);border:1px solid rgba(42,37,32,.25);box-shadow:0 8px 20px #00000040;padding:.65rem .8rem;font-size:.78rem;font-style:normal;font-weight:400;line-height:1.5;color:var(--ink-soft)}.settings-close:hover{color:var(--ink)}@media(max-width:640px){.main{padding:0 0 4vh}.page{width:100%;border-radius:0;padding:1.75rem 1.25rem 2rem}.practice-score-paper{min-height:45vh}.osmd{min-height:280px;max-height:none}.settings-card{width:100%}}