:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#20211f;--muted:#74756f;--paper:#f5f0e6;--panel:#fffdf8;--green:#233f38;--amber:#d5823c;--line:#d9d0c1;--shadow:0 24px 70px #231f1924;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;--sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{min-width:900px;min-height:100vh;color:var(--ink);font-family:var(--sans);background:radial-gradient(circle at 9% 5%,#d5823c1c,#0000 27rem),linear-gradient(135deg,#f1ebdf,#e9e2d7);margin:0}button,input,textarea{font:inherit}button{color:inherit}.app-shell{grid-template-rows:68px 1fr;min-height:100vh;display:grid}.topbar{z-index:20;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#faf7f0db;border-bottom:1px solid #48433a24;grid-template-columns:1fr auto 1fr;align-items:center;gap:22px;padding:0 28px;display:grid}.topbar-side{align-items:center;gap:10px;display:flex}.topbar-side.end{justify-content:flex-end}.brand{color:var(--green);letter-spacing:.14em;text-transform:uppercase;margin-left:3px;font-size:13px;font-weight:750}.hamburger{font-size:20px;line-height:1}.icon-button,.action-button{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;height:38px;transition:all .18s}.icon-button{place-items:center;width:38px;display:grid}.icon-button:hover,.action-button:hover{border-color:var(--line);background:#ffffffb3}.action-button{padding:0 13px;font-size:13px;font-weight:680}.action-button.primary{color:#fff;background:var(--green)}.action-button.danger:hover,.action-button.destructive{color:#9a392e;background:#fff3f0;border-color:#ecd0ca}.title-wrap{text-align:center;min-width:260px}.title-button{text-overflow:ellipsis;white-space:nowrap;cursor:text;background:0 0;border:1px solid #0000;border-radius:9px;max-width:420px;padding:7px 12px;font-size:17px;font-weight:650;overflow:hidden}.title-button:hover{border-color:var(--line);background:#fff9}.title-input{border:1px solid var(--amber);text-align:center;border-radius:9px;outline:none;width:360px;padding:7px 12px;font-size:17px;font-weight:650;box-shadow:0 0 0 3px #d5823c1f}.copy-wrap{position:relative}.copy-error{color:#9a392e;width:max-content;font-size:11px;position:absolute;top:43px;right:0}.workspace{padding:58px 42px 80px}.editor-frame{width:min(1120px,100vw - 84px);margin:0 auto}.editor-heading{justify-content:flex-end;margin:0 3px 18px;display:flex}.autosave{color:var(--muted);align-items:center;gap:8px;font-size:12px;display:flex}.autosave-dot{background:#7f9d7d;border-radius:50%;width:7px;height:7px}.autosave.warning{color:#9a392e}.autosave.warning .autosave-dot{background:#bf5145}.notebook-metadata{font-family:var(--sans);border-bottom:1px solid #233f3824;flex-wrap:wrap;align-items:flex-start;gap:12px 16px;margin:0 0 30px;padding:0 0 24px;display:flex}.metadata-field{min-width:112px;color:var(--muted);letter-spacing:.02em;flex-direction:column;gap:6px;font-size:11px;font-weight:650;display:flex}.metadata-artist{flex:220px;min-width:180px}.metadata-key{min-width:100px}.metadata-tonality,.metadata-accidentals{min-width:110px}.metadata-tempo{min-width:128px}.metadata-status{min-width:120px}.metadata-capo{min-width:105px}.metadata-practiced{flex:230px;min-width:210px}.metadata-field input,.metadata-field select{box-sizing:border-box;border:1px solid var(--line);min-height:34px;color:var(--ink);font:500 13px var(--sans);background:#ffffff8c;border-radius:8px;outline:none}.metadata-field input{width:100%;min-width:0;padding:7px 9px}.metadata-field select{width:100%;padding:6px 28px 6px 9px}.metadata-field input:focus,.metadata-field select:focus{border-color:var(--amber);box-shadow:0 0 0 2px #d5823c24}.metadata-input-unit{color:var(--muted);align-items:center;gap:6px;font-size:11px;font-weight:600;display:flex}.metadata-input-unit input{width:68px}.metadata-date-control{gap:7px;display:flex}.metadata-date-control input{min-width:140px}.metadata-clear{border:1px solid var(--line);min-height:34px;color:var(--muted);font:600 12px var(--sans);cursor:pointer;background:#ffffff73;border-radius:8px;padding:6px 9px}.metadata-clear:disabled{opacity:.45;cursor:default}.metadata-error{color:#9a392e;letter-spacing:0;max-width:130px;font-size:11px;font-weight:550}.paper{background:linear-gradient(#655b4809 1px,transparent 1px) 0 0/100% 26px,var(--panel);min-height:440px;box-shadow:var(--shadow);border:1px solid #7c6f5c2e;border-radius:18px;outline:none;padding:48px 50px 58px;position:relative;overflow:auto}.paper:focus-visible{box-shadow:var(--shadow),0 0 0 3px #d5823c33}.paper:before{content:"";background:#d5823c2e;width:1px;position:absolute;inset:0 auto 0 27px}.notebook-paper{padding-block:58px}.notebook-section{grid-template-columns:34px minmax(0,1fr);gap:14px;margin-bottom:25px;display:grid;position:relative}.notebook-section:last-child{margin-bottom:0}.notebook-section-body{min-width:0}.section-editor{outline:none;min-width:max-content}.section-move-controls{flex-direction:column;align-items:center;gap:6px;padding-top:2px;display:flex}.section-move-controls button{border:1px solid var(--line);width:30px;height:30px;color:var(--green);cursor:pointer;background:#ffffffb8;border-radius:8px;place-items:center;display:grid}.section-move-controls button:hover:not(:disabled){border-color:var(--amber);background:#fff}.section-move-controls button:disabled{opacity:.35;cursor:default}.system{width:80ch;font:15px/1.8 var(--mono);margin:0 0 44px}.system:last-child{margin-bottom:0}.chord-row,.count-row,.tab-row{white-space:pre;height:1.8em}.chord-row{color:var(--green);font-weight:750;position:relative}.carried-chord{z-index:2;pointer-events:none;position:absolute;top:0;left:1ch}.count-row{color:var(--amber)}.tab-row{color:#44453f}.system-leading-bar{color:var(--green);font-weight:800}.grid-button{font:inherit;vertical-align:middle;white-space:pre;cursor:text;background:0 0;border:0;margin:0;padding:0;line-height:1.55em}.cell,.chord-slot{border-radius:3px;min-width:1ch;height:1.55em;display:inline-block}.cell.active{color:#fff;background:var(--amber);outline:2px solid #d5823c40}.measure{width:1ch;color:var(--green);cursor:pointer;font-weight:800}.measure.active{color:var(--amber);outline:2px solid var(--amber)}.chord-slot{text-align:left;position:relative}.chord-slot.active{box-shadow:inset 0 -2px var(--amber);background:#d5823c24;outline:none}.chord-label{z-index:1;white-space:pre;position:absolute;top:0;left:0}.count-slot{border-radius:3px;width:1ch;height:1.55em}.count-slot.active{color:#fff;background:var(--amber);outline:2px solid #d5823c40}.count-measure{width:1ch}.empty-fill{color:#b8b4ab}.row-heading,.row-heading-input{width:100%;height:1.8em;color:var(--green);font:600 20px/1.8 var(--sans);margin:0 0 9px;display:block}.row-heading{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.row-heading-input{border:1px solid var(--amber);background:#ffffffb8;border-radius:6px;outline:none;padding:0 8px;box-shadow:0 0 0 3px #d5823c1f}.lyrics-section-editor{width:min(80ch,100%);min-width:0}.lyrics-textarea{resize:none;color:#363832;width:100%;min-height:8.5em;font:15px/1.65 var(--mono);tab-size:4;white-space:pre-wrap;overflow-wrap:break-word;background:0 0;border:0;border-radius:0;outline:none;padding:0;display:block;overflow:hidden}.grid-button.selected{vertical-align:top;background:#233f382b;border-radius:0;height:1.8em;line-height:1.8em}.grid-button.selected.active{color:#fff;background:var(--amber);box-shadow:none}.selection-separator{vertical-align:top;background:#233f382b;height:1.8em;line-height:1.8em;display:inline-block}.editor-error{color:#9a392e;margin:12px 5px 0;font-size:12px}.hintbar{color:var(--muted);flex-wrap:wrap;gap:8px 20px;margin-top:18px;padding:0 5px;font-size:12px;display:flex}kbd{color:#565650;font:10px var(--sans);background:#ffffff9e;border:1px solid #ccc4b7;border-bottom-width:2px;border-radius:5px;padding:2px 6px}.scrim{z-index:30;visibility:hidden;opacity:0;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#161b1847;transition:all .22s;position:fixed;inset:0}.scrim.open{visibility:visible;opacity:1}.sidebar{z-index:40;color:#f6f1e8;background:var(--green);flex-direction:column;width:350px;padding:25px 18px 20px;transition:transform .24s cubic-bezier(.2,.8,.2,1);display:flex;position:fixed;inset:0 auto 0 0;transform:translate(-103%);box-shadow:20px 0 65px #0e1f1a33}.sidebar.open{transform:translate(0)}.sidebar-head{justify-content:space-between;align-items:center;padding:0 7px 18px;display:flex}.sidebar-head h2{margin:0;font:500 24px Georgia,serif}.sidebar .icon-button{color:#f6f1e8}.new-scratchpad{color:inherit;text-align:left;cursor:pointer;background:#ffffff14;border:1px solid #ffffff24;border-radius:10px;margin:0 7px 12px;padding:10px 12px}.sidebar-label{color:#aebfb8;letter-spacing:.17em;text-transform:uppercase;margin:8px 10px;font-size:10px;font-weight:800}.scratch-list{gap:5px;display:grid;overflow:auto}.scratch-item{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:12px;grid-template-columns:1fr auto;gap:10px;padding:13px 12px;display:grid}.scratch-item:hover,.scratch-item.active{background:#ffffff17}.scratch-item.active{border-color:#ffffff1f}.scratch-title,.scratch-time{display:block}.scratch-title{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:680;overflow:hidden}.scratch-time{color:#aebfb8;margin-top:4px;font-size:11px}.active-pip{background:var(--amber);border-radius:50%;align-self:center;width:7px;height:7px}.sidebar-footer{border-top:1px solid #ffffff1a;margin-top:auto;padding-top:18px}.help-link{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:10px;padding:11px}dialog{width:min(720px,100vw - 60px);max-height:calc(100vh - 80px);color:var(--ink);background:var(--panel);border:0;border-radius:18px;padding:0;overflow:hidden;box-shadow:0 28px 90px #10161347}dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#141b177a}.modal-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:24px 28px 19px;display:flex}.modal-head h2,.confirm-body h2{color:var(--green);margin:0;font:500 25px Georgia,serif}.modal-body{max-height:68vh;padding:25px 28px 32px;overflow:auto}.modal-body h3{color:var(--green);letter-spacing:.14em;text-transform:uppercase;margin:5px 0 14px;font-size:12px}.reference-grid,.shortcut-grid{grid-template-columns:repeat(2,1fr);gap:8px 24px;display:grid}.reference-row{border-bottom:1px solid #ece6dc;grid-template-columns:70px 1fr;gap:10px;padding:8px 0;font-size:13px;display:grid}.reference-row small{color:var(--muted);font-family:var(--mono);margin-top:3px;display:block}.syntax{color:var(--amber);font-family:var(--mono);font-weight:700}.shortcut{border-bottom:1px solid #ece6dc;justify-content:space-between;align-items:center;padding:10px 0;font-size:13px;display:flex}.reference-note{color:var(--muted);font-size:12px}.confirm-dialog{width:420px}.confirm-body{padding:28px}.confirm-body p{color:var(--muted)}.confirm-actions{justify-content:flex-end;gap:8px;margin-top:24px;display:flex}.add-section-control{z-index:25;position:fixed;bottom:24px;left:24px}.add-section-button{color:#fff;background:var(--green);cursor:pointer;border:1px solid #233f382e;border-radius:12px;height:42px;padding:0 16px;font-size:13px;font-weight:720;box-shadow:0 12px 32px #231f1933}.add-section-button:hover{background:#2d5047}.add-section-menu{border:1px solid var(--line);background:var(--panel);border-radius:12px;gap:6px;width:220px;padding:8px;display:grid;position:absolute;bottom:50px;left:0;box-shadow:0 18px 48px #231f1933}.add-section-menu button{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:8px;flex-direction:column;align-items:flex-start;gap:2px;padding:11px 12px;display:flex}.add-section-menu button:hover,.add-section-menu button:focus-visible{background:#f3ece1}.add-section-menu strong{color:var(--green);font-size:14px}.add-section-menu span{color:var(--muted);font-size:11px}.new-dialog{width:min(650px,100vw - 60px)}.eyebrow{color:var(--amber);letter-spacing:.16em;text-transform:uppercase;margin:0 0 5px;font-size:10px;font-weight:800}.format-choices{grid-template-columns:1fr 1fr;gap:16px;padding:28px;display:grid}.format-choice{border:1px solid var(--line);min-height:190px;color:var(--ink);text-align:left;cursor:pointer;background:#fffdf9;border-radius:15px;flex-direction:column;align-items:flex-start;padding:24px;transition:all .18s;display:flex}.format-choice:hover{border-color:var(--amber);transform:translateY(-2px);box-shadow:0 12px 30px #231f1917}.format-choice strong{color:var(--green);margin:18px 0 7px;font:500 22px Georgia,serif}.format-choice>span:last-child{color:var(--muted);font-size:13px;line-height:1.5}.format-icon{width:58px;height:45px;color:var(--amber);font:700 28px var(--mono);background:#f7ecdf;border-radius:10px;place-items:center;display:grid}.format-icon.chord{color:var(--green);background:#e8eeea;font-size:15px}.new-dialog-actions{margin:0;padding:0 28px 24px}.chord-grid-paper{min-height:440px;padding-block:58px}.chord-grid-scroll{min-width:max-content}.chord-grid-row{color:#41433e;width:max-content;font:15px/1.55 var(--mono);align-items:stretch;margin-bottom:42px;display:flex}.chord-grid-row:last-child{margin-bottom:0}.chord-grid-measure{box-sizing:content-box;border-left:2px solid #0000;position:relative}.chord-grid-measure.last{border-right:2px solid #0000}.chord-grid-measure.selected:after{content:"";z-index:0;pointer-events:none;background:#233f382b;position:absolute;inset:0}.chord-grid-counts,.chord-grid-chords{z-index:1;display:grid;position:relative}.chord-grid-counts{height:1.65em;color:var(--amber)}.chord-grid-chords{height:2.15em;color:var(--green);font-weight:750}.chord-grid-chords:before,.chord-grid-measure.last .chord-grid-chords:after{content:"";background:var(--green);width:2px;position:absolute;top:0;bottom:0}.chord-grid-chords:before{left:-2px}.chord-grid-measure.last .chord-grid-chords:after{right:-2px}.chord-grid-count,.chord-grid-chord{min-width:0;height:100%;color:inherit;font:inherit;text-align:left;white-space:pre;cursor:text;background:0 0;border:0;border-radius:0;padding:0;overflow:hidden}.chord-grid-chord{border-top:1px solid #233f3829;padding-block:3px 2px}.chord-grid-repeat-end{white-space:pre;pointer-events:none;padding-block:3px 2px;position:absolute;right:0}.chord-grid-count.active{color:#fff;background:var(--amber)}.chord-grid-chord.active{color:var(--green);box-shadow:inset 0 -3px var(--amber);background:#d5823c33}.chord-grid-measure.selected .chord-grid-count.active,.chord-grid-measure.selected .chord-grid-chord.active{color:#fff;background:var(--amber)}.chord-row-end{display:none}.chord-grid-inline-tab{z-index:1;color:#44453f;position:relative}.chord-grid-inline-row{white-space:pre;width:100%;height:1.55em;display:flex;position:relative}.chord-grid-inline-row:before,.chord-grid-inline-row:after{content:"";background:var(--green);width:2px;position:absolute;top:0;bottom:0}.chord-grid-inline-row:before{left:-2px}.chord-grid-inline-row:after{right:-2px}.chord-grid-inline-cell{min-width:0;height:100%;color:inherit;font:inherit;text-align:left;white-space:pre;cursor:text;background:0 0;border:0;border-radius:3px;padding:0;line-height:1.55em}.chord-grid-inline-cell.active{color:#fff;background:var(--amber);outline:2px solid #d5823c40}.chord-grid-inline-separator,.chord-grid-inline-fill,.chord-grid-inline-repeat{height:100%;line-height:1.55em;display:inline-block}.chord-grid-inline-repeat{color:var(--green);font-weight:800}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--amber);outline-offset:2px}@media (width<=950px){.workspace{padding-inline:24px}.editor-frame{width:calc(100vw - 48px)}.paper{padding-inline:36px}.brand{display:none}.notebook-metadata{gap:12px}.metadata-field{flex:140px}.metadata-artist,.metadata-practiced{flex-basis:240px}}.chord-grid-inline-tab{margin-top:8px}.chord-grid-inline-row:first-child:before,.chord-grid-inline-row:first-child:after{top:calc(50% - 1px)}.chord-grid-inline-row:last-child:before,.chord-grid-inline-row:last-child:after{bottom:calc(50% - 1px)}