@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";.harmonica-workspace{display:grid;gap:17px}.harmonica-score{min-width:0;padding:20px 24px}.harmonica-score-heading,.harmonica-score-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}.harmonica-score-heading h2{margin-top:5px}.harmonica-score-caption{color:#88a08e;font-size:11px;font-weight:700}.harmonica-score-toolbar{display:flex;align-items:center;gap:10px;margin:15px 0 12px}.harmonica-score-toolbar>label{flex:none;color:#62816b;font-size:11px;font-weight:800}.harmonica-score-toolbar select,.harmonica-score-search input{min-width:0;height:39px;padding:0 11px;border:1px solid #dce8df;border-radius:9px;background:#f8fbf8;color:#31533d;font-size:12px}.harmonica-score-toolbar select{flex:1}.harmonica-score-search{display:flex;gap:6px;min-width:0}.harmonica-score-search-toggle{display:none;border:1px solid #cfe2d3;border-radius:9px;background:#edf6ef;color:#417850;font-size:11px;font-weight:800;padding:0 11px;height:39px}.harmonica-score-search input{width:155px}.harmonica-score-search button{border:1px solid #cfe2d3;border-radius:9px;background:#edf6ef;color:#417850;font-size:11px;font-weight:800;padding:0 11px}.harmonica-score-search button:hover{background:#dceee1}.harmonica-score-viewer{position:relative;display:grid;place-items:center;height:clamp(260px,40dvh,540px);overflow:hidden;border:1px solid #e4eae5;border-radius:12px;background:#f5f7f5}.harmonica-score-image-scroll{position:absolute;inset:0;overflow:hidden}.harmonica-score-image-scroll>img{display:block;width:100%;height:100%;object-fit:contain;cursor:zoom-in}.harmonica-score-image-scroll.is-reading{overflow:auto}.harmonica-score-image-scroll.is-reading>img{width:min(100%,760px);height:auto;margin:0 auto;cursor:zoom-out}.harmonica-score-viewer>iframe{width:100%;height:100%;border:0;background:#fff}.harmonica-score-musicxml{width:100%;height:100%;overflow:auto;padding:12px;background:#fff}.harmonica-score-musicxml>div{min-width:400px}.harmonica-score-view-actions{position:absolute;z-index:1;right:10px;bottom:10px;display:flex;gap:5px}.harmonica-score-view-actions button{padding:8px 12px;border:0;border-radius:8px;background:#153e2edb;color:#fff;font-size:11px;font-weight:800}.harmonica-score-bottom{margin-top:10px;color:#819686;font-size:11px;min-width:0}.harmonica-score-bottom>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.harmonica-score-bottom a{flex:none;color:#438157;font-weight:800;text-decoration:none}.harmonica-score-empty{display:grid;place-items:center;height:160px;border:1px dashed #d5e3d8;border-radius:12px;background:#f7faf7;color:#8ba091;font-size:12px;text-align:center;padding:16px}.harmonica-score-lightbox{position:fixed;inset:0;z-index:110;display:grid;place-items:center;background:#102018ed;padding:50px 12px 12px}.harmonica-score-lightbox>img{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-out}.harmonica-score-lightbox>button{position:absolute;top:10px;right:14px;width:36px;height:36px;border:0;border-radius:9px;background:#ffffff30;color:#fff;font-size:26px}.practice-page{padding-top:16px}.practice-page>.page-heading{display:none}.practice-page .harmonica-workspace{gap:10px}.practice-page .harmonica-score{padding:14px 18px}.practice-page .harmonica-score-viewer{height:clamp(170px,30dvh,330px)}.practice-page .harmonica-card{padding:12px 18px;overflow:visible}.practice-page .harmonica-card>.card-title-row,.practice-page .harmonica-card~.info-grid{display:none}.practice-page .harmonica-hero{min-height:0;margin:0 0 8px;padding:8px 14px;grid-template-columns:50px minmax(0,1fr) auto}.practice-page .harmonica-breath{height:37px;gap:4px}.practice-page .harmonica-breath span{width:4px;max-height:36px}.practice-page .harmonica-readout strong{font-size:28px}.practice-page .harmonica-readout>span{display:none}.practice-page .harmonica-control-label{margin:8px 0 5px}.practice-page .harmonica-modifiers>button,.practice-page .harmonica-middle{min-height:46px;padding:6px 10px}.practice-page .harmonica-mouse-icon{width:27px;height:27px;font-size:15px}.practice-page .harmonica-keys{padding:6px;gap:5px}.practice-page .harmonica-key{min-height:92px;gap:3px;padding:5px 2px}.practice-page .harmonica-hole{width:28px;border-width:3px}.practice-page .harmonica-degree{font-size:20px}.practice-page .harmonica-key kbd{display:none}.practice-page .harmonica-footer{margin-top:8px}.practice-page .harmonica-footer p{display:none}.practice-page .harmonica-footer .volume-control{width:100%}@media(min-width:700px){.practice-page .harmonica-score{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:7px 16px}.practice-page .harmonica-score-toolbar{grid-column:2;margin:0}.practice-page .harmonica-score-viewer,.practice-page .harmonica-score-empty,.practice-page .harmonica-score-bottom,.practice-page .harmonica-score>.score-error{grid-column:1/-1}.practice-page .harmonica-score-viewer{height:clamp(150px,25dvh,280px)}.practice-page .harmonica-card{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);gap:5px 14px}.practice-page .harmonica-hero{grid-column:1/-1}.practice-page .harmonica-card>.harmonica-control-label:nth-child(3){grid-column:1;grid-row:2}.practice-page .harmonica-modifiers{grid-column:1;grid-row:3;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.practice-page .harmonica-modifiers>button,.practice-page .harmonica-middle{min-height:43px;padding:4px 6px}.practice-page .harmonica-modifiers small,.practice-page .harmonica-mouse-icon{display:none}.practice-page .harmonica-card>.harmonica-control-label:nth-child(5){grid-column:2;grid-row:2}.practice-page .harmonica-keys{grid-column:2;grid-row:3}.practice-page .harmonica-footer{grid-column:1/-1}}@media(min-width:700px)and (max-width:1050px){.practice-page .harmonica-score{display:block}.practice-page .harmonica-score-toolbar{margin:10px 0}}.harmonica-card{padding:29px 32px;overflow:hidden}.harmonica-hero{display:grid;grid-template-columns:120px minmax(0,1fr) auto;align-items:center;gap:25px;min-height:154px;margin:24px 0 26px;padding:26px 32px;border-radius:16px;background:radial-gradient(circle at 17% 50%,#3c8058,#1e4532 43%,#122d26);color:#fff}.harmonica-breath{display:flex;align-items:center;justify-content:center;gap:8px;height:76px}.harmonica-breath span{display:block;width:7px;height:25px;border-radius:20px;background:#b0edbd;opacity:.45;transition:height .12s ease,opacity .12s ease}.harmonica-breath span:nth-child(2),.harmonica-breath span:nth-child(4){height:42px}.harmonica-breath span:nth-child(3){height:65px}.harmonica-breath.sounding span{opacity:1;animation:harmonica-breathe .65s ease-in-out infinite alternate}.harmonica-breath.sounding span:nth-child(2){animation-delay:.1s}.harmonica-breath.sounding span:nth-child(3){animation-delay:.18s}.harmonica-breath.sounding span:nth-child(4){animation-delay:.27s}.harmonica-breath.sounding span:nth-child(5){animation-delay:.36s}@keyframes harmonica-breathe{0%{transform:scaleY(.5)}to{transform:scaleY(1.15)}}.harmonica-readout{display:grid;gap:5px;min-width:0}.harmonica-readout small{color:#a7d2b2;font-size:10px;font-weight:800;letter-spacing:.14em}.harmonica-readout strong{font-size:55px;line-height:1.05;letter-spacing:-.04em;font-weight:800}.harmonica-readout>span{color:#c3d8c8;font-size:11px}.harmonica-status{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;max-width:174px}.harmonica-status span{padding:6px 9px;border:1px solid #ffffff25;border-radius:99px;color:#b4cfbd;font-size:10px;font-weight:800}.harmonica-status span.active{border-color:#9be3aa;background:#c5f0ce;color:#1d5132}.harmonica-control-label{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:25px 0 11px;color:#597461;font-size:11px;font-weight:800;letter-spacing:.06em}.harmonica-control-label small{color:#98aa9c;font-size:10px;font-weight:600;letter-spacing:0}.harmonica-modifiers{display:grid;grid-template-columns:1fr .85fr 1fr 1fr;gap:10px}.harmonica-modifiers>button,.harmonica-middle{min-width:0;min-height:83px;display:grid;grid-template-columns:auto 1fr;align-content:center;column-gap:11px;row-gap:3px;text-align:left;padding:14px 16px;border:1px solid #dde9df;border-radius:11px;background:#f8fbf8;color:#456e51;touch-action:none;-webkit-user-select:none;user-select:none}.harmonica-modifiers>button{cursor:pointer;font:inherit}.harmonica-modifiers>button:hover{border-color:#8ab998;background:#f0f8f1}.harmonica-modifiers>button.active{border-color:#4b9965;background:#e2f4e7;box-shadow:inset 0 0 0 1px #4b9965}.harmonica-modifiers .harmonica-middle{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#e9f2ea;border-color:#d4e5d7}.harmonica-modifiers .harmonica-middle.active{background:#d8eedf;border-color:#83bc92}.harmonica-mouse-icon{grid-row:1/3;align-self:center;display:grid;place-items:center;width:35px;height:35px;border-radius:9px;background:#e6f2e8;color:#4c9762;font-size:19px;font-weight:800}.harmonica-modifiers strong{font-size:13px}.harmonica-modifiers small{color:#8da491;font-size:10px;white-space:nowrap}.harmonica-keys{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:9px;padding:18px;border:1px solid #dde8df;border-radius:16px;background:linear-gradient(135deg,#eaf1ea,#f5f9f5)}.harmonica-key{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:194px;padding:14px 4px;border:1px solid #d8e4d9;border-bottom:5px solid #b8d3bf;border-radius:12px;background:linear-gradient(#fff,#f7fbf7);color:#315b3e;box-shadow:0 4px 9px #1f523119;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;transition:transform .1s,background .1s,border-color .1s}.harmonica-key:hover{border-color:#84b895;background:#f3fbf4}.harmonica-key.active{transform:translateY(3px);border-color:#41915b;border-bottom-color:#317649;background:#dff3e4;box-shadow:0 1px 6px #1f523119}.harmonica-hole{display:block;width:min(54px,70%);aspect-ratio:1;border:7px solid #d7e8db;border-radius:50%;background:radial-gradient(circle,#203d30,#152920);box-shadow:inset 0 3px 7px #0008,0 3px 5px #22482c22}.harmonica-key.active .harmonica-hole{border-color:#76bd8a;box-shadow:inset 0 3px 7px #0008,0 0 13px #63be7f88}.harmonica-degree{font-size:27px;line-height:1;font-weight:800}.harmonica-pitch{font-size:12px;color:#6b9175;font-weight:800}.harmonica-key kbd{display:grid;place-items:center;min-width:26px;height:23px;margin-top:3px;padding:0 6px;border:1px solid #dce7dd;border-radius:5px;background:#edf4ee;color:#74917c;font-size:10px;font-weight:800;font-family:inherit}.harmonica-footer{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-top:20px}.harmonica-footer .volume-control{width:280px;flex:none;margin:0}.harmonica-footer p{max-width:450px;margin:0 0 4px;color:#8da193;font-size:11px;line-height:1.9}.harmonica-footer kbd{padding:2px 4px;border:1px solid #dbe8de;border-radius:4px;background:#f5f9f5;color:#557c60;font-size:10px;font-weight:800;font-family:inherit}@media(max-width:1199px){.harmonica-card{padding:24px}.harmonica-hero{margin-top:18px}.harmonica-modifiers{grid-template-columns:repeat(4,minmax(0,1fr))}.harmonica-modifiers>button,.harmonica-middle{padding:11px}.harmonica-modifiers small{white-space:normal}.harmonica-keys{gap:7px;padding:12px}.harmonica-key{min-height:166px}.harmonica-hole{border-width:5px}}@media(max-width:760px){.harmonica-card{padding:17px}.harmonica-hero{grid-template-columns:70px minmax(0,1fr);gap:10px;padding:18px;min-height:123px}.harmonica-breath{gap:5px}.harmonica-breath span{width:5px}.harmonica-readout strong{font-size:42px}.harmonica-status{grid-column:1/-1;justify-content:center;max-width:none}.harmonica-control-label{margin-top:19px}.harmonica-control-label small{max-width:50%;text-align:right}.harmonica-modifiers{grid-template-columns:repeat(2,minmax(0,1fr))}.harmonica-modifiers>button,.harmonica-middle{min-height:66px}.harmonica-modifiers .harmonica-middle{order:2}.harmonica-modifiers .harmonica-sharp{order:3}.harmonica-modifiers>button:nth-child(3){order:1}.harmonica-keys{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.harmonica-key{min-height:124px;gap:4px}.harmonica-hole{width:34px;border-width:4px}.harmonica-degree{font-size:22px}.harmonica-footer{align-items:stretch;flex-direction:column;gap:14px}.harmonica-footer .volume-control{width:100%;max-width:none}.harmonica-footer p{max-width:none}}@media(max-width:760px){.harmonica-score{padding:14px}.harmonica-score-toolbar{flex-wrap:wrap}.harmonica-score-toolbar select{flex:1 1 calc(100% - 80px)}.harmonica-score-search{width:100%}.harmonica-score-search input{flex:1;width:auto}.harmonica-score-viewer{height:clamp(220px,34dvh,360px)}.harmonica-score-caption{font-size:10px}}@media(max-width:699px){.harmonica-workspace{gap:9px}.harmonica-card{padding:12px;overflow:visible}.harmonica-card .card-title-row,.harmonica-card .harmonica-breath,.harmonica-card .harmonica-footer p,.harmonica-card~.info-grid{display:none}.harmonica-hero{display:flex;min-height:0;margin:0 0 8px;padding:9px 12px;gap:10px}.harmonica-readout{display:flex;align-items:center;gap:8px}.harmonica-readout small,.harmonica-readout>span{display:none}.harmonica-readout strong{font-size:24px;min-width:42px}.harmonica-status{margin-left:auto;gap:3px}.harmonica-status span{padding:4px 6px;font-size:9px}.harmonica-control-label{margin:8px 0 5px}.harmonica-control-label small{display:none}.harmonica-modifiers{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.harmonica-modifiers>button,.harmonica-middle{display:flex;align-items:center;justify-content:center;gap:3px;min-height:43px;padding:4px;text-align:center}.harmonica-modifiers .harmonica-middle{order:0}.harmonica-modifiers>button:nth-child(3){order:0}.harmonica-modifiers .harmonica-sharp{order:0}.harmonica-modifiers small,.harmonica-mouse-icon{display:none}.harmonica-modifiers strong{font-size:11px}.harmonica-keys{gap:4px;padding:5px}.harmonica-key{min-height:80px;padding:4px 1px;gap:2px}.harmonica-hole{width:23px;border-width:3px}.harmonica-degree{font-size:18px}.harmonica-pitch{font-size:10px}.harmonica-key kbd{display:none}.harmonica-footer{margin-top:8px}.harmonica-footer .volume-control{width:100%}.harmonica-score-viewer{height:clamp(180px,29dvh,310px)}}@media(max-width:699px){.practice-page .harmonica-score{padding:10px}.practice-page .harmonica-score-heading h2{font-size:16px}.practice-page .harmonica-score-caption{display:none}.practice-page .harmonica-score-toolbar{margin:7px 0}.practice-page .harmonica-score-toolbar select{flex:1 1 auto}.practice-page .harmonica-score-search-toggle{display:block}.practice-page .harmonica-score-search{display:none}.practice-page .harmonica-score-search.is-open{display:flex}.practice-page .harmonica-score-viewer{height:clamp(155px,20dvh,210px)}.practice-page .harmonica-key{min-height:66px}.practice-page .harmonica-score-bottom{margin-top:5px}}@media(max-width:420px){.harmonica-keys{gap:5px;padding:7px}.harmonica-key{min-height:112px}.harmonica-hole{width:29px}.harmonica-pitch{font-size:10px}.harmonica-key kbd{height:20px}.harmonica-modifiers>button,.harmonica-middle{padding:9px}.harmonica-mouse-icon{width:29px;height:29px;font-size:16px}.harmonica-modifiers strong{font-size:12px}.harmonica-modifiers small{font-size:9px}}@media(max-width:1050px)and (max-height:600px)and (orientation:landscape){.harmonica-hero{min-height:90px;margin:10px 0;padding:12px 18px}.harmonica-control-label{margin:13px 0 7px}.harmonica-modifiers{grid-template-columns:repeat(4,minmax(0,1fr))}.harmonica-keys{grid-template-columns:repeat(8,minmax(0,1fr))}.harmonica-key{min-height:103px}.harmonica-hole{width:28px}}.page-content.practice-page{height:calc(100dvh - 72px);padding-top:10px;padding-bottom:10px}.practice-page .harmonica-workspace{height:100%;min-height:0;grid-template-rows:minmax(0,2fr) minmax(0,1fr);gap:10px}.practice-page .harmonica-score{min-height:0;overflow:hidden}.practice-page .harmonica-score-viewer,.practice-page .harmonica-score-empty{height:auto;min-height:0;align-self:stretch}.practice-page .harmonica-card{min-height:0;overflow:auto}.practice-page .harmonica-hero{margin:0;padding:5px 10px;min-height:36px}.practice-page .harmonica-breath{height:29px}.practice-page .harmonica-control-label{margin:2px 0 0}.practice-page .harmonica-footer{margin:0}.practice-page .harmonica-key{min-height:68px}@media(min-width:700px){.practice-page .harmonica-score{grid-template-rows:auto minmax(0,1fr) auto}.practice-page .harmonica-score-heading,.practice-page .harmonica-score-toolbar{grid-row:1}.practice-page .harmonica-score-viewer,.practice-page .harmonica-score-empty{grid-row:2}.practice-page .harmonica-score-bottom{grid-row:3;margin-top:0}.practice-page .harmonica-card{grid-template-rows:minmax(0,1fr) auto}.practice-page .harmonica-card>.harmonica-hero,.practice-page .harmonica-card>.harmonica-control-label{display:none}.practice-page .harmonica-modifiers,.practice-page .harmonica-keys{grid-row:1;align-self:stretch}.practice-page .harmonica-footer{grid-row:2}.practice-page .harmonica-modifiers>button,.practice-page .harmonica-middle{min-height:34px}.practice-page .harmonica-key{min-height:68px}}@media(min-width:700px)and (max-width:1199px){.page-content.practice-page{height:calc(100dvh - 55px)}}@media(max-width:699px){.page-content.practice-page{height:calc(100dvh - 120px - env(safe-area-inset-bottom));padding:8px 12px}.practice-page .harmonica-score{display:flex;flex-direction:column;gap:6px}.practice-page .harmonica-score-toolbar{margin:0}.practice-page .harmonica-score-viewer,.practice-page .harmonica-score-empty{flex:1 1 auto;height:auto;min-height:0}.practice-page .harmonica-score-bottom{margin:0}.practice-page .harmonica-card{padding:8px 10px}.practice-page .harmonica-hero{margin:0 0 4px;padding:3px 8px}.practice-page .harmonica-control-label{margin:2px 0 0}.practice-page .harmonica-modifiers>button,.practice-page .harmonica-middle{min-height:32px;padding:3px}.practice-page .harmonica-keys{padding:3px;gap:3px}.practice-page .harmonica-key{min-height:54px;gap:0;padding:2px 1px}.practice-page .harmonica-hole{width:20px;border-width:2px}.practice-page .harmonica-degree{font-size:17px}.practice-page .harmonica-footer{margin-top:2px}}@media(max-width:1050px)and (max-height:600px)and (orientation:landscape){.page-content.practice-page{height:calc(100dvh - 100px - env(safe-area-inset-bottom));padding:5px 10px}.practice-page .harmonica-score{display:flex;flex-direction:column;gap:4px;padding:5px 8px}.practice-page .harmonica-score-toolbar{flex:none;margin:0}.practice-page .harmonica-score-viewer,.practice-page .harmonica-score-empty{flex:1 1 auto;height:auto;min-height:0}.practice-page .harmonica-score-bottom{flex:none}.practice-page .harmonica-score-heading{display:none}.practice-page .harmonica-card{display:grid;grid-template-columns:135px minmax(0,1fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:5px;overflow:hidden;padding:5px}.practice-page .harmonica-card>.harmonica-hero,.practice-page .harmonica-card>.harmonica-control-label,.practice-page .harmonica-footer{display:none}.practice-page .harmonica-modifiers{grid-column:1;grid-row:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;align-self:stretch}.practice-page .harmonica-modifiers>button,.practice-page .harmonica-middle{min-height:0;padding:2px}.practice-page .harmonica-keys{grid-column:2;grid-row:1;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;padding:3px;align-self:stretch}.practice-page .harmonica-key{min-height:0;padding:2px 0;gap:1px}.practice-page .harmonica-hole{width:18px;border-width:2px}.practice-page .harmonica-degree{font-size:15px}}:root{font-family:Manrope,Microsoft YaHei,sans-serif;color:#27302e;background:#f6f7f5;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #94c9b9;outline-offset:2px}.app-shell{min-height:100vh;display:flex}.sidebar{width:252px;flex:none;background:#111b1b;color:#f3f7f4;display:flex;flex-direction:column;padding:31px 17px 24px;min-height:100vh}.brand{display:flex;align-items:center;gap:13px;padding:0 13px 56px}.brand strong{font-size:15px;letter-spacing:.16em;font-weight:800;display:block}.brand small{font-size:9px;color:#7e9992;letter-spacing:.18em;font-weight:700;display:block;margin-top:3px}.brand-mark{height:37px;width:37px;background:#d7ebdc;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:2px;transform:rotate(-7deg)}.brand-mark span{background:#18362e;width:4px;height:15px;border-radius:3px}.brand-mark span:nth-child(2){height:24px}.brand-mark span:nth-child(3){height:19px}.brand-mark span:nth-child(4){height:11px}.nav-caption{padding:0 16px;color:#667f79;font-size:10px;font-weight:800;letter-spacing:.17em;margin-bottom:15px}.nav-list{display:grid;gap:6px}.nav-item{border:0;width:100%;height:50px;border-radius:10px;background:transparent;color:#aabcb6;text-align:left;padding:0 15px;display:flex;align-items:center;gap:13px;font-size:13px;font-weight:700;transition:.18s}.nav-item:hover{background:#21312e;color:#fff}.nav-item.selected{color:#e9f8ef;background:#2b4b3e}.nav-icon{font-size:21px;width:23px;line-height:1;text-align:center;font-family:serif}.nav-number{margin-left:auto;color:#789486;font-size:10px;letter-spacing:.1em}.nav-item.selected .nav-number{color:#b8d4bf}.sidebar-bottom{margin-top:auto;border-top:1px solid #2b3936;padding:23px 13px 0;color:#b1c3bb;font-size:11px;font-weight:700}.sidebar-bottom small{display:block;margin:12px 0 0 13px;color:#6d827b;font-size:9px;letter-spacing:.12em}.status-dot,.mini-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#8fd6a7;box-shadow:0 0 0 3px #8fd6a722;margin-right:7px}.main-content{min-width:0;flex:1}.topbar{height:72px;border-bottom:1px solid #e5eae7;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,65px);color:#60716a;font-size:12px;font-weight:700;background:#fbfcfa}.topbar-divider{padding:0 11px;color:#c7d0cb}.topbar-right{color:#7a9587;font-size:11px}.page-content{max-width:1390px;margin:auto;padding:48px clamp(24px,4vw,65px) 70px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:34px}.eyebrow,.section-kicker{color:#51846a;font-size:10px;letter-spacing:.21em;font-weight:800}.eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:13px}.eyebrow-line{width:22px;height:1px;background:#6ba281}.page-heading h1{font-size:clamp(35px,3.6vw,52px);line-height:1.16;letter-spacing:-.055em;margin:0 0 10px;font-weight:800;color:#1c2b27}.heading-dot{color:#6cad87}.page-heading p{margin:0;color:#85928b;font-size:13px}.heading-index{font-size:24px;font-weight:800;color:#6da487;letter-spacing:-.05em;padding-bottom:6px}.heading-index span{font-size:12px;color:#adb9b0}.card{background:#fff;border:1px solid #e8eeea;border-radius:18px;box-shadow:0 14px 38px #19352608}.instrument-card,.metro-card,.tuner-card{padding:31px}.card-title-row{display:flex;justify-content:space-between;align-items:center;gap:15px}.card h2{font-size:21px;letter-spacing:-.04em;margin:8px 0 0;color:#27332e}.pill{border:1px solid #dfebe2;color:#6d9b7d;background:#f7fbf8;border-radius:100px;padding:8px 13px;font-size:10px;letter-spacing:.1em;font-weight:800;white-space:nowrap}.piano-display{margin:27px 0 29px;background:#182c25;color:#eff8ef;border-radius:12px;height:112px;display:flex;align-items:center;padding:24px 28px;gap:18px}.display-pulse{color:#9fe0ad;font-size:19px;align-self:flex-start;margin-top:2px}.piano-display small{display:block;font-size:10px;letter-spacing:.16em;color:#9ab5a3;font-weight:700}.piano-display strong{display:block;font-size:42px;line-height:1.3;letter-spacing:-.06em}.display-frequency{margin-left:auto;color:#b2cdb9;font-size:12px;font-weight:700;align-self:end;margin-bottom:7px}.piano-scroll{overflow-x:auto;padding-bottom:6px}.piano{--white-width:calc(100% / 15);--black-width:calc(var(--white-width) * .64);position:relative;display:flex;height:235px;min-width:740px;-webkit-user-select:none;user-select:none;touch-action:manipulation}.white-key{height:100%;width:var(--white-width);padding:0;position:relative;border:1px solid #cdd8d0;border-right:0;background:linear-gradient(#fff,#fafcf9);border-radius:0 0 6px 6px;box-shadow:inset 0 -7px #e9efeb,0 3px 6px #192a1d18;transition:background .1s}.white-key:last-of-type{border-right:1px solid #cdd8d0}.white-key:hover,.white-key.active{background:#dbeee1}.black-key{position:absolute;top:0;width:var(--black-width);height:60%;z-index:2;border:1px solid #182723;border-radius:0 0 6px 6px;background:linear-gradient(100deg,#283630,#101c19);box-shadow:2px 5px 5px #0e1d1b40,inset -3px -6px 1px #0a1513;color:#ecf4ed}.black-key:hover,.black-key.active{background:#4d7b5e}.key-note,.key-hint{position:absolute;left:50%;transform:translate(-50%);font-size:10px;white-space:nowrap;font-weight:800}.white-key .key-note{bottom:31px;color:#496655}.white-key .key-hint{bottom:12px;color:#acb9af;font-size:9px}.black-key .key-note{bottom:26px;color:#dcefe1;font-size:9px}.black-key .key-hint{bottom:10px;color:#91ae9c;font-size:9px}.instrument-footer{margin-top:21px;border-top:1px solid #eff2ef;padding-top:22px;display:flex;align-items:center;justify-content:space-between;gap:14px}.footer-tip{font-size:11px;color:#8b9c90;font-weight:600}.footer-tip span{font-size:18px;color:#7fa98c;vertical-align:-2px;margin-right:5px}.switches,.guitar-toggles{display:flex;gap:24px}.switch-label{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:700;color:#64776b;white-space:nowrap;cursor:pointer}.switch-label input{position:absolute;opacity:0;width:1px;height:1px}.switch{width:31px;height:18px;background:#ccd8ce;border-radius:99px;position:relative;transition:.2s}.switch:after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:#fff;top:3px;left:3px;box-shadow:0 1px 3px #0002;transition:.2s}.switch-label input:checked+.switch{background:#65a97e}.switch-label input:checked+.switch:after{left:16px}.switch-label input:focus-visible+.switch{outline:3px solid #94c9b9;outline-offset:2px}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:17px}.info-card{background:#fff;border:1px solid #e8eeea;border-radius:13px;min-height:96px;display:flex;align-items:center;gap:16px;padding:20px}.info-icon{width:41px;height:41px;border-radius:10px;background:#eff7f0;color:#5d9f71;display:grid;place-items:center;font-size:23px;font-family:serif}.info-card small{display:block;color:#96a39a;font-size:10px;font-weight:700;margin-bottom:4px}.info-card strong{font-size:14px;color:#314139}.info-card em{font-style:normal;font-size:11px;color:#93a598}.guitar-topline{margin:28px 0 18px;display:flex;align-items:center;justify-content:space-between;color:#758b7c;font-size:11px;font-weight:700}.fretboard-scroll{overflow-x:auto;padding-bottom:6px}.fretboard{min-width:850px;background:#f5eee2;border:1px solid #e2d5c1;border-radius:10px;padding:19px 14px 10px;overflow:hidden}.string-row{display:flex;height:47px;align-items:stretch}.string-name{width:27px;flex:none;display:flex;align-items:center;justify-content:flex-start;font-weight:800;font-size:14px;color:#647765}.fret{position:relative;flex:1;min-width:0;border:0;border-right:3px solid #b6ac97;background:transparent;padding:0;display:grid;place-items:center}.fret:first-of-type{border-right:5px solid #e3dfce;background:#ffffff80}.fret:last-of-type{border-right:0}.fret:hover,.fret-selected{background:#739d7333}.string-line{position:absolute;left:0;right:0;top:50%;background:#9b8c70;box-shadow:0 1px 1px #65553b66;pointer-events:none}.fret-label{position:relative;background:#fffdf2e9;box-shadow:0 1px 2px #49392326;border-radius:100px;width:26px;height:26px;display:grid;place-items:center;color:#4d5d49;font-size:10px;font-weight:800}.fret:hover .fret-label,.fret-selected .fret-label{background:#386a4b;color:#fff}.fret-numbers,.fret-markers{display:flex;padding-left:27px;text-align:center;color:#968b77;font-size:10px;font-weight:700}.fret-numbers{margin-top:10px}.fret-numbers span,.fret-markers span{flex:1}.fret-numbers span:first-child,.fret-markers span:first-child{display:none}.fret-markers{height:20px;color:#8d9e78;font-size:11px}.guitar-footer{display:flex;justify-content:space-between;margin-top:24px;gap:12px;color:#6b9876}.guitar-current{font-size:11px;font-weight:700}.metronome-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:17px}.bpm-panel{text-align:center;margin-top:27px;background:#f7faf7;border:1px solid #edf2ed;border-radius:13px;padding:25px 25px 18px}.bpm-label,.field-label{font-size:10px;letter-spacing:.13em;font-weight:800;color:#7a9180}.bpm-control{display:flex;align-items:center;justify-content:center;gap:25px;margin-top:8px}.bpm-control button{width:38px;height:38px;border:1px solid #dfebe0;border-radius:10px;background:#fff;color:#558967;font-size:23px;line-height:1}.bpm-control input{width:170px;background:transparent;border:0;text-align:center;font-size:81px;font-weight:800;color:#254433;letter-spacing:-.08em;appearance:textfield;outline:0}.bpm-control input::-webkit-inner-spin-button,.bpm-control input::-webkit-outer-spin-button{appearance:none}.bpm-unit{margin-top:-8px;color:#79a184;font-size:11px;font-weight:800;letter-spacing:.2em}.bpm-slider{display:block;width:100%;margin:28px 0 7px;accent-color:#69a57c}.range-labels{display:flex;justify-content:space-between;color:#a1afa4;font-size:9px;font-weight:700}.meter-controls{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:25px}.meter-controls>div{border:1px solid #e9eee9;border-radius:10px;padding:17px}.meter-selects{display:flex;align-items:center;gap:12px;margin-top:9px;color:#9baaa0;font-size:18px}.meter-selects select{border:0;background:transparent;font-size:24px;font-weight:800;color:#32483a;min-width:55px}.interval-readout{font-size:25px;font-weight:800;color:#32483a;margin-top:7px}.interval-readout span{font-size:12px;color:#9bad9f}.beat-section{margin-top:27px}.beat-section .field-label{display:flex;justify-content:space-between}.beat-section .field-label span{letter-spacing:0;color:#a0ada3;font-weight:600}.beat-grid{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}.beat-button{width:55px;height:75px;border:1px solid #e4ece5;background:#f9fbf9;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#667b68;transition:.12s}.beat-button.current{box-shadow:0 0 0 3px #98c9a1;border-color:#6dac80;transform:translateY(-2px)}.beat-indicator{width:9px;height:9px;border-radius:50%;background:#b2c8b6}.accent-0 .beat-indicator{background:#d9dfda}.accent-1 .beat-indicator{background:#b0cbb4}.accent-2 .beat-indicator{background:#70b486}.accent-3 .beat-indicator{background:#36865a;box-shadow:0 0 0 3px #daeede}.beat-button strong{font-size:13px}.beat-button small{font-size:9px;color:#9aa99e}.metro-actions{display:flex;gap:10px;margin-top:26px}.primary-button{border:0;border-radius:10px;background:#467d59;color:#fff;font-weight:800;font-size:13px;padding:15px 23px;box-shadow:0 8px 16px #487b5e22}.primary-button:hover{background:#356c49}.primary-button span{margin-right:12px}.secondary-button{border:1px solid #dce8df;border-radius:10px;background:#fff;color:#5e876b;font-weight:800;font-size:12px;padding:14px 23px}.voice-card{padding:30px 21px;height:max-content}.voice-card h2{font-size:20px}.voice-card p{color:#9aa89d;font-size:11px;margin:9px 0 24px}.voice-list{display:grid;gap:8px}.voice-option{display:flex;align-items:center;gap:13px;width:100%;padding:10px;border-radius:9px;border:1px solid #edf1ed;background:#fff;text-align:left;font-size:12px;font-weight:800;color:#62756a}.voice-option:hover,.voice-option.selected{background:#f2f8f3;border-color:#c9e2ce;color:#386d4d}.voice-icon{display:grid;place-items:center;width:33px;height:33px;border-radius:8px;background:#f0f5f0;font-size:18px;color:#659773}.voice-radio{margin-left:auto;width:15px;height:15px;border-radius:50%;border:1px solid #c6d8ca}.voice-option.selected .voice-radio{border:4px solid #5c9e6d}.voice-hint{border-top:1px solid #edf1ed;margin-top:24px;padding-top:20px;color:#9baa9d;font-size:11px}.tuner-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:17px}.pill.live{color:#3c9a5b}.tuner-main{text-align:center;padding:40px 30px 20px}.tuner-arc{max-width:460px;margin:0 auto}.tuner-ticks{display:flex;justify-content:space-between;align-items:flex-end;height:27px}.tuner-ticks span{height:10px;width:1px;background:#bacdc0}.tuner-ticks span.major{height:22px;background:#679473;width:2px}.tuner-needle-track{height:37px;border-bottom:2px solid #dce7de;position:relative}.tuner-needle-track:before{content:"";position:absolute;bottom:-3px;left:50%;height:28px;width:2px;background:#a6c9ab}.tuner-needle{position:absolute;bottom:-5px;width:10px;height:40px;background:#4d9a67;border-radius:5px;transform:translate(-50%);box-shadow:0 3px 12px #4d9a6766;transition:left .12s}.tuner-scale{display:flex;justify-content:space-between;color:#a4b3a8;font-size:10px;margin-top:10px;font-weight:700}.detected-note{margin:38px auto 22px}.detected-note small{display:block;color:#9bad9e;letter-spacing:.15em;font-size:10px;font-weight:800}.detected-note div{font-size:104px;line-height:1.1;letter-spacing:-.07em;font-weight:800;color:#2e6245}.detected-note div span{font-size:33px;vertical-align:top;margin-left:6px;color:#8ab193}.detected-note strong{color:#91a998;font-size:14px}.tuner-message{color:#8fa496;font-size:13px;font-weight:700;min-height:26px}.tuner-message span{margin-right:9px;font-size:18px}.tuner-message.inTune{color:#3d9960}.tuner-button{margin:24px auto 0;min-width:180px}.privacy-note{font-size:10px;color:#a7b4aa;margin:17px 0 0}.error-message{color:#b25b50;font-size:12px;margin:15px auto}.tuner-side{display:grid;gap:17px;align-content:start}.tuning-reference{padding:27px}.tuning-reference h2{margin-bottom:23px}.reference-row{display:flex;align-items:center;border-bottom:1px solid #eef2ee;padding:11px 0;gap:12px}.reference-row:last-child{border-bottom:0}.reference-row span{color:#9aaa9d;font-size:11px;flex:1}.reference-row strong{color:#426e50;font-size:14px}.reference-row small{color:#9baa9e;font-size:10px;width:50px;text-align:right}.tuner-tip{display:flex;gap:13px;background:#edf5ef;border:1px solid #e1ece3;border-radius:14px;padding:21px;color:#5a8c68}.tuner-tip>span{font-size:19px}.tuner-tip strong{font-size:12px}.tuner-tip p{color:#839c89;font-size:11px;line-height:1.7;margin:8px 0 0}@media(max-width:1100px){.metronome-layout,.tuner-layout{grid-template-columns:1fr}.voice-card{display:block}.voice-list{grid-template-columns:repeat(5,1fr)}.voice-option{display:flex;flex-direction:column;gap:4px}.voice-radio{display:none}.tuner-side{grid-template-columns:1fr 1fr}.piano{min-width:700px}}@media(max-width:760px){.app-shell{display:block}.sidebar{position:sticky;top:0;z-index:5;min-height:0;width:100%;height:66px;padding:10px 16px;flex-direction:row;align-items:center;gap:15px}.brand{padding:0;flex:none}.brand-mark{height:32px;width:32px}.brand strong{font-size:12px}.brand small,.nav-caption,.sidebar-bottom,.nav-number{display:none}.nav-list{display:flex;flex:1;justify-content:flex-end;gap:2px}.nav-item{width:auto;min-width:42px;height:42px;padding:0 9px;justify-content:center;gap:5px;font-size:11px}.nav-icon{width:auto;font-size:17px}.topbar{height:50px;padding:0 20px}.topbar-right{display:none}.page-content{padding:32px 18px 45px}.page-heading{margin-bottom:23px}.page-heading p{font-size:12px}.heading-index{display:none}.instrument-card,.metro-card,.tuner-card{padding:20px}.card h2{font-size:19px}.pill{font-size:9px;padding:7px 9px}.info-grid{grid-template-columns:1fr 1fr}.info-card:last-child{grid-column:1/-1}.info-card{min-height:75px;padding:13px}.instrument-footer,.guitar-topline,.guitar-footer{align-items:flex-start;flex-direction:column}.switches,.guitar-toggles{gap:15px}.piano-display{margin:20px 0;height:94px}.piano-display strong{font-size:34px}.voice-list{grid-template-columns:repeat(3,1fr)}.tuner-side{grid-template-columns:1fr}.tuner-main{padding:30px 0 15px}.detected-note div{font-size:85px}}@media(max-width:430px){.brand strong{font-size:10px}.brand{gap:7px}.nav-item{font-size:0;min-width:35px;padding:0 6px}.nav-icon{font-size:19px}.topbar{font-size:11px}.page-heading h1{font-size:34px}.card-title-row{align-items:flex-start}.pill{white-space:normal;text-align:right;max-width:140px}.info-grid{gap:8px}.info-card{gap:9px}.info-icon{height:34px;width:34px;font-size:17px}.info-card strong{font-size:12px}.beat-section .field-label{display:block}.beat-section .field-label span{display:block;margin-top:4px}.meter-controls{gap:8px}.meter-controls>div{padding:12px}.bpm-control input{width:125px;font-size:70px}.bpm-panel{padding:22px 14px 17px}}@media(max-width:760px){.nav-list{min-width:0}.nav-item{width:43px;min-width:43px;flex:none;padding:0;font-size:0}.nav-item>span:nth-child(2){display:none}.nav-icon{font-size:18px}}@media(max-width:430px){.sidebar{gap:5px;padding-left:12px;padding-right:12px}.nav-item{width:38px;min-width:38px}}.note-picker{margin-top:22px;padding:16px 18px;background:#f7faf7;border:1px solid #e8f0e9;border-radius:11px}.note-picker-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px;color:#587665;font-size:11px;font-weight:800}.note-picker-heading small{margin-left:7px;color:#9caea0;font-size:10px;font-weight:600}.note-picker-heading>div{display:flex;gap:6px}.note-picker-heading button{border:0;background:transparent;color:#6d9a78;font-size:10px;font-weight:800;padding:3px 5px}.note-picker-heading button:hover{text-decoration:underline}.note-chips{display:flex;flex-wrap:wrap;gap:7px}.note-chips button{min-width:36px;height:30px;padding:0 8px;border:1px solid #dce8de;border-radius:7px;background:#fff;color:#8ca092;font-size:11px;font-weight:800}.note-chips button:hover{border-color:#91c29b;color:#4f8b62}.note-chips button.selected{background:#3f8256;border-color:#3f8256;color:#fff}.guitar-note-picker{margin:0 0 20px}.tuner-chart-group{max-width:620px;margin:0 auto 36px;text-align:left;background:#f7faf8;border:1px solid #e5eee7;border-radius:12px;padding:17px 18px 14px}.chart-heading{display:flex;justify-content:space-between;gap:12px;color:#789081;font-size:10px;font-weight:800;letter-spacing:.08em}.chart-heading span:last-child{color:#9eafa2;letter-spacing:0;font-weight:700}.chart-heading .chart-live{color:#5aa671!important;letter-spacing:.08em!important}.tuner-waveform,.tuner-pitch-chart{display:block;width:100%;border-radius:6px;background:#fff}.tuner-waveform{height:76px;margin-top:10px}.pitch-heading{margin-top:19px}.tuner-pitch-chart{height:125px;margin-top:10px}.chart-axis{display:flex;justify-content:space-between;color:#9eafa2;font-size:9px;font-weight:700;margin-top:6px}.tuner-chart-group+.tuner-arc{margin-top:0}@media(max-width:760px){.note-picker{padding:13px;margin-top:17px}.guitar-note-picker{margin-bottom:17px}.note-picker-heading{align-items:flex-start}.note-picker-heading small{display:block;margin:3px 0 0}.tuner-chart-group{padding:13px}.tuner-pitch-chart{height:105px}}.piano-layout-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:24px;color:#82978a;font-size:10px;font-weight:800;letter-spacing:.08em}.piano-layout-options{display:flex;flex-wrap:wrap;gap:6px}.piano-layout-options button{border:1px solid #dbe8de;border-radius:7px;background:#fff;color:#6d8875;padding:7px 10px;font-size:10px;font-weight:800;white-space:nowrap}.piano-layout-options button.selected{background:#3f8256;border-color:#3f8256;color:#fff}.piano-layout-options button:hover:not(.selected){background:#f2f8f3}.piano{--white-width:calc(100% / var(--white-count));min-width:var(--piano-min-width)}.selected-pitch{position:absolute;left:50%;bottom:29px;z-index:3;transform:translate(-50%);border-radius:5px;background:#408458;color:#fff;padding:4px 5px;font-size:10px;line-height:1;font-weight:800;white-space:nowrap;box-shadow:0 2px 6px #204b2e30;pointer-events:none}.black-key .selected-pitch{bottom:25px;background:#86c898;color:#153627}.fret-open{flex:.5}.fret-numbers span:nth-child(2),.fret-markers span:nth-child(2){flex:.5}.fret-pitch{position:relative;left:auto;bottom:auto;transform:none;font-size:10px;padding:5px 4px}@media(max-width:760px){.piano-layout-row{align-items:flex-start;flex-direction:column}.piano-layout-options{width:100%}.piano-layout-options button{flex:1}}.string-row{display:grid;grid-template-columns:27px minmax(0,.5fr) repeat(15,minmax(0,1fr))}.fret-numbers,.fret-markers{display:grid;grid-template-columns:minmax(0,.5fr) repeat(15,minmax(0,1fr))}.volume-control{border:1px solid #e2ebe4;background:linear-gradient(120deg,#f7fbf7,#f3f8f4);border-radius:12px;padding:14px 17px 12px;margin:18px 0 0;max-width:360px}.volume-heading{display:flex;align-items:center;gap:9px;color:#526e5a;font-size:12px;font-weight:800}.volume-heading label{cursor:pointer}.volume-heading strong{margin-left:auto;color:#397b50;font-size:13px;font-variant-numeric:tabular-nums}.volume-symbol{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;background:#e0eee3;color:#4d8a5e;font-size:15px}.volume-control input[type=range]{appearance:none;width:100%;height:7px;margin:14px 0 3px;border-radius:20px;background:linear-gradient(to right,#5d9d70 var(--volume-fill),#d5e3d8 var(--volume-fill));cursor:pointer}.volume-control input[type=range]::-webkit-slider-thumb{appearance:none;width:18px;height:18px;border:3px solid #fff;border-radius:50%;background:#4d9663;box-shadow:0 2px 7px #2b563c40}.volume-control input[type=range]::-moz-range-thumb{width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:#4d9663;box-shadow:0 2px 7px #2b563c40}.volume-control input[type=range]:focus-visible{outline:3px solid #94c9b9;outline-offset:5px}.volume-control-voice{max-width:none;margin:-6px 0 21px}@media(max-width:760px){.volume-control{max-width:none}}.preset-card{padding:29px 31px;margin-top:17px}.preset-header{display:flex;justify-content:space-between;align-items:center;gap:15px}.preset-header h2{margin:7px 0 0}.preset-count{border-radius:99px;padding:7px 12px;background:#eef6ef;color:#477e58;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}.preset-save{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-top:22px}.preset-save input{min-width:0;border:1px solid #dce8df;border-radius:10px;background:#fafcf9;padding:0 16px;color:#314b39;font-size:13px}.preset-save input::placeholder{color:#a2b0a4}.preset-save .primary-button{box-shadow:none}.preset-help{margin:11px 0 0;color:#91a095;font-size:11px;line-height:1.6}.preset-empty{margin-top:22px;border:1px dashed #dbe9df;border-radius:11px;background:#f8fbf8;padding:25px;color:#91a497;font-size:12px;text-align:center}.preset-list{list-style:none;display:grid;gap:9px;padding:0;margin:21px 0 0}.preset-item{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:13px;align-items:center;padding:13px 15px;border:1px solid #e7eee8;border-radius:11px;background:#fff;transition:background .18s,border-color .18s}.preset-item:hover,.preset-loaded{background:#f8fbf8;border-color:#cfe5d4}.preset-order{color:#9eb7a4;font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}.preset-details{min-width:0}.preset-title{display:flex;align-items:center;gap:8px;min-width:0}.preset-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2f4737;font-size:13px}.preset-oldest,.preset-active{flex:none;border-radius:99px;padding:2px 7px;font-size:9px;font-weight:800}.preset-oldest{background:#fff3e8;color:#aa794b}.preset-active{background:#e5f4e8;color:#43885a}.preset-details small{display:block;margin-top:4px;color:#8fa095;font-size:10px}.preset-beats{display:flex;gap:5px;margin-top:9px}.preset-beats span{display:block;width:18px;height:5px;border-radius:9px;background:#d9dfda}.preset-beats span.accent-1{background:#b0cbb4}.preset-beats span.accent-2{background:#70b486}.preset-beats span.accent-3{background:#36865a}.preset-actions{display:flex;gap:7px}.preset-actions button{border-radius:8px;padding:8px 12px;font-size:11px;font-weight:800}.preset-load{border:1px solid #cde3d2;background:#ecf7ee;color:#398054}.preset-load:hover{background:#dff0e3}.preset-delete{border:1px solid #e7eae5;background:#fff;color:#9a9f98}.preset-delete:hover{color:#ad5c55;border-color:#e9c9c5;background:#fff7f6}@media(max-width:760px){.preset-card{padding:20px}}@media(max-width:520px){.preset-save{grid-template-columns:1fr}.preset-save input{min-height:45px}.preset-item{grid-template-columns:24px minmax(0,1fr);gap:8px;padding:12px}.preset-actions{grid-column:2}.preset-actions button{flex:1}.preset-details small{line-height:1.5}}@media(min-width:700px)and (max-width:1050px){.app-shell{display:block}.sidebar{position:sticky;top:0;z-index:10;display:flex;flex-direction:row;align-items:center;gap:18px;width:100%;height:72px;min-height:0;padding:10px 24px}.brand{flex:none;padding:0}.brand-mark{height:36px;width:36px}.brand strong{font-size:13px}.brand small{display:block;font-size:8px}.nav-caption,.sidebar-bottom,.nav-number{display:none}.nav-list{display:flex;flex:1;justify-content:flex-end;gap:4px;min-width:0}.nav-item{display:flex;align-items:center;justify-content:center;gap:8px;width:auto;min-width:0;height:44px;padding:0 13px;font-size:12px;white-space:nowrap}.nav-item>span:nth-child(2){display:inline}.nav-icon{width:auto;font-size:18px}.main-content{width:100%}.topbar{height:55px;padding:0 clamp(24px,4vw,48px)}.page-content{max-width:1100px;padding:35px clamp(24px,4vw,48px) 60px}}@media(min-width:900px)and (max-width:1100px),(min-width:760px)and (max-width:899px)and (orientation:landscape){.metronome-layout{grid-template-columns:minmax(0,1fr) 240px}.tuner-layout{grid-template-columns:minmax(0,1fr) 260px}.voice-list,.tuner-side{grid-template-columns:1fr}.voice-option{flex-direction:row}.voice-radio{display:block}}@media(max-width:1050px)and (max-height:600px)and (orientation:landscape){.sidebar{height:54px;padding:6px 16px}.brand-mark{height:32px;width:32px}.brand small{display:none}.nav-item{height:40px}.topbar{display:none}.page-content{padding:17px clamp(16px,3vw,28px) 38px}.page-heading{align-items:center;margin-bottom:15px}.eyebrow{margin-bottom:5px}.page-heading h1{font-size:30px;margin-bottom:3px}.page-heading p{font-size:11px}.heading-index{font-size:18px}.instrument-card,.metro-card,.tuner-card,.voice-card,.preset-card{padding:20px}.piano-display{height:82px;margin:18px 0}.piano-display strong{font-size:32px}.piano{height:180px}.string-row{height:39px}.fretboard{padding:12px 14px 7px}.tuner-main{padding:24px 10px 10px}}.scores-workspace{display:grid;gap:18px}.score-intro{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px 32px;background:linear-gradient(120deg,#f5faf6,#fff)}.score-intro h2,.score-admin h2{margin:6px 0 8px;color:#2e4c38}.score-intro p,.score-admin-head p{margin:0;color:#8ba092;font-size:12px;line-height:1.7}.score-count{flex:none;display:flex;align-items:baseline;gap:7px;color:#4b9363;font-size:36px;font-weight:800}.score-count small{font-size:11px;color:#91a397}.score-state{padding:44px 20px;text-align:center;color:#849989;font-size:13px}.score-state span{display:block;color:#7daa85;font-size:35px;margin-bottom:10px}.score-state strong{display:block;color:#416b4e;font-size:17px}.score-state p{margin:8px 0 0}.score-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:17px}.score-pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:18px 0 4px;color:#819386;font-size:11px;font-weight:700}.score-pagination>div{display:flex;flex-wrap:wrap;gap:6px}.score-pagination button{min-width:34px;min-height:34px;padding:0 10px;border:1px solid #dce9df;border-radius:8px;background:#fff;color:#4f7c5b;font-size:11px;font-weight:800}.score-pagination button.active{border-color:#4b9060;background:#4b9060;color:#fff}.score-pagination button:disabled{opacity:.45;cursor:default}.score-card{overflow:hidden}.score-cover{height:170px;display:grid;place-items:center;background:linear-gradient(140deg,#eaf3eb,#d8eadc);color:#5c9470}.score-cover-pdf{background:linear-gradient(140deg,#f4eee8,#e9e0d7);color:#967c66}.score-cover-musicxml{background:linear-gradient(140deg,#eaf1f7,#dfeaf3);color:#6f91ad}.score-cover span{font-size:38px;font-weight:800;letter-spacing:.08em}.score-cover img{width:100%;height:100%;object-fit:cover}.score-card-body{padding:20px}.score-card-body h3{margin:8px 0 4px;color:#304d39;font-size:17px;overflow-wrap:anywhere}.score-card-body p{margin:0;color:#91a395;font-size:11px;min-height:18px}.score-card-actions{display:flex;align-items:center;gap:10px;margin-top:18px}.score-card-actions .primary-button{padding:10px 15px;box-shadow:none}.score-delete,.score-text-button{border:0;background:transparent;color:#7d9a84;font-size:11px;font-weight:800;padding:8px;cursor:pointer}.score-delete:hover{color:#b86056}.score-text-button:hover{color:#397f51;text-decoration:underline}.score-admin{padding:28px 32px}.score-admin-head{display:flex;justify-content:space-between;align-items:start;gap:12px}.score-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:21px}.score-form label,.score-login label{display:grid;gap:8px;color:#5d7c65;font-size:11px;font-weight:800}.score-form input,.score-login input{min-width:0;width:100%;min-height:44px;border:1px solid #dce8de;border-radius:9px;padding:10px 12px;background:#fbfdfb;color:#2f4c38;font:inherit;font-size:13px}.score-form input:focus,.score-login input:focus{outline:2px solid #9ccdab;outline-offset:1px}.score-file-label{grid-column:1/-1}.score-file-label input{padding:9px}.score-file-label small{color:#91a395;font-size:10px;font-weight:500}.score-paste-field{grid-column:1/-1;display:grid;gap:8px;color:#5d7c65;font-size:11px;font-weight:800}.score-paste-zone{width:100%;min-height:86px;resize:vertical;border:1px dashed #aacdb3;border-radius:11px;padding:15px 17px;background:#f5faf6;color:#416b4e;font:inherit;font-size:12px;line-height:1.6;outline:none}.score-paste-zone::placeholder{color:#88a491;opacity:1}.score-paste-zone:focus{border-color:#4b9363;box-shadow:0 0 0 3px #91c9a544;background:#fff}.score-selected-file{overflow-wrap:anywhere;color:#3b8b59;font-size:11px;font-weight:700}.score-form .primary-button{justify-self:start}.score-login{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end;gap:12px;margin-top:20px}.score-login .score-error{grid-column:1/-1}.score-error{margin:13px 0 0;color:#b75f55;font-size:12px}.score-success{margin:13px 0 0;color:#3b8b59;font-size:12px}.score-preview-backdrop{position:fixed;inset:0;z-index:100;background:#14271dcc;display:grid;place-items:center;padding:12px}.score-preview{display:flex;flex-direction:column;width:min(1720px,100%);height:calc(100dvh - 24px);background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 24px 70px #0e271b66}.score-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 20px;border-bottom:1px solid #e6eee7}.score-preview-bar>div{min-width:0;display:flex;align-items:center;gap:13px}.score-preview-bar strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2d4c38;font-size:14px}.score-preview-bar small{color:#90a596;font-size:11px}.score-preview-bar a{white-space:nowrap;color:#4b8760;font-size:11px;font-weight:800}.score-preview-bar button{width:34px;height:34px;flex:none;border:0;border-radius:8px;background:#f0f5f1;color:#4c7457;font-size:24px;cursor:pointer}.score-preview-bar .score-expand-button{width:auto;padding:0 12px;font-size:11px;font-weight:800}.score-preview-backdrop.is-image-fullscreen{padding:0;background:#14271d}.is-image-fullscreen .score-preview{width:100vw;height:100dvh;border-radius:0;box-shadow:none}.is-image-fullscreen .score-preview-bar{position:relative;z-index:2;border:0;background:#14271d}.is-image-fullscreen .score-preview-bar strong,.is-image-fullscreen .score-preview-bar small,.is-image-fullscreen .score-preview-bar a{color:#fff}.is-image-fullscreen .score-preview-bar button{background:#ffffff26;color:#fff}.score-preview-body{flex:1;min-height:0;overflow:auto;background:#f4f6f4}.score-preview-body.score-preview-image{overflow:hidden}.score-image-stage{position:relative;display:block;width:100%;height:100%;padding:0;border:0;overflow:hidden;background:#f4f6f4;cursor:zoom-in;touch-action:manipulation}.score-image-stage.is-zoomed{cursor:grab;touch-action:none}.score-image-stage.is-zoomed:active{cursor:grabbing}.score-image-stage>img{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none;will-change:transform}.score-image-hint{position:absolute;bottom:16px;left:50%;transform:translate(-50%);padding:8px 12px;border-radius:999px;background:#203727cc;color:#fff;font-size:11px;font-weight:700;white-space:nowrap;pointer-events:none}.score-image-stage:focus-visible{outline:3px solid #4b9363;outline-offset:-3px}.score-preview-body>iframe{display:block;width:100%;height:100%;border:0;background:#fff}.score-musicxml{padding:20px;min-height:100%;background:#fff}.score-musicxml>p{text-align:center;color:#809988;font-size:12px}@media(max-width:760px){.score-intro,.score-admin{padding:20px}.score-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.score-cover{height:130px}.score-card-body{padding:14px}.score-card-body h3{font-size:14px}.score-login{grid-template-columns:1fr}.score-preview-backdrop{padding:0}.score-preview{height:100dvh;width:100%;border-radius:0}.score-preview-bar small{display:none}.nav-list{gap:0;justify-content:space-between}.nav-item{width:auto;min-width:0;flex:1}}@media(max-width:520px){.score-grid{grid-template-columns:1fr}.score-card{display:grid;grid-template-columns:100px minmax(0,1fr)}.score-cover{height:100%}.score-count{font-size:28px}.score-form{grid-template-columns:1fr}.score-form label{grid-column:1}.score-preview-bar{padding:10px 12px}.score-preview-bar a{font-size:10px}.score-preview-bar>div{gap:8px}}@media(max-width:699px)and (max-height:600px)and (orientation:landscape){.nav-item{width:42px;min-width:42px}.nav-item>span:nth-child(2){display:none}.page-heading p{max-width:70vw}}.mobile-header,.scroll-cue{display:none}@media(max-width:1199px){.instrument-card{display:flex;flex-direction:column}.instrument-card:not(.guitar-card) .card-title-row,.guitar-card .card-title-row{order:0}.instrument-card:not(.guitar-card) .piano-display{order:1}.instrument-card:not(.guitar-card) .piano-scroll-cue{order:2}.instrument-card:not(.guitar-card) .piano-scroll{order:3}.instrument-card:not(.guitar-card) .piano-layout-row{order:4}.instrument-card:not(.guitar-card) .volume-control{order:5}.instrument-card:not(.guitar-card) .note-picker{order:6}.instrument-card:not(.guitar-card) .instrument-footer{order:7}.guitar-card .guitar-topline{order:1}.guitar-card .guitar-scroll-cue{order:2}.guitar-card .fretboard-scroll{order:3}.guitar-card .guitar-footer{order:4}.guitar-card .volume-control{order:5}.guitar-card .note-picker{order:6}.scroll-cue{display:flex;justify-content:space-between;gap:12px;margin:14px 0 8px;color:#557c60;font-size:11px;font-weight:800}.scroll-cue span{color:#8da89a;font-weight:700}.piano-scroll,.fretboard-scroll{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x}.piano{--black-width:calc(var(--white-width) * .78)}.piano-layout-options button{min-height:42px}.note-chips button{min-width:42px;min-height:42px}.beat-button{min-width:55px}.meter-selects select,.preset-actions button{min-height:44px}}@media(min-width:700px)and (max-width:1199px){.app-shell{display:flex}.sidebar{position:sticky;inset:0 auto auto;z-index:10;display:flex;flex-direction:column;align-items:center;gap:0;width:88px;min-width:88px;height:100dvh;min-height:100dvh;padding:19px 8px}.sidebar>.brand{display:flex;justify-content:center;padding:0 0 31px}.sidebar>.brand>div:last-child,.nav-caption,.sidebar-bottom,.nav-number{display:none}.sidebar .brand-mark{width:43px;height:43px}.nav-list{display:grid;grid-template-columns:1fr;flex:none;justify-content:stretch;gap:8px;width:100%;min-width:0}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;min-width:0;height:70px;padding:6px 2px;font-size:11px;white-space:nowrap}.nav-item>span:nth-child(2){display:inline}.nav-icon{width:auto;font-size:21px}.main-content{flex:1;width:auto;min-width:0}.topbar{display:flex;height:55px;padding:0 clamp(22px,3vw,42px)}.page-content{max-width:none;padding:32px clamp(22px,3vw,42px) 60px}.voice-list{grid-template-columns:repeat(5,1fr)}}@media(max-width:699px),(max-width:1050px)and (max-height:600px)and (orientation:landscape){.app-shell{display:block}.sidebar{position:fixed;inset:auto 0 0;z-index:20;display:block;width:100%;min-width:0;height:calc(66px + env(safe-area-inset-bottom));min-height:0;padding:5px 10px env(safe-area-inset-bottom);background:#111b1b;box-shadow:0 -9px 24px #14291f26}.sidebar>.brand,.nav-caption,.sidebar-bottom,.nav-number{display:none}.nav-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;height:100%;gap:3px}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:100%;min-width:0;height:56px;padding:3px 0;font-size:10px;line-height:1.2}.nav-item>span:nth-child(2){display:inline}.nav-icon{font-size:20px;line-height:1}.main-content{display:block;width:100%;min-width:0}.mobile-header{display:flex;align-items:center;justify-content:space-between;height:54px;padding:0 18px;background:#fff;border-bottom:1px solid #e7ede8}.mobile-brand{display:flex;align-items:center;gap:9px;color:#1c3b2b;font-size:11px;font-weight:800;letter-spacing:.13em}.mobile-brand .brand-mark{width:30px;height:30px;border-radius:8px;background:#244e37;transform:rotate(-7deg)}.mobile-brand .brand-mark span{width:3px;background:#d9f0dc}.mobile-brand .brand-mark span:nth-child(2){height:19px}.mobile-current{display:flex;align-items:baseline;gap:5px;color:#497d59;font-size:11px;font-weight:800}.mobile-current small{color:#94a89a;font-size:9px}.topbar{display:none}.page-content{max-width:none;padding:18px 16px calc(100px + env(safe-area-inset-bottom))}.page-heading{align-items:flex-start;margin-bottom:15px}.page-heading .eyebrow,.heading-index{display:none}.page-heading h1{font-size:30px;margin:0 0 5px}.page-heading p{font-size:11px;line-height:1.5}.instrument-card,.metro-card,.tuner-card,.voice-card,.preset-card{padding:17px}.piano-display{height:76px;margin:17px 0 0;padding:13px 16px}.piano-display strong{font-size:31px}.piano-display .display-frequency{font-size:10px}.piano{height:205px}.piano-layout-row{margin-top:22px}.piano-layout-options{width:100%}.piano-layout-options button{flex:1 1 18%;padding:8px 5px}.guitar-topline{margin:17px 0 0}.guitar-card .volume-control{margin-top:17px}.guitar-card .guitar-footer{margin-top:10px}.instrument-footer .footer-tip,.guitar-footer .footer-tip{display:none}.metro-actions{display:grid;grid-template-columns:1fr 1fr}.metro-actions button{min-height:52px;padding:10px}.voice-list{grid-template-columns:repeat(2,minmax(0,1fr))}.voice-option{min-height:55px}.tuner-main{display:flex;flex-direction:column;padding:14px 0 8px}.detected-note{order:0;margin:10px auto 7px}.detected-note div{font-size:70px}.tuner-message{order:1;margin-bottom:8px}.tuner-arc{order:2;width:100%;margin:8px auto 22px}.tuner-chart-group{order:3;width:100%;max-width:none;margin:0 auto 12px}.tuner-main .error-message{order:4}.tuner-main .privacy-note{order:5}.tuner-side{grid-template-columns:1fr}}@media(max-width:1050px)and (max-height:600px)and (orientation:landscape){.sidebar{height:calc(56px + env(safe-area-inset-bottom));padding:3px 10px env(safe-area-inset-bottom)}.nav-item{height:50px}.mobile-header{height:44px}.page-content{padding:12px 16px calc(75px + env(safe-area-inset-bottom))}.page-heading{margin-bottom:10px}.page-heading h1{font-size:25px;margin-bottom:1px}.page-heading p{display:none}.instrument-card,.metro-card,.tuner-card,.voice-card,.preset-card{padding:16px}.piano{height:175px}.piano-display{height:64px;margin-top:11px}.piano-display strong{font-size:27px}.scroll-cue{margin:10px 0 6px}.guitar-topline{margin-top:11px}.string-row{height:40px}.fretboard{padding:10px 14px 6px}}@media(min-width:900px)and (max-width:1199px){.voice-list{grid-template-columns:1fr}.voice-option{flex-direction:row}.voice-radio{display:block}}@media(max-width:360px){.metronome-layout,.tuner-layout{grid-template-columns:minmax(0,1fr)}.metronome-layout>.card,.tuner-layout>.card{min-width:0}.bpm-control{gap:10px}.bpm-control input{width:110px;font-size:62px}.meter-controls{grid-template-columns:1fr}.voice-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:699px),(max-width:1050px)and (max-height:600px)and (orientation:landscape){.nav-item{font-size:11px}.key-hint,.guitar-card .pill{display:none}.piano-layout-options button{font-size:11px}.metro-card{display:flex;flex-direction:column}.metro-card .card-title-row{order:0}.metro-card .metro-actions{order:1;margin:18px 0 0}.metro-card .bpm-panel{order:2;margin-top:18px}.metro-card .meter-controls{order:3}.metro-card .beat-section{order:4}}@media(max-width:699px),(max-width:1050px)and (max-height:600px)and (orientation:landscape){.nav-list{grid-template-columns:repeat(6,minmax(0,1fr))}}