@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--bg:#101a19;--panel:#192522;--card:#20302b;--text:#f7f7ee;--muted:#a1ada5;--border:#36443e;--accent:#d8fa5a;--warm:#ff9a65;--tabbg:#eff1e8;--tabtext:#17231c;--display:'Space Grotesk',sans-serif;--body:'DM Sans',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:inherit;text-decoration:none}.top{padding:20px max(24px,calc((100% - 1120px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.brand{font:700 28px var(--display);letter-spacing:-1.8px;display:inline-flex;align-items:center}.brand span:nth-of-type(2){font-weight:500}.brand-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--accent);color:#101a19;letter-spacing:0;font:700 20px var(--body);margin-right:10px}.brand-dot,.orange{color:var(--warm)}.topright{display:flex;gap:18px;align-items:center}.pill{border:1px solid var(--border);padding:8px 12px;border-radius:24px;font-weight:800;font-size:10px;letter-spacing:1.4px}.live-dot{display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:50%;margin-right:7px}.icon-btn{border:0;background:transparent;color:var(--text);font-size:24px;padding:5px 8px}.intro{max-width:1120px;margin:auto;padding:90px 24px 94px}.eyebrow,.micro,.song-eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;color:var(--accent)}.accent-line{display:inline-block;width:25px;height:2px;background:var(--accent);vertical-align:middle;margin-right:10px}.intro h1{font:700 clamp(56px,9vw,112px)/.99 var(--display);letter-spacing:-.085em;margin:30px 0}.intro h1 em{font-style:normal;color:var(--accent)}.intro p{font-size:19px;line-height:1.7;max-width:570px;color:var(--muted)}.searchbox{max-width:640px;height:64px;border-radius:12px;background:#f4f5ed;display:flex;align-items:center;padding:0 17px;margin-top:44px;gap:12px}.searchglass{font-size:32px;color:#506157}.searchbox input{border:0;outline:0;background:transparent;flex:1;min-width:0;color:#20302b;font-size:17px}.searchbox kbd{border:1px solid #cdd4c7;border-radius:6px;padding:5px 9px;color:#728072}.subline{color:var(--muted);font-size:13px;margin-top:15px}.subline .sep{padding:0 8px}.catalog{background:#e9ece3;color:#1b2821;padding:78px max(24px,calc((100% - 1120px)/2)) 95px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}.catalog .micro{color:#68794b}.section-heading h2{font:700 clamp(30px,4vw,47px)/1.1 var(--display);letter-spacing:-2px;margin:15px 0}.btn-outline{border:1px solid #536458;border-radius:9px;padding:13px 20px;background:transparent;color:#20302b;font-weight:700;white-space:nowrap}.btn-outline:hover{background:#dce4cf}.filters{display:flex;gap:9px;margin:32px 0 20px}.filter{border:1px solid #cbd2c5;padding:10px 15px;background:transparent;border-radius:99px;font-size:13px;color:#667469}.filter.active{background:#20382c;color:white;border-color:#20382c}.list{display:grid;gap:10px}.tabrow{background:#fff;border:1px solid #d8dcd3;border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:20px 22px;gap:10px;transition:transform .15s,border-color .15s}.tabrow:hover{border-color:#8ea779;transform:translateY(-2px)}.rowmain{display:flex;align-items:center;gap:18px;text-align:left;background:none;border:0;min-width:0;flex:1;color:#20302b;padding:0}.songbadge{width:52px;height:52px;border-radius:12px;background:#ebf0d8;display:grid;place-items:center;font-size:24px;flex-shrink:0}.rowname{font-weight:800;font-size:18px}.rowartist{color:#708174;font-size:13px;margin-top:4px}.rowend{display:flex;align-items:center;gap:10px}.tag{background:#f0f2e9;font-size:11px;color:#637462;padding:8px 10px;border-radius:8px;white-space:nowrap}.rowheart{font-size:25px;background:transparent;border:0;color:#8e9b8d;min-width:35px}.rowheart.on{color:#ef805c}.rowarrow{font-size:25px;color:#658266}.empty{color:#54675a}.about{max-width:1168px;margin:auto;padding:92px 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.mini-symbol{font-size:40px;color:var(--accent)}.mini-card h3{font:700 24px var(--display);letter-spacing:-.7px;margin:18px 0 10px}.mini-card p{color:var(--muted);line-height:1.65;margin:0}.ad-wrap{padding:0 24px 90px}.ad{max-width:1120px;margin:auto;min-height:105px;border:1px dashed #45564c;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#8fa092}.ad small{font-size:10px;letter-spacing:1px;color:#687c6f}.ad span{font-size:14px}footer{border-top:1px solid var(--border);padding:35px max(24px,calc((100% - 1120px)/2));display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}footer .brand{font-size:23px}footer p,footer small{font-size:12px;color:var(--muted)}footer small{max-width:350px}
/* Reader */.reader-shell{position:fixed;inset:0;z-index:5;background:var(--bg);overflow-y:auto;overscroll-behavior:contain}.reader-shell[hidden]{display:none}.readerbar{position:sticky;top:0;z-index:6;display:flex;align-items:center;justify-content:space-between;padding:12px max(17px,calc((100% - 1040px)/2));background:var(--bg);border-bottom:1px solid var(--border)}.back{border:0;background:none;color:var(--text);font-size:16px;font-weight:700}.reader-actions{display:flex;gap:12px}.reader-content{max-width:1074px;margin:auto;padding:48px 17px 90px}.reader-content h1{font:700 clamp(38px,6vw,64px) var(--display);letter-spacing:-3px;margin:17px 0 5px}.songartist{font-size:17px;color:var(--muted);margin:0 0 30px}.reader-tools{border:1px solid var(--border);border-radius:14px;padding:18px;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:22px;align-items:center;background:var(--panel)}.setting label{display:flex;justify-content:space-between;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap}.setting strong{color:var(--accent)}.setting input{display:block;width:100%;accent-color:#d8fa5a;margin-top:14px}.playbtn{padding:14px 17px;background:var(--accent);color:#16231b;border:0;border-radius:10px;font-size:13px;font-weight:800;white-space:nowrap}.readersupport{font-size:12px;color:var(--muted);margin:24px 0 12px;display:flex;justify-content:space-between}.text-link{color:var(--accent);background:transparent;border:0;text-decoration:underline}.tab-viewport{background:var(--tabbg);color:var(--tabtext);border-radius:12px;padding:26px 18px;overflow-x:auto;min-height:260px}.tab-viewport pre{font:500 12px/1.6 'DM Mono','Courier New',monospace;letter-spacing:0;white-space:pre;tab-size:4;margin:0;width:max-content;max-width:none}.end-note{text-align:center;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:2px;padding:32px}.end-note span{color:var(--accent)}body.reader-open{overflow:hidden}body.focus .readerbar,body.focus .reader-tools,body.focus .readersupport,body.focus .song-eyebrow,body.focus .songartist{display:none}body.focus .reader-content{padding-top:8px}body.focus .reader-content h1{font-size:20px;letter-spacing:0;margin:8px 0}body.focus .tab-viewport{min-height:95vh}body.light{--bg:#f7f8f1;--panel:#e8eee1;--card:#dae4d4;--text:#17241c;--muted:#59695c;--border:#cad5c8;--accent:#668d23;--tabbg:#fff;--tabtext:#1a2a1d}body.light .pill .live-dot{background:#668d23}
/* editor */dialog{border:1px solid #4b6053;background:#192522;color:#f7f7ee;border-radius:18px;width:min(660px,calc(100vw - 26px));max-height:90vh;padding:25px;box-shadow:0 30px 90px #0007}dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.dialoghead{display:flex;justify-content:space-between}.dialoghead h2{font:700 35px var(--display);margin:5px 0}.xbtn{background:transparent;border:0;color:white;font-size:32px;align-self:start}dialog p{color:#a8baaa;font-size:13px;line-height:1.6;margin:8px 0 22px}dialog label:not(.upload-label){display:block;font-size:12px;font-weight:800;color:#ccd8cb;margin:16px 0}dialog input:not([type=file]),dialog textarea{display:block;width:100%;border:1px solid #42564a;border-radius:9px;background:#101a19;color:#fff;padding:12px;margin-top:8px;outline:0}dialog textarea{resize:vertical;height:205px;font:12px/1.5 'DM Mono',monospace;white-space:pre}dialog code{color:#d8fa5a}.dialogbuttons{display:flex;align-items:center;justify-content:space-between;gap:10px}.upload-label{font-size:13px;cursor:pointer;color:#d8fa5a}.savebtn{background:#d8fa5a;color:#18251c;border:0;border-radius:9px;padding:14px 20px;font-weight:800}.formerror{color:#ff9a65;margin-top:12px;font-size:13px}
@media(max-width:700px){.top{padding:14px 18px}.pill{font-size:8px;padding:7px}.intro{padding:64px 22px 72px}.intro h1{font-size:clamp(49px,12vw,77px);letter-spacing:-.065em}.intro p{font-size:16px}.searchbox{margin-top:30px}.catalog{padding:58px 18px 70px}.section-heading{align-items:center}.section-heading h2{font-size:29px;letter-spacing:-1.4px}.btn-outline{font-size:12px;padding:10px}.tabrow{padding:14px 12px}.songbadge{width:42px;height:42px}.rowname{font-size:15px}.rowartist{font-size:12px}.rowmain{gap:12px}.tag{display:none}.about{grid-template-columns:1fr;gap:36px;padding:60px 23px}.reader-content{padding:27px 10px 60px}.reader-content h1{letter-spacing:-1.6px}.reader-tools{grid-template-columns:1fr 1fr;gap:18px 13px;padding:13px}.playbtn{align-self:end}.speedsetting{display:none}.readerbar{padding:10px 13px}.tab-viewport{padding:15px 9px}.readersupport{padding:0 5px}.filters{gap:7px}.filter{font-size:12px;padding:9px 11px}}@media print{body{background:white!important;color:black!important}.top,main,footer,.readerbar,.reader-tools,.readersupport,.end-note{display:none!important}.reader-shell{position:static;overflow:visible}.reader-content{padding:0;max-width:none}.reader-content h1{font-size:23pt;color:#000}.songartist{color:#333}.tab-viewport{padding:0;overflow:visible;background:white!important;color:black!important}.tab-viewport pre{color:black!important;font-size:10px!important;white-space:pre}.reader-shell{display:block!important}}

/* Transposition and capo toolbar */
.transpose-tools{margin:12px 0 0;padding:15px 18px;border:1px solid var(--border);border-radius:14px;background:var(--panel)}.trans-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:15px}.trans-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.trans-grid label{font-size:12px;color:var(--muted)}.trans-grid label span{color:var(--accent);font-weight:700}.stepper{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--border);border-radius:10px;margin-top:7px;overflow:hidden}.stepper button{background:var(--card);border:none;color:var(--text);font-size:22px;width:44px;height:42px}.stepper output{color:var(--text);font-size:13px;font-weight:800}.pitch-hint{color:var(--muted);font-size:12px;line-height:1.5;margin:12px 0 0}body.focus .transpose-tools{display:none}@media(max-width:400px){.transpose-tools{padding:11px}.trans-grid{gap:9px}.stepper button{width:37px}}@media print{.transpose-tools{display:none!important}}

.smart-controls{display:flex;flex-wrap:wrap;gap:10px 22px;margin:16px 0 6px;color:var(--muted);font-size:13px}.smart-controls input{accent-color:var(--accent)}
.smart-tab{display:flex;flex-direction:column;gap:20px}.smart-row{display:flex;min-width:0;white-space:nowrap}.smart-measure{flex:none;position:relative;padding-top:26px;min-width:0;font:500 var(--tab-font,12px)/1.7 'DM Mono','Courier New',monospace}.smart-measure pre{font:inherit;margin:0;width:auto;white-space:pre}.chord-chip{position:absolute;top:0;left:1ch;border:1px solid currentColor;color:var(--tabtext);border-radius:5px;padding:1px 5px;line-height:1.3;font:bold max(11px,var(--tab-font,12px)) system-ui;cursor:pointer;background:var(--tabbg)}.chord-chip:focus-visible{outline:2px solid var(--accent)}.chord-dialog{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:16px;padding:25px;min-width:min(300px,90vw);max-width:95vw}.chord-dialog::backdrop{background:#0009}.chord-close{float:right;border:0;background:none;color:inherit;font-size:20px;min-width:40px;min-height:40px}.chord-dialog h2{margin:4px 0 12px}.chord-diagram-svg{max-width:230px;width:100%;height:auto}.chord-diagram-svg text{fill:var(--text);font:14px system-ui}.chord-diagram-svg line{stroke:var(--text);stroke-width:1.6}.chord-diagram-svg circle{fill:var(--accent)}.chord-dialog p{color:var(--muted);font-size:13px;max-width:260px}
@media print{.smart-controls,.chord-dialog{display:none!important}.smart-measure{color:#000!important}.chord-chip{color:#000;background:white}.smart-row{break-inside:avoid}}
.smart-tab[hidden],#tabContent[hidden]{display:none!important}

.smart-controls select,.dialoghead select,#editTuning,.correction-controls input{background:var(--panel);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:9px;font-size:16px;max-width:100%}.chord-alternate{position:absolute;top:19px;left:1ch;background:transparent;border:0;color:var(--muted);font:10px system-ui;cursor:pointer}.smart-measure{padding-top:43px}.suggestion-line,.correction-controls{display:flex;align-items:center;gap:8px;justify-content:space-between;margin:8px 0}.suggestion-line button,.correction-controls button{padding:8px;border-radius:8px;border:1px solid var(--border);background:var(--panel);color:var(--text)}.correction-controls input{min-width:0;width:100%}#chordCorrectionForm label{font-size:13px}#chordSuggestions{font-size:13px}.chord-dialog{max-height:90%;overflow:auto}

/* Monochrome, generated from fret positions; never store per-chord images. */
.chord-diagram-svg{background:#fff;color:#000;max-width:240px;border:1px solid #ddd;border-radius:4px}
.chord-diagram-svg line{stroke:#000;stroke-width:1.5}
.chord-diagram-svg line.nut{stroke-width:5}
.chord-diagram-svg circle{fill:#000;stroke:none}
.chord-diagram-svg text{fill:#000;font-family:system-ui,sans-serif;font-size:18px;font-weight:500}
.chord-diagram-svg text.fret-label{font-size:12px}

/* v6 compact mobile-first reader and private library */
.account-button{background:transparent;border:1px solid var(--border);border-radius:9px;color:var(--text);padding:10px;font-size:12px}.quick-paste{max-width:640px;margin-top:22px;display:grid;gap:9px}.quick-paste label{font-weight:800}.quick-paste textarea{width:100%;min-height:116px;padding:13px;border:1px solid var(--border);border-radius:12px;background:var(--panel);color:var(--text);font:13px/1.3 monospace}.quick-paste .playbtn{width:max-content}.quick-paste small{color:var(--muted)}.advanced-menu{border:1px solid var(--border);border-radius:12px;margin-top:12px;padding:12px;background:var(--panel)}.advanced-menu summary{cursor:pointer;font-weight:750}.advanced-menu[open] summary{margin-bottom:12px}.advanced-menu .transpose-tools{margin-top:10px}.smart-row{display:block;position:relative;min-width:0;white-space:nowrap;padding-top:29px}.smart-row pre{font:500 var(--tab-font,12px)/1.45 monospace!important;width:auto;white-space:pre}.smart-row .measure-chips{position:absolute;top:0;left:0;width:100%;height:26px}.smart-row .chord-chip{top:0;padding:1px 3px;font-size:clamp(9px,var(--tab-font,12px),13px)}.tab-viewport{overflow-x:hidden}.format-preview{margin-top:15px;max-width:100%;overflow-x:auto;background:var(--tabbg);color:var(--tabtext);padding:12px;border-radius:9px}.format-preview pre{white-space:pre;font-size:10px}.account-dialog{border:1px solid var(--border);border-radius:15px;background:var(--panel);color:var(--text);padding:24px;width:min(430px,95vw)}.account-dialog::backdrop{background:#0009}.account-dialog label{display:block;margin:12px 0}.account-dialog input{display:block;width:100%;padding:12px;margin-top:5px;border-radius:8px}.account-dialog .playbtn{width:100%}.account-dialog .dialogbuttons{display:flex;gap:8px;flex-wrap:wrap}.account-dialog #authMessage{color:var(--muted);font-size:13px}.account-dialog .xbtn{float:right}@media(max-width:700px){.pill{display:none}.account-button{padding:8px;font-size:11px}.intro{padding-top:45px}.intro h1{font-size:clamp(42px,10vw,69px)}.reader-tools{grid-template-columns:1fr 1fr}.smart-row pre{line-height:1.5!important}}

/* v6.1 */
.exit-focus{position:fixed;top:14px;right:14px;z-index:20;border:1px solid #777;border-radius:8px;background:#fff;color:#111;padding:12px 16px;font-weight:750;cursor:pointer} .exit-focus[hidden]{display:none!important}
#printSheet{display:none}
.smart-row{padding-top:32px;margin-bottom:6px;break-inside:avoid}
.smart-tab{gap:14px}
.chord-diagram-svg text.finger-number{fill:#fff;font-size:11px;font-weight:700;text-anchor:middle}
@page{size:letter portrait;margin:12mm}
@media print{#printSheet{display:block!important;color:black!important;background:white!important;padding:0 4mm}#printSheet h1{font:700 21pt Arial,sans-serif;margin:0 0 3mm}#printSheet p{font:10pt Arial,sans-serif;margin:0 0 8mm}#printSheet .print-row{break-inside:avoid;page-break-inside:avoid;margin:0 0 5mm}#printSheet pre{font-family:Consolas,'Courier New',monospace!important;line-height:1.35;white-space:pre;margin:0}header.top,body>main,footer,.reader-shell,dialog{display:none!important}body{background:#fff!important}}

/* Pricing / plan navigation */
.plan-link{display:inline-flex;align-items:center;white-space:nowrap;transition:border-color .2s,background .2s}
.plan-link:hover,.plan-link:focus-visible{border-color:var(--accent);background:var(--panel)}
@media(max-width:700px){.topright{gap:7px}.plan-link{display:inline-flex;font-size:8px;padding:7px 8px;letter-spacing:.5px}.plan-link .live-dot{width:6px;height:6px;margin-right:5px}.account-button{font-size:10px}}
@media(max-width:380px){.topright{gap:4px}.plan-link{font-size:7px;padding:6px}.account-button{padding:7px 5px;font-size:9px}}