:root{color:#263b3e;font-synthesis:none;--pine:#152b30;--green:#2b6c56;--mint:#b6e2ca;--line:#e0e3d9;--muted:#748184;--paper:#fffefa;--danger:#ab453a;background:#f5f3eb;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit;background:#f9fbf6;border:1px solid #ccd5cc;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:10px 15px;font-size:12px;font-weight:600;display:inline-flex}button:hover{background:#e9f1e7;border-color:#98b7a4}button:disabled{opacity:.45;cursor:not-allowed}button[aria-pressed=true]{background:#d3e9d9;border-color:#4a8e6e}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:3px;outline:3px solid #e3b364}button.primary{background:var(--green);border-color:var(--green);color:#fff}button.primary:hover{background:#225943}button.large{padding:16px 22px;font-size:14px}button.icon{background:0 0;padding:7px 11px;font-size:20px;line-height:1}.app{min-height:100dvh}.sidebar{background:var(--pine);color:#e2eee7;z-index:20;flex-direction:column;width:218px;padding:33px 24px;display:flex;position:fixed;inset:0 auto 0 0}.brand{align-items:center;gap:11px;display:flex}.brand-mark{color:var(--mint);letter-spacing:-8px;width:43px;font-family:Georgia,serif;font-size:31px;font-weight:700;display:inline-block}.brand-mark>span{font-size:26px;position:relative;top:6px;left:-1px}.brand b{letter-spacing:-.8px;font-size:22px;font-weight:650}.brand small{letter-spacing:2px;color:#a5b7b4;margin-top:4px;font-size:10px;display:block}.workspace-label{letter-spacing:1.9px;color:#7f9694;margin:60px 0 18px;font-size:8px}.sidebar nav{gap:8px;display:grid}.sidebar nav button{color:#a3b6b4;background:0 0;border:0;justify-content:flex-start;padding:14px;font-size:13px}.sidebar nav button span{width:25px;font-size:18px}.sidebar nav button.active{color:#e1f6e8;background:#2b4346}.sidebar-foot{color:#b0c4bd;margin-top:auto;font-size:10px;line-height:1.8}.sidebar-foot small{color:#7f9893;margin-left:12px;display:block}.local-dot{background:#9ec9a3;border-radius:50%;width:5px;height:5px;margin-right:6px;display:inline-block}main{min-height:100dvh;margin-left:218px;padding-bottom:120px}.topbar{border-bottom:1px solid var(--line);background:#f7f6ef;justify-content:space-between;align-items:center;gap:20px;height:85px;padding:20px 38px;display:flex}.topbar>div{flex-direction:column;gap:7px;display:flex}.eyebrow{letter-spacing:2px;color:#7a8d84;font-size:9px;font-weight:650}.top-label{color:#88928c;font-size:12px}.welcome{max-width:1100px;min-height:620px;margin:65px auto 0;padding:35px 55px;position:relative;overflow:hidden}.pill{color:#50775c;letter-spacing:1px;border:1px solid #ceded0;border-radius:30px;align-items:center;padding:6px 10px;font-size:9px;font-weight:600;display:inline-flex}.welcome h1{letter-spacing:-3px;margin:28px 0;font-family:Georgia,Times New Roman,serif;font-size:clamp(48px,5.7vw,80px);font-weight:400;line-height:1.06}.welcome h1 em{color:var(--green);font-weight:400}.welcome>p{color:#768580;max-width:440px;margin-bottom:25px;font-size:14px;line-height:1.9}.welcome-art{background:#e9ece1;border:1px solid #d9dfd0;border-radius:16px;width:38%;padding:25px 20px;position:absolute;top:125px;right:1%;transform:rotate(-7deg);box-shadow:0 26px 60px #173d2910}.welcome-art>div{border-bottom:1px solid #d6dfd0;align-items:center;gap:14px;height:77px;display:flex}.welcome-art small{letter-spacing:1px;color:#71907c;width:78px;font-size:7px}.welcome-art>div>div{gap:6px;display:flex}.welcome-art i{border-radius:2px;height:8px;display:block}.principles{border-top:1px solid var(--line);color:#62756b;gap:28px;margin-top:70px;padding-top:25px;font-size:11px;display:flex}.principles b{color:#9cae9a;margin-right:10px;font-family:Georgia,serif;font-size:20px;font-weight:400}.welcome>p.privacy{max-width:620px;margin-top:25px;font-size:10px;line-height:1.7}.project-heading{justify-content:space-between;align-items:center;gap:20px;margin:32px 35px 25px;display:flex}.project-heading input{letter-spacing:-1px;background:0 0;border:0;width:600px;max-width:100%;padding:5px 0;font-family:Georgia,serif;font-size:34px;display:block}.project-heading p{color:#8a928b;margin:5px 0;font-size:11px}.segmented{background:#e6ebdf;border-radius:9px;flex-shrink:0;padding:4px;display:flex}.segmented button{background:0 0;border:0;min-height:35px;padding:8px 14px;font-size:11px}.segmented button.active{background:var(--paper);box-shadow:0 2px 5px #20382210}.card{background:var(--paper);border:1px solid var(--line);border-radius:12px;min-width:0;margin:20px 35px;padding:24px}.section-heading{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.section-heading h2{letter-spacing:-.3px;margin:7px 0 0;font-family:Georgia,serif;font-size:24px;font-weight:400}.inline{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.inline>span{font-size:11px}.hint{color:#899087;margin:16px 0 0;font-size:11px;line-height:1.8}.timeline{padding:24px 0 15px}.timeline>.section-heading,.timeline>.hint{padding:0 24px}.timeline-scroll{overflow-x:auto}.timeline-inner{min-width:750px;position:relative}.ruler,.chord-lane,.note-lane{border-top:1px solid #e8ebe2;display:flex;position:relative}.lane-label{color:#83928b;letter-spacing:1px;background:#fcfcf7;border-right:1px solid #e6eae0;flex-shrink:0;align-items:center;gap:10px;width:180px;padding:0 15px;font-size:8px;display:flex}.lane-label i{border-radius:3px;flex-shrink:0;width:3px;height:28px}.lane-label b{color:#4b5e56;letter-spacing:0;font-size:11px;font-weight:600;display:block}.lane-label small{letter-spacing:0;margin-top:5px;font-size:8px;display:block}.timeline svg{flex:1;min-width:0;display:block}.ruler svg{cursor:pointer;height:34px}.ruler line{stroke:#e2e7db}.ruler text{fill:#758576;font-size:10px}.ruler .meter{fill:#adb7a8;font-size:7px}.chord-lane svg{background:#f4f7ee;height:45px}.chord-lane rect{fill:#e0eacb}.chord-lane text{fill:#577345;font-size:12px;font-weight:600}.note-lane svg{height:76px}.note-lane line{stroke:#e9ede3;stroke-width:.8px}.note-lane line.beat{stroke:#f2f4ed}.note-lane rect{fill:#7cb79d;cursor:pointer}.note-lane.role-bass rect{fill:#d1aa6b}.note-lane.role-drums rect{fill:#bc8fa2}.note-lane.role-chords rect{fill:#7da2b8}.note-lane.role-other rect{fill:#9bb075}.note-lane rect.selected{stroke:#102d29;stroke-width:2px}.playhead{pointer-events:none;z-index:2;background:#b07847;width:1px;position:absolute;top:0;bottom:0}.playhead:before{content:"";background:#b07847;width:7px;height:6px;display:block;position:absolute;top:0;left:-3px}.mixer{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;display:grid}.mixer>div{border:1px solid #e4e9de;border-radius:9px;flex-direction:column;gap:10px;min-width:0;padding:14px;display:flex}.mixer b{font-size:11px}.mixer .inline button{flex:1;min-height:30px;padding:6px;font-size:10px}.transport{background:var(--pine);color:#d4e5df;z-index:30;align-items:center;gap:22px;min-height:87px;padding:16px 25px;display:flex;position:fixed;bottom:0;left:218px;right:0;box-shadow:0 -7px 20px #20322a08}.transport-buttons{flex-shrink:0;align-items:center;gap:13px;display:flex}.transport button{color:inherit;border-color:#40585a}.transport .play{background:var(--mint);color:#153c2f;border:0;border-radius:50%;width:46px;height:46px;font-size:18px}.transport-buttons span{font-variant-numeric:tabular-nums;font-size:12px}.transport small{color:#8ba7a1;font-size:10px}.transport>input[type=range]{accent-color:#b6e2ca;flex:1;min-width:80px}.loop-inputs{gap:8px;display:flex}.loop-inputs label{color:#93a9a1;gap:4px;font-size:8px}.loop-inputs input{color:#d7e8e0;background:#244045;border-color:#425b5d;width:55px;padding:6px;font-size:11px}.transport .check{color:#a9c1b6;white-space:nowrap;font-size:10px}.check{align-items:center;gap:9px;font-size:12px;line-height:1.7;display:flex;flex-direction:row!important}.check input{height:17px;accent-color:var(--green);flex-shrink:0;width:17px!important}label{color:#708177;flex-direction:column;gap:7px;font-size:11px;font-weight:500;display:flex}input:not([type=checkbox]):not([type=range]):not([type=file]),select,textarea{color:#334c40;background:#fbfcf7;border:1px solid #dce3d7;border-radius:7px;min-width:0;max-width:100%;padding:10px 11px;font-size:12px}input[type=range]{accent-color:var(--green);min-width:0;padding:0}textarea{resize:vertical;min-height:90px}.form-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:15px;display:grid}.modal-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;background:#10252888;justify-content:center;align-items:center;padding:25px;display:flex;position:fixed;inset:0}.modal{background:var(--paper);border-radius:16px;width:min(850px,100%);max-height:92dvh;padding:32px;overflow:auto;box-shadow:0 30px 80px #06151244}.modal>header{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.modal h2{letter-spacing:-.8px;margin:10px 0 15px;font-family:Georgia,serif;font-size:32px;font-weight:400}.modal>p{color:#7d8a7f;font-size:13px;line-height:1.8}.modal>label,.modal>section,.modal>.inline{margin:20px 0}.dropzone{text-align:center;color:#4b714a;background:#eff5e9;border:1px dashed #a4bf9c;border-radius:10px;align-items:center;padding:27px;font-size:15px!important}.dropzone input{max-width:100%;margin:5px 0;font-size:12px}.dropzone small{opacity:.7;font-size:10px}.import-source{border:1px solid var(--line);border-radius:10px;padding:18px}.import-source h3{overflow-wrap:anywhere;margin:0 0 18px;font-size:13px}.import-source h3 small{color:#8a9a8b;font-size:10px;font-weight:400}.import-track{border-top:1px solid #e7ebe1;justify-content:space-between;align-items:center;gap:15px;margin-top:12px;padding-top:12px;display:flex}.import-track b{font-size:12px}.import-track small{color:#8b968b;margin-top:4px;font-size:10px;display:block}.notice{color:#8f713d;background:#fbf1dc;border:1px solid #e6d4aa;border-radius:8px;margin:15px 0;padding:14px 18px;font-size:12px;line-height:1.8}.notice p{margin:6px 0}.error{color:var(--danger);background:#fff0e9;border:1px solid #edc8bd;border-radius:8px;padding:14px;font-size:12px;line-height:1.6}.error-bar{justify-content:space-between;margin:15px 35px;display:flex}.error button{background:0 0;border:0;min-height:0;padding:0;font-size:20px}.note-inspector h3{font-size:15px}.success{color:#4e764e;background:#edf5e7;border:1px solid #bfd6bc;border-radius:8px;padding:12px 16px;font-size:12px;line-height:1.6}.empty{text-align:center;color:#82917e;padding:35px;font-size:13px}.button-row{flex-wrap:wrap;gap:9px;margin-top:18px;display:flex}.danger{color:#a45547;border-color:#d9bcb0}.card h3{font-size:14px}.grid-two{grid-template-columns:1fr 1fr;gap:20px;display:grid}.muted{color:#92a08f;font-size:11px}.stack{gap:12px;display:grid}.tabs-preview{white-space:pre;background:#f2f4e9;border-radius:8px;max-height:420px;padding:18px;font:12px/1.7 ui-monospace,monospace;overflow:auto}.download-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:15px;display:grid}.download-card{border:1px solid var(--line);border-radius:10px;padding:22px}.download-card p{color:#8c9789;font-size:12px;line-height:1.7}.download-card h3{margin-top:0}.download-card button{width:100%}.view-title{margin:38px 35px 15px}.view-title h1{margin:10px 0;font-family:Georgia,serif;font-size:36px;font-weight:400}.view-title p{color:#81907e;font-size:13px;line-height:1.8}.status-badge{color:#708a77;font-size:10px}.compact-actions button{min-height:32px;padding:6px 10px;font-size:11px}.chord-table{border-collapse:collapse;width:100%;font-size:12px}.chord-table th{text-align:left;letter-spacing:1px;color:#90a18d;padding:12px 8px;font-size:9px}.chord-table td{border-top:1px solid #e7ecdf;padding:10px 8px}.chord-table input{max-width:100px}.table-wrap{overflow:auto}.chord-cell{color:#375d42;font-size:20px;font-weight:650}.hook-card{border:1px solid var(--line);border-radius:12px;margin:16px 0;padding:22px}.hook-card h3{margin:8px 0;font-family:Georgia,serif;font-size:24px;font-weight:400}.hook-card p{color:#8a9785;font-size:12px}.hook-card.active{background:#f5f8ec;border-color:#719e77}.tab-chips{flex-wrap:wrap;gap:6px;display:flex}.tab-chips span{color:#4d6f45;background:#eaf1e2;border-radius:7px;padding:8px 13px;font-size:13px;font-weight:650}.capo-options button.active{background:#e1eed7;border-color:#72925c}.save-list{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;display:grid}.save-list button{text-align:left;padding:24px;display:block}.save-list b{margin-bottom:12px;font-family:Georgia,serif;font-size:22px;font-weight:400;display:block}.save-list small{color:#8c9989;font-size:11px}.proposal{background:#fcf5e8;border:2px solid #c5a370}.proposal h3{color:#84652e}.progress{accent-color:#397653;width:100%}.build-info{color:#8da08f;margin-top:15px;font-size:10px}@media (min-width:1500px){main>.card,main>.project-heading,main>.view-title{max-width:1350px;margin-left:auto;margin-right:auto}.topbar{padding-inline:50px}}@media (max-width:1100px){.sidebar{width:180px;padding:30px 18px}main{margin-left:180px}.transport{gap:12px;padding:13px 18px;left:180px}.topbar{padding-inline:26px}.card,.project-heading{margin-left:24px;margin-right:24px}.project-heading input{width:440px;font-size:29px}.welcome-art{opacity:.65;width:50%;right:-15%}.welcome{padding:30px}.loop-inputs{display:none}.welcome>p{max-width:370px}.principles{gap:15px}}@media (max-width:760px){.sidebar{flex-direction:row;justify-content:space-between;align-items:center;width:100%;height:69px;padding:12px 19px;inset:0 0 auto}.brand b{font-size:20px}.brand small{margin-top:2px;font-size:8px}.brand-mark{width:38px;font-size:28px}.workspace-label,.sidebar-foot{display:none}.sidebar nav{gap:4px;display:flex}.sidebar nav button{min-height:35px;padding:7px;font-size:10px}.sidebar nav button span{display:none}main{margin-left:0;padding-top:69px;padding-bottom:140px}.topbar{height:76px;padding:16px 18px}.topbar .eyebrow{letter-spacing:1.4px;font-size:7px}.top-label{display:none}.topbar button{padding:10px 12px;font-size:11px}.welcome{min-height:0;margin-top:20px;padding:26px 24px}.welcome h1{letter-spacing:-2px;margin-top:22px;font-size:54px}.welcome>p{max-width:none;font-size:13px}.welcome-art{opacity:1;width:100%;margin:35px 0 15px;padding:18px;position:relative;top:auto;right:auto;transform:rotate(-3deg)}.welcome-art>div{height:60px}.welcome-art small{width:64px}.welcome-art i{max-width:25px}.principles{gap:13px;margin-top:32px;display:grid}.welcome>p.privacy{font-size:10px}.project-heading{flex-wrap:wrap;gap:16px;margin:24px 16px}.project-heading input{width:100%;margin-top:7px;font-size:28px}.project-heading>div:first-child{width:100%;max-width:100%}.project-heading p{font-size:10px}.segmented{width:100%}.segmented button{flex:1}.card{margin:16px 12px;padding:18px}.timeline{padding:18px 0}.timeline>.section-heading,.timeline>.hint{padding-inline:18px}.section-heading{flex-wrap:wrap;align-items:flex-start;gap:10px}.section-heading h2{font-size:23px}.section-heading .inline{font-size:10px}.section-heading .inline button{min-height:32px;padding:7px 10px}.timeline-inner{min-width:850px}.lane-label{width:145px}.playhead{display:none}.mixer{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mixer>div{padding:12px}.mixer b,.mixer select{font-size:11px}.transport{min-height:106px;padding:11px 15px calc(11px + env(safe-area-inset-bottom));grid-template-columns:auto 1fr auto;gap:8px;display:grid;left:0}.transport-buttons{grid-column:1/3;gap:10px}.transport .play{width:40px;height:40px}.transport>input[type=range]{grid-area:2/1/auto/4;width:100%;min-height:25px}.transport>.check{grid-area:1/3;font-size:11px}.transport .loop-inputs{display:none}.modal-backdrop{padding:10px}.modal{max-height:94dvh;padding:22px 18px}.modal h2{font-size:27px}.modal>p{font-size:12px}.dropzone{padding:18px 12px}.form-grid{grid-template-columns:1fr 1fr;gap:11px}.import-source{padding:13px}.import-source .form-grid{grid-template-columns:1fr}.import-track{flex-wrap:wrap;gap:9px}.import-track select{width:100%}.error-bar{margin:12px}.grid-two{grid-template-columns:1fr}.view-title{margin:28px 19px 15px}.view-title h1{font-size:32px}.download-grid{grid-template-columns:1fr}.hook-card{padding:17px}.button-row button{flex:1}.chord-table input{max-width:78px}.chord-table td{padding:8px 5px}.note-inspector .form-grid{grid-template-columns:1fr 1fr}.timeline>.hint{font-size:10px}.brand{gap:8px}}.details-block{border-top:1px solid var(--line);margin-top:24px;padding-top:18px}.details-block summary{cursor:pointer;margin-bottom:16px;font-size:12px;font-weight:650}.details-block>button{margin-top:15px}.follow-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:18px;display:grid}.tuning-inputs{grid-template-columns:repeat(6,1fr);gap:10px;margin:20px 0;display:grid}.tuning-inputs input{width:100%}.edit-toolbar{gap:8px;margin:0 35px 15px;display:flex}.status-message{margin:12px 35px}.chord-table td>input+button{margin-top:6px;padding:7px;font-size:10px;display:block}.chord-table td>.inline{flex-wrap:nowrap}.chord-table td .check{margin-top:5px;font-size:10px}.chord-table td .inline input{width:100px}.proposal .button-row button{min-width:140px}@media (max-width:760px){.edit-toolbar,.status-message{margin-inline:12px}.tuning-inputs{grid-template-columns:repeat(3,1fr)}.follow-grid{grid-template-columns:1fr}.chord-table{min-width:840px}.proposal .button-row button{flex-basis:100%;min-width:0}}[hidden]{display:none!important}.track-downloads{border-top:1px solid var(--line);flex-wrap:wrap;gap:8px;margin-top:22px;padding-top:22px;display:flex}.stage-banner{color:#697b54;background:#e9eddd;border-bottom:1px solid #d5ddc4;align-items:center;gap:15px;padding:12px 36px;font-size:10px;line-height:1.8;display:flex}.stage-banner b{white-space:nowrap;color:#45633b;font-size:10px}@media (max-width:760px){.stage-banner{align-items:flex-start;gap:10px;padding:11px 18px;font-size:9px}.topbar .inline{gap:6px}.topbar button{padding:8px;font-size:10px}.topbar>div:first-child{max-width:80px}}.hook-mini{align-items:flex-end;gap:5px;height:55px;padding:8px 0;display:flex;overflow:hidden}.hook-mini span{background:#96b99b;border-radius:3px;flex-shrink:0}.voicings{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:20px 0;display:grid}.voicings>div{background:#f2f5e8;border:1px solid #e2e7d5;border-radius:9px;gap:7px;padding:15px;display:grid}.voicings b{color:#4b7050;font-size:20px}.voicings small{color:#809476;font-size:10px}.voicings code{font-size:13px}.audition-label{color:#684f21;text-align:center;background:#e9d6a8;padding:10px 20px;font-size:11px;position:absolute;bottom:100%;left:0;right:0}.save-status{color:#397653!important}.save-list{margin-top:20px}.mixer b{overflow-wrap:anywhere}.topbar>.inline{flex-direction:row}.loop-inputs{display:flex}@media (max-width:1100px){.loop-inputs{display:flex}.transport{flex-wrap:wrap}.loop-inputs input{width:48px}.transport{gap:9px}.transport-buttons{gap:8px}}@media (max-width:760px){.sidebar{flex-direction:column;align-items:flex-start;height:108px;padding:10px 16px 5px;display:flex}.brand small{letter-spacing:1px;margin-left:8px;display:inline}.brand{gap:9px}.brand-mark{width:34px;font-size:25px}.brand-mark>span{font-size:22px;top:4px}.sidebar nav{justify-content:space-between;width:100%}.sidebar nav button{padding:7px 10px;font-size:11px}.sidebar nav button span{display:none}main{padding-top:108px;padding-bottom:175px}.topbar{height:auto;min-height:69px}.transport{grid-template-columns:auto 1fr auto;gap:6px;min-height:143px}.transport .loop-inputs{grid-area:3/1/auto/4;justify-content:flex-end;align-items:center;display:flex}.loop-inputs label{flex-direction:row;align-items:center;font-size:9px}.loop-inputs input{width:54px;padding:5px}.transport>input[type=range]{grid-row:2}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stage-banner{font-size:10px}.save-list{grid-template-columns:1fr}.timeline svg[aria-label]{min-height:76px}}#root .project-heading input[aria-label=Projectnaam]{letter-spacing:-.6px;color:#263b3e;background:0 0;border:0;padding:5px 0;font-family:Georgia,Times New Roman,serif;font-size:34px}@media (max-width:760px){#root .project-heading input[aria-label=Projectnaam]{font-size:28px}}.track-name-field{gap:5px;font-size:10px}.track-name-field input{width:100%;font-weight:650}.import-track>span{flex:1;min-width:180px}.import-track>span input{width:100%;font-weight:600}.import-track>select{max-width:230px}.import-timing{margin:18px 0;font-size:11px}.import-timing summary{cursor:pointer;color:#667b66}.import-timing>.form-grid{margin-top:15px}.import-timing small{font-size:10px;line-height:1.6}.modal>label>small{font-size:11px;font-weight:400;line-height:1.7}.notice>b{font-size:12px}@media (max-width:760px){.import-track>span{flex-basis:100%}.import-track>select{max-width:100%}}.capo-chooser{background:#eef4e6;border:1px solid #c9d9bc;border-radius:10px;margin:20px 0;padding:20px}.capo-chooser h3{margin-top:0;font-size:17px}.capo-chooser p{color:#556d50;font-size:12px;line-height:1.8}.capo-chooser label{max-width:280px}.capo-chooser small{color:#71816a;font-size:10px;line-height:1.7}.shape-easy,.shape-hard{margin-top:5px;font-size:10px;line-height:1.6;display:block}.shape-easy{color:#39724b!important}.shape-hard{color:#946328!important}.chord-table .played-shape{color:#2b6c56;display:block}.chord-table th:nth-child(2){min-width:105px}@media (max-width:760px){.capo-chooser{padding:16px}.capo-chooser .button-row button{flex-basis:100%}.chord-table{min-width:1000px}}.timeline .track-name-field{gap:0;font-size:0}.timeline .track-name-field input{letter-spacing:0;min-height:28px;padding:5px 6px;font-size:11px}.lane-label>div{width:100%;min-width:0}.harmony-details{margin:18px 0}.chord-table.simple{min-width:0}.chord-table.simple td:last-of-type{width:0}.chord-table.simple td:nth-child(5) .inline{flex-wrap:wrap}.chord-table.simple td:nth-child(5) .inline input{min-width:110px}@media (max-width:760px){.chord-table.simple{min-width:530px}.harmony-details{font-size:10px}}.part-suggestions{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:20px 0;display:grid}.part-suggestions article{background:#f8faf2;border:1px solid #dce5d4;border-radius:9px;padding:18px}.part-suggestions article p,.part-candidate p{color:#708167;font-size:12px;line-height:1.8}.part-suggestions article small{color:#936d32;margin-bottom:12px;font-size:11px;line-height:1.7;display:block}.part-candidate{background:#fff8e9;border:2px solid #c7ad79;border-radius:10px;padding:20px}.reference-upload{background:#f1f4e9;border:1px solid #dae3ce;border-radius:9px;margin:20px 0;padding:15px;font-size:12px}.reference-upload summary{cursor:pointer;font-weight:650}.reference-upload p,.reference-comparison p{color:#718367;font-size:11px;line-height:1.8}.reference-upload input{max-width:100%}.reference-comparison{background:#eef3e5;border-radius:7px;padding:10px 14px}.reference-lane{background:#f1f1eb}.reference-lane rect{opacity:.6;fill:#a8aca3!important}.reference-lane .lane-label{background:#e9ece2}.edit-toolbar{flex-wrap:wrap}.edit-toolbar .check{font-size:11px}@media (max-width:760px){.sidebar nav button{padding:7px 6px;font-size:10px}.part-suggestions{grid-template-columns:1fr}.part-candidate .button-row button{flex-basis:100%}}.capo-status{color:#2b6c56!important;font-size:12px!important}.chord-lane .lane-label{line-height:1.7}.chord-diagram{color:#315e49;flex-direction:column;flex-shrink:0;align-items:center;gap:4px;width:132px;max-width:100%;margin:0;display:flex}.chord-diagram figcaption{text-align:center;gap:3px;display:grid}.chord-diagram b{font-size:22px;line-height:1.2}.chord-diagram small{color:#5c745b;text-align:center;max-width:132px;font-size:10px;line-height:1.5;display:block}.chord-diagram svg{width:116px;max-width:100%;height:auto;display:block}.chord-diagram svg text{fill:currentColor;font-size:16px}.chord-diagram svg .string-number{fill:#728473;font-size:10px}.chord-diagram svg .fret-number{font-size:11px}.diagram-frets{color:#6d7e67;font-variant-numeric:tabular-nums;font-size:11px}.chord-diagram.unavailable{text-align:center;border:1px dashed #c1cdb7;border-radius:8px;padding:12px;font-size:11px;line-height:1.6}.chord-table td{vertical-align:top}.chord-table td:first-child{width:170px}.chord-table td>.chord-diagram{margin:6px 0}.chord-table .learn-shape{max-width:160px;margin-top:8px;padding:7px 9px;font-size:10px}.chord-table.simple td:nth-child(4) .inline{flex-wrap:wrap}.chord-table.simple td:nth-child(4) .inline input{min-width:110px}.voicings{grid-template-columns:repeat(auto-fit,minmax(145px,1fr))}.voicings>.chord-diagram{background:#f2f5e8;border:1px solid #e2e7d5;border-radius:9px;width:100%;padding:14px 6px}.diagram-help{line-height:1.8}@media (max-width:760px){.chord-table.simple{min-width:360px}.chord-table td:first-child{width:145px}.chord-table td .inline{flex-wrap:wrap}.chord-table td .inline button{white-space:normal;max-width:170px}.chord-table.simple td:nth-child(4) .inline input{width:100px;min-width:100px}.chord-diagram{width:120px}.chord-diagram svg{width:106px}.chord-table.simple{table-layout:fixed;min-width:0}.chord-table.simple th:first-child,.chord-table.simple td:first-child{width:135px}.chord-table.simple th{overflow-wrap:anywhere;line-height:1.8}.chord-table.simple td .inline button{width:100%;max-width:100%;padding:8px}.chord-table.simple td .inline input{width:100%;min-width:0}.chord-table.simple .learn-shape{white-space:normal;width:120px;max-width:100%}}.chord-section{position:relative}.pinned-chords{z-index:20;background:#f0f5e8;border:1px solid #b3c6a3;border-radius:9px;max-width:100%;margin:0 0 18px;padding:9px 12px;position:sticky;top:8px;box-shadow:0 4px 15px #263b3e14}.pinned-chords>header{justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px;display:flex}.pinned-chords>header>b{color:#385c40;font-size:11px}.pinned-chords>header>button{min-height:30px;padding:5px 8px;font-size:10px}.pinned-chord-scroll{overscroll-behavior-x:contain;gap:16px;padding:2px 0 5px;display:flex;overflow-x:auto}.pinned-chord{flex:0 0 100px}.pinned-chords .chord-diagram{gap:2px;width:100px}.pinned-chords .chord-diagram svg{width:72px}.pinned-chords .chord-diagram b{font-size:17px}.pinned-chords .chord-diagram small{font-size:9px}.pinned-chords .chord-diagram>small,.pinned-chords .diagram-frets{display:none}.pin-chord{white-space:nowrap;min-height:28px!important;padding:5px 7px!important;font-size:10px!important}.pin-chord[aria-pressed=true]{background:#dcebcf;border-color:#83a76c}.pinned-chords.compact .chord-diagram svg{display:none}.pinned-chords.compact .pinned-chord{flex-basis:100px}.timeline>.pinned-chords{margin:0 18px 14px}.chord-diagram figcaption .pin-chord{margin:4px 0 2px}@media (max-width:760px){.pinned-chords{padding:7px 8px;top:112px}.pinned-chords>header>b{font-size:10px}.pinned-chords>header>button{font-size:9px}.pinned-chord-scroll{gap:7px}.pinned-chords .chord-diagram svg{width:64px}.pinned-chords .chord-diagram figcaption{gap:1px}.pinned-chords .chord-diagram small{font-size:8px}.pinned-chords .chord-diagram b{font-size:15px}.pinned-chord{flex-basis:92px}.pinned-chords .chord-diagram{width:92px}}.chord-overview,#akkoorden-bewerken{scroll-margin-top:20px}.section-link{color:#2b6c56;text-underline-offset:3px;margin:8px 0;font-size:12px;line-height:1.6;display:inline-block}.overview-diagrams{grid-template-columns:repeat(auto-fit,minmax(130px,160px));gap:12px}.overview-diagrams .chord-diagram svg{width:90px}.chord-row-name{gap:5px;display:grid}.chord-row-name>small{color:#6d7e67;font-size:10px}.compact-chord-actions{flex-wrap:wrap;gap:5px;margin:5px 0;display:flex}.diagram-toggle{min-height:28px;padding:5px 7px;font-size:10px}.chord-table .chord-row-name .pin-chord{margin:0!important}.chord-table td:first-child .shape-hard,.chord-table td:first-child .shape-easy{margin-top:5px}@media (max-width:760px){.chord-overview,#akkoorden-bewerken{scroll-margin-top:118px}.overview-diagrams{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.overview-diagrams .chord-diagram svg{width:82px}.overview-diagrams .chord-diagram b,.chord-row-name .chord-cell{font-size:20px}}.timeline-chord{cursor:pointer;touch-action:manipulation;outline:none}.timeline-chord:hover rect,.timeline-chord:focus-visible rect,.timeline-chord.active rect{fill:#c9deb1;stroke:#4e794e;stroke-width:1.5px}.timeline-chord text{pointer-events:none}.timeline-chord-popup{z-index:80;color:#315e49;background:#fbfcf6;border:1px solid #a4bc98;border-radius:11px;width:144px;min-height:174px;padding:13px 12px 10px;position:fixed;box-shadow:0 7px 24px #193e3533}.timeline-chord-popup .chord-diagram{gap:3px;width:118px}.timeline-chord-popup .chord-diagram b{font-size:20px}.timeline-chord-popup .chord-diagram svg{width:86px}.timeline-chord-popup .chord-diagram>small{display:none}.timeline-chord-popup .diagram-frets{font-size:10px}.timeline-chord-popup .popup-close{color:#537055;background:0 0;border:0;width:29px;min-height:29px;padding:0;font-size:21px;line-height:1;position:absolute;top:3px;right:3px}.timeline-chord-popup figcaption{padding-top:3px}.timeline-chord-popup .unavailable{border:0;padding:12px 0}.sidebar{z-index:40}.playable-proposal{background:#f0f6e8;border:1px solid #bed0ad;border-radius:10px;margin:18px 0;padding:18px}.playable-proposal h3{margin:0 0 9px}.playable-proposal p{color:#526d4c;font-size:12px;line-height:1.8}.playable-proposal small{color:#657c5e;margin-top:10px;font-size:10px;display:block}.chord-suggestions{border-bottom:1px solid #e1e9d7;max-width:400px;margin-bottom:10px;padding:9px 0 14px}.chord-suggestions>small{color:#637b5e;font-size:10px;line-height:1.6;display:block}.chord-suggestions>div{flex-wrap:wrap;gap:6px;margin:7px 0;display:flex}.chord-suggestions button{color:#315d3e;background:#e7f0dd;border-color:#b6cda5;min-height:32px;padding:6px 11px;font-size:11px}.overview-suggest{margin:12px 0 20px}.proposal-chords{color:#6d613d;font-size:13px;line-height:1.8}.chord-table.simple .chord-suggestions button{width:auto!important}@media (max-width:760px){.playable-proposal{padding:14px}.chord-suggestions>div{gap:5px}.chord-suggestions button{padding:5px 8px;font-size:10px}.chord-suggestions{padding-top:0}.proposal-chords{overflow-wrap:anywhere;font-size:12px}}.shape-checklist{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin:15px 0;display:grid}.shape-choice{background:#f6f8ee;border:1px solid #d9e2cf;border-radius:8px;min-height:43px;padding:10px 12px}.shape-choice.known{background:#e5f0da;border-color:#a9c294}.shape-choice b{color:#315d3e;font-size:13px}.shape-choice small{color:#718067;font-size:8px}.guitar-preferences h3{margin:10px 0}.master-chord{white-space:normal;max-width:135px;min-height:30px;padding:5px 8px;font-size:10px;line-height:1.6}.voicings>.chord-diagram.mastered,.chord-diagram.mastered{align-self:start;gap:6px;width:auto;min-width:85px;max-width:100%;padding:10px 8px}.chord-diagram.mastered b{font-size:17px}.mastered-label{color:#39724b!important}.chord-diagram.mastered .diagram-toggle{white-space:normal;max-width:120px;font-size:9px}.pinned-chords .mastered .diagram-toggle{display:none}.pinned-chords .mastered{width:100px;min-width:0;padding:2px}.pinned-chords .mastered .mastered-label{display:block}.timeline-chord-popup:has(.mastered){min-height:0}.timeline-chord-popup .mastered{width:118px;padding:10px 0 2px}.learning-offer p{color:#655a3c;font-size:13px;line-height:1.8}.learning-diagrams{flex-wrap:wrap;gap:18px;margin:18px 0;display:flex}.learning-diagrams>.chord-diagram{background:#fffdf5;border:1px solid #d7caa9;border-radius:9px;width:145px;padding:14px 7px}.floating-feedback{z-index:110;color:#315b3d;background:#edf6e5;border:1px solid #9fbd8d;border-radius:10px;width:min(510px,100vw - 40px);max-height:160px;padding:12px 40px 12px 15px;position:fixed;right:20px;overflow:auto;box-shadow:0 5px 20px #20382c29}.floating-feedback p{margin:0;font-size:12px;line-height:1.7}.floating-feedback>button{min-height:30px;color:inherit;background:0 0;border:0;padding:4px 8px;font-size:21px;position:absolute;top:5px;right:5px}.floating-feedback.feedback-error{color:#925443;background:#fff0e8;border-color:#dcae9d}.proposal{outline:none;scroll-margin-top:18px}.overview-capo{min-width:130px}.learning-offer h2{color:#665433;font-size:24px}#gitaarvoorkeuren{scroll-margin-top:20px}@media (max-width:760px){.shape-checklist{grid-template-columns:repeat(2,minmax(0,1fr))}.shape-choice{padding:9px 10px}.floating-feedback{width:calc(100vw - 24px);padding:11px 38px 11px 13px;right:12px}.floating-feedback p{font-size:11px}.proposal,#gitaarvoorkeuren{scroll-margin-top:118px}.overview-capo{min-width:115px}.overview-capo select{padding:8px}.learning-diagrams{gap:10px}.learning-diagrams>.chord-diagram{width:132px}.learning-offer p{font-size:12px}}.proposal-actions{margin:16px 0 20px}.proposal-details{margin-top:12px;padding-top:10px}.proposal h2{color:#6d5b35;margin-top:10px}.proposal-actions button{min-height:40px}.overview-diagrams .chord-diagram:not(.mastered){align-self:start}.learning-offer h3{font-size:17px}.download-link{text-align:center;color:#315c3d;background:#edf5e4;border:1px solid #91ad7d;border-radius:7px;margin-top:10px;padding:11px 12px;font-size:12px;font-weight:600;text-decoration:none;display:block}.download-link:hover{background:#dceccd}.variant-stage{touch-action:pan-y;outline-offset:2px;cursor:ew-resize;border-radius:6px;justify-content:center;width:100%;display:flex}.variant-stage svg{pointer-events:none;flex-shrink:0}.variant-controls{justify-content:space-between;align-items:center;gap:5px;width:100%;max-width:128px;display:flex}.variant-controls button{min-width:30px;min-height:30px;padding:1px 8px;font-size:22px;line-height:1}.variant-controls small{white-space:nowrap;font-size:10px}.choose-variant{white-space:normal;min-height:31px;padding:5px 7px;font-size:10px;line-height:1.4}.variant-chosen{color:#2d7254!important}.skill-select{width:130px;max-width:100%;margin-top:5px;font-size:9px!important}.skill-select select{width:100%;padding:6px 5px;font-size:10px}.skill-label{color:#6d7e66}.chord-diagram.learning{background:#fff8e7!important;border-color:#c8ac62!important}.skill-choice{gap:7px;display:grid}.skill-choice>.check{font-size:10px}.skill-choice>b{font-size:17px}.skill-choice.learning{background:#fff5dc;border-color:#c8ac62}.pinned-chords .variant-controls,.pinned-chords .choose-variant,.pinned-chords .variant-chosen{display:none}.pinned-chords.compact .chord-diagram.learning svg{display:block!important}.pinned-chords .chord-diagram.learning .skill-label{color:#8a642c;display:block}.timeline-learning{background:#fff8e7;border:1px solid #e0cda0;border-radius:9px;margin:10px 18px 18px;padding:12px}.timeline-learning>b{color:#85632f;font-size:11px}.timeline-learning>div{align-items:flex-start;gap:14px;margin-top:10px;display:flex;overflow-x:auto}.timeline-learning .chord-diagram{flex:0 0 122px;width:122px}.timeline-learning .chord-diagram svg{width:90px}.timeline-learning .chord-diagram>small{display:none}.timeline-chord-popup .variant-controls button{min-width:28px;min-height:28px;padding:1px 6px}.timeline-chord-popup .variant-controls{max-width:118px}.timeline-chord-popup .choose-variant{font-size:9px}.timeline-chord-popup .chord-diagram figcaption{gap:1px}.timeline-chord-popup .pin-chord{display:none}.timeline-chord-popup .skill-label{font-size:9px}.overview-diagrams>.chord-diagram{width:100%;min-width:0}.chord-table .chord-diagram select{max-width:132px}.pinned-chords .variant-stage{touch-action:pan-y}.pinned-chords .skill-select{display:none}@media (max-width:760px){.variant-controls button{min-width:34px;min-height:34px}.variant-controls{max-width:120px}.skill-choice>.check,.skill-select select{font-size:10px}.chord-diagram.learning .skill-label{font-size:9px}.timeline-learning{margin-inline:12px}.timeline-chord-popup .variant-controls button{min-width:30px}.timeline-chord-popup .chord-diagram{width:118px}}
