:root{--music-ink:#252438;--music-muted:#706d7e;--music-line:#e7e4ed;--music-purple:#6d55d7;--music-purple-dark:#5840bd;--music-mint:#1f9d70;--music-red:#d45c66;--music-blue:#4278c5;--music-bg:#f7f7fa}
.tuner-page[data-instrument=guitar]{--instrument-accent:#6954c7;--instrument-accent-soft:#f1eefc}.tuner-page[data-instrument=bass]{--instrument-accent:#3977a8;--instrument-accent-soft:#edf5fb}.tuner-page[data-instrument=piano]{--instrument-accent:#4d5268;--instrument-accent-soft:#f0f1f5}.tuner-page[data-instrument=guzheng]{--instrument-accent:#a26735;--instrument-accent-soft:#fbf3eb}.tuner-page[data-instrument=ukulele]{--instrument-accent:#258878;--instrument-accent-soft:#eaf7f4}.tuner-page[data-instrument=guqin]{--instrument-accent:#7b6447;--instrument-accent-soft:#f5f1ea}.tuner-page[data-instrument=violin]{--instrument-accent:#9a4d5f;--instrument-accent-soft:#faeff2}
.tuner-page{min-height:100vh;padding:22px 16px 64px;color:var(--music-ink);background:var(--music-bg)}.tuner-page *{box-sizing:border-box}.tuner-shell{width:min(1200px,100%);min-width:0;margin:auto}.tuner-breadcrumb{display:flex;align-items:center;gap:9px;margin:0 0 13px;color:#858190;font-size:13px}.tuner-breadcrumb a{color:#625a8d;text-decoration:none}.tuner-title{margin:0 0 18px}.tuner-title h1{margin:0 0 7px;font-size:clamp(27px,4vw,40px);line-height:1.15;letter-spacing:-.035em}.tuner-title p{max-width:720px;margin:0;color:var(--music-muted);font-size:15px;line-height:1.55}.title-local{display:inline-flex;align-items:center;gap:7px;margin-top:12px;color:#557467;font-size:12px;font-weight:700}.title-local i,.local-badge i{width:7px;height:7px;border-radius:50%;background:#27a977;box-shadow:0 0 0 4px #e5f6ef}
.tuner-console{min-width:0;overflow:hidden;border:1px solid var(--music-line);border-radius:18px;background:#fff;box-shadow:0 14px 42px rgba(48,42,72,.07)}.console-topbar{min-height:49px;padding:0 24px;display:flex;align-items:center;justify-content:flex-end;gap:24px;border-bottom:1px solid #eeecf2}.local-badge{display:flex;align-items:center;gap:8px;color:#5c766b;font-size:12px;font-weight:700}.input-meter{width:min(390px,55%);display:grid;grid-template-columns:auto minmax(90px,1fr) minmax(62px,auto);align-items:center;gap:10px;color:#777382;font-size:11px}.input-label{font-weight:700}.input-meter strong{color:#777382;font-size:10px;font-weight:750;text-align:right;white-space:nowrap}.input-meter strong[data-state=good]{color:var(--music-mint)}.input-meter strong[data-state=noise]{color:#b46c27}.input-meter strong[data-state=low]{color:var(--music-red)}.level-track{height:13px;position:relative;overflow:hidden;background:repeating-linear-gradient(90deg,#e6e3eb 0 10px,transparent 10px 14px)}.level-track i{display:block;width:0;height:100%;background:repeating-linear-gradient(90deg,var(--instrument-accent,var(--music-purple)) 0 10px,transparent 10px 14px);transition:width 80ms}
.tuner-display{position:relative;padding:24px 28px 20px;background:#fcfcfe;text-align:center}.pitch-state{width:min(760px,100%);margin:0 auto 5px;display:flex;justify-content:space-between;align-items:center;color:#898593;font-size:12px}.pitch-state strong{color:var(--music-mint);font-size:13px}.readout{min-height:134px;display:flex;flex-direction:column;align-items:center;justify-content:center}.detected-note{display:flex;align-items:flex-start;color:#26233a;font-family:Inter,ui-sans-serif,system-ui,sans-serif}.detected-note strong{font-size:clamp(72px,9vw,80px);font-weight:780;line-height:.92;letter-spacing:-.065em}.tuner-display:not(.has-reading) .detected-note strong{font-size:50px;color:#aaa6b4;letter-spacing:.02em}.detected-note small,.detected-note span{margin-top:7px;font-size:27px;font-weight:760;color:var(--instrument-accent,#5e4ab6)}.frequency-primary{margin-top:10px;color:#666172;font-size:17px;font-variant-numeric:tabular-nums}
.pitch-meter{width:min(760px,100%);margin:8px auto 0}.meter-labels{display:flex;justify-content:space-between;padding:0 1px 9px;color:#8e8997;font-size:10px;font-variant-numeric:tabular-nums}.meter{height:27px;position:relative;border-top:1px solid #d9d6e0;background:transparent}.meter:after{content:"";position:absolute;left:50%;top:-8px;width:1px;height:25px;background:#43a17e}.meter-ticks{position:absolute;left:0;right:0;top:-1px;height:10px;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),rgba(73,66,91,.3) calc(10% - 1px) 10%)}.tune-zone{position:absolute;left:50%;top:-4px;width:12%;height:7px;border-radius:99px;transform:translateX(-50%);background:#d8f0e7}.needle{position:absolute;z-index:2;left:50%;top:-10px;width:2px;height:30px;background:var(--instrument-accent,#5c48bd);transform:translateX(-50%);transition:left 100ms linear}.needle:before{content:"";position:absolute;left:50%;top:0;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:var(--instrument-accent,#654fd0);transform:translate(-50%,-35%);box-shadow:0 2px 7px rgba(52,42,88,.25)}.cents-readout{margin-top:1px;display:flex;align-items:baseline;justify-content:center;gap:5px}.cents-readout strong{font-size:25px;font-variant-numeric:tabular-nums}.cents-readout span{color:#777382;font-size:11px;text-transform:uppercase}.status-line{min-height:25px;margin-top:3px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:750}.status-lamp{width:8px;height:8px;border-radius:50%;background:#aaa5b5}.tuner-display.is-tuned .status-lamp{background:var(--music-mint)}.tuner-display.is-flat .status-lamp{background:var(--music-blue)}.tuner-display.is-sharp .status-lamp{background:var(--music-red)}
.pitch-trail{width:min(760px,100%);height:58px;margin:12px auto 0;position:relative;border-top:1px solid #eeecf2}.pitch-trail canvas{width:100%;height:42px;display:block}.pitch-trail span{position:absolute;right:0;bottom:0;color:#918d99;font-size:10px}.telemetry{margin-top:13px;display:flex;justify-content:center;gap:clamp(24px,8vw,90px);color:#7b7786;font-size:11px}.telemetry b{margin-left:5px;color:#403b4f;font-variant-numeric:tabular-nums}
.note-selector-wrap{padding:17px 24px;border-top:1px solid #eeecf2}.selector-heading{margin-bottom:10px;color:#777382;font-size:11px;font-weight:700}.instrument-selector{display:flex;gap:8px;min-width:0;overflow-x:auto;padding:2px 1px 6px;scrollbar-color:#d8d4df transparent;scrollbar-width:thin}.note-button{min-width:72px;min-height:55px;padding:8px 10px;border:1px solid #e1dde8;border-radius:10px;background:#fff;color:#3d3849;cursor:pointer;flex:1}.note-button b,.note-button small{display:block}.note-button b{font-size:16px}.note-button small{margin-top:3px;color:#8a8593;font-size:10px}.note-button:hover{border-color:var(--instrument-accent,#7964d5)}.note-button.is-active{border-color:var(--instrument-accent,#7964d5);background:var(--instrument-accent-soft,#f2effd);color:var(--instrument-accent,#5941bb);box-shadow:0 0 0 2px color-mix(in srgb,var(--instrument-accent,#7964d5) 12%,transparent)}.note-button.is-detected{border-color:#60b796}.instrument-selector.is-guqin{display:grid;grid-template-columns:repeat(7,minmax(68px,1fr));overflow:visible}.instrument-selector.is-guzheng{display:grid;grid-template-columns:repeat(11,minmax(58px,1fr));gap:7px}.instrument-selector.is-guzheng .note-button{min-width:0}.instrument-selector.is-piano{display:block;overflow:visible;padding-bottom:2px}.octave-nav{display:flex;align-items:center;justify-content:center;gap:13px;margin:0 0 10px}.octave-nav button{width:32px;height:30px;border:1px solid #ded9e5;border-radius:8px;background:#fff;color:#514b61;font-size:18px;cursor:pointer}.octave-nav button:disabled{opacity:.35;cursor:not-allowed}.octave-nav strong{min-width:88px;color:#5b5666;font-size:12px}.piano-keys{height:128px;display:flex;position:relative;overflow:hidden;border:1px solid #d9d5df;border-radius:9px;background:#292733}.instrument-selector.is-piano .note-button{height:126px;min-width:0;margin:0;padding:86px 2px 8px;border-width:0 1px 0 0;border-color:#d8d4dc;border-radius:0;background:#fff;color:#363241;box-shadow:none}.instrument-selector.is-piano .note-button:last-child{border-right:0}.instrument-selector.is-piano .note-button small{display:none}.instrument-selector.is-piano .note-button.is-black{height:78px;max-width:6.6%;margin:0 -3.3%;z-index:2;padding:48px 1px 5px;border:0;border-radius:0 0 6px 6px;background:#292733;color:#fff;box-shadow:0 4px 7px rgba(24,21,31,.28)}.instrument-selector.is-piano .note-button.is-active{background:var(--instrument-accent-soft);color:var(--instrument-accent)}.instrument-selector.is-piano .note-button.is-black.is-active{background:var(--instrument-accent);color:#fff}.register-label{grid-column:1/-1;color:#8a8693;font-size:10px;font-weight:700}
.primary-actions{padding:18px 24px;display:flex;justify-content:center;gap:12px;border-top:1px solid #eeecf2}.start-button,.reference-button{min-height:48px;padding:0 24px;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:11px;font-size:14px;font-weight:800;cursor:pointer}.start-button{min-width:210px;border:0;background:var(--instrument-accent,var(--music-purple));color:#fff;box-shadow:0 7px 17px color-mix(in srgb,var(--instrument-accent,var(--music-purple)) 24%,transparent)}.start-button:hover{filter:brightness(.92)}.start-button.is-active{background:#353246}.start-button:focus-visible,.reference-button:focus-visible,.note-button:focus-visible{outline:3px solid color-mix(in srgb,var(--instrument-accent,#7964d5) 28%,#fff);outline-offset:2px}.mic-icon svg,.reference-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2}.reference-button{border:1px solid color-mix(in srgb,var(--instrument-accent,#7964d5) 28%,#ddd);background:#fff;color:var(--instrument-accent,#5f4ab6)}.reference-button.is-active{border-color:var(--instrument-accent,#7964d5);background:var(--instrument-accent-soft,#f1edff)}
.control-panel{padding:17px 24px;border-top:1px solid #eeecf2;background:#fbfbfc}.control-row{display:flex;align-items:end;gap:14px}.main-options .control-group{width:min(310px,50%)}.control-group{display:flex;flex-direction:column;gap:7px;min-width:0}.control-label{color:#777382;font-size:11px;font-weight:650}.control-panel select,.stepper{height:42px;border:1px solid #ddd9e5;border-radius:9px;background:#fff;color:#363146}.control-panel select{width:100%;padding:0 10px}.segmented{height:42px;padding:3px;display:flex;border:1px solid #e1dde8;border-radius:9px;background:#f1eff4}.segmented button{flex:1;border:0;border-radius:6px;background:transparent;color:#777382;cursor:pointer}.segmented button.is-active{background:#fff;color:#5943ad;box-shadow:0 1px 5px rgba(48,40,68,.1);font-weight:750}.advanced-settings{margin-top:12px;border-top:1px solid #e9e6ed}.advanced-settings summary{padding-top:12px;color:#625b77;font-size:12px;font-weight:700;cursor:pointer}.advanced-grid{max-width:635px;margin-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.stepper{display:grid;grid-template-columns:34px 1fr 34px 28px;align-items:center;overflow:hidden}.stepper button{height:100%;border:0;background:#f1eff5;color:#625c70;font-size:17px;cursor:pointer}.stepper input{width:100%;min-width:0;border:0;background:transparent;text-align:center;font-weight:750;appearance:textfield}.stepper em{color:#888292;font-size:10px;font-style:normal}.privacy-strip{padding:13px 24px;display:flex;align-items:center;justify-content:center;gap:9px;border-top:1px solid #eeeaf2;background:#fff;color:#61766d;font-size:12px}.privacy-strip svg{width:17px;height:17px;flex:none;fill:none;stroke:#2da879;stroke-width:1.8}
.tuning-disclaimer{margin:16px 0;padding:13px 15px;display:flex;gap:10px;border:1px solid #eadcae;border-radius:11px;background:#fffaf0;color:#685b31;font-size:13px;line-height:1.6}.tuner-content{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.tuner-content>section,.pitch-results{padding:23px;border:1px solid #e4e3ea;border-radius:15px;background:#fff;box-shadow:0 6px 20px rgba(34,29,59,.035)}.tuner-content h2{margin:0 0 10px;font-size:20px}.tuner-content p{margin:0;color:#625f70;line-height:1.8}.related-tuners,.tuner-faq{grid-column:1/-1}.related-tuners>div{display:flex;gap:8px;flex-wrap:wrap}.related-tuners a{padding:9px 13px;border:1px solid #ded9ec;border-radius:9px;background:#faf9fd;color:#5e48ad;text-decoration:none}.tuner-faq details{padding:14px 2px;border-top:1px solid #ebe8ef}.tuner-faq details:first-of-type{border-top:0}.tuner-faq summary{cursor:pointer;font-weight:700}.tuner-faq details p{margin-top:9px}
.pitch-steps{margin:0;padding:16px 24px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;list-style:none}.pitch-steps li{display:flex;align-items:center;gap:8px;color:#746e82;font-size:12px;font-weight:700}.pitch-steps li span{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#f0edfa;color:#6753bc}.pitch-setup{padding:16px 24px 22px;display:grid;grid-template-columns:1.1fr 1fr 1fr 1.35fr;gap:14px;align-items:end}.pitch-setup select,.pitch-setup .stepper,.pitch-setup .reference-button{height:46px}.pitch-setup .start-button{height:46px}.pitch-live{margin:0 24px 22px;padding:20px 24px;display:grid;grid-template-columns:1fr 1fr;gap:12px;border:1px solid #e4ddf2;border-radius:14px;background:#fbfaff;color:#2b2540}.pitch-live>div:not(.pitch-test-trail){display:flex;align-items:baseline;justify-content:center;gap:8px}.pitch-live span{color:#746e82;font-size:12px;text-transform:uppercase;letter-spacing:.06em}.pitch-live strong{font-size:43px;font-variant-numeric:tabular-nums}.pitch-live strong[data-state=tuned]{color:#238258}.pitch-live strong[data-state=flat],.pitch-live strong[data-state=sharp]{color:#8b59a9}.pitch-test-trail{grid-column:1/-1;height:72px;border-block:1px solid #ece8f2}.pitch-test-trail canvas{width:100%;height:100%;display:block}.pitch-live p{grid-column:1/-1;margin:0;text-align:center;font-weight:700}.pitch-results{margin-top:22px}.pitch-results h2{margin:0 0 8px}.pitch-results h3{margin:24px 0 10px;font-size:15px}.result-grid{margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.result-grid>div{padding:15px;border:1px solid #e5e1ec;border-radius:10px;background:#faf9fc}.result-grid span{min-height:34px;display:block;color:#6c6878;font-size:12px}.result-grid strong{display:block;color:#342e48;font-size:20px}.pitch-results canvas{width:100%;height:auto;display:block;border:1px solid #e3dfeb;border-radius:9px}.pitch-results>p{color:#686475}
@media(max-width:820px){.tuner-content{grid-template-columns:1fr}.tuner-content>section{grid-column:1}.instrument-selector.is-guqin,.instrument-selector.is-guzheng{display:flex;overflow-x:auto}.instrument-selector.is-guzheng .note-button{min-width:62px}.pitch-setup{grid-template-columns:1fr 1fr}.result-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.tuner-page{padding:14px 10px 42px}.tuner-title p{font-size:13px}.tuner-console{border-radius:15px}.console-topbar{min-height:62px;padding:8px 14px;gap:10px}.local-badge{font-size:10px;white-space:nowrap}.input-meter{width:min(225px,66%);grid-template-columns:minmax(58px,1fr) minmax(58px,auto);gap:7px}.input-label{display:none}.input-meter strong{font-size:9px}.level-track{height:11px}.tuner-display{padding:19px 14px 17px}.pitch-state{padding:0 4px}.readout{min-height:108px}.detected-note strong{font-size:clamp(52px,17vw,64px)}.tuner-display:not(.has-reading) .detected-note strong{font-size:44px}.detected-note small,.detected-note span{font-size:21px}.frequency-primary{font-size:15px}.pitch-trail{height:52px}.telemetry{gap:12px;justify-content:space-between}.telemetry span{max-width:50%;text-align:left}.telemetry span:last-child{text-align:right}.note-selector-wrap{padding:14px}.note-button{min-width:60px}.instrument-selector.is-piano{overflow:visible}.piano-keys{height:112px}.instrument-selector.is-piano .note-button{height:110px;padding-top:73px;font-size:12px}.instrument-selector.is-piano .note-button.is-black{height:69px;padding-top:42px}.primary-actions{padding:15px 14px;flex-direction:column}.start-button,.reference-button{width:100%;min-width:0}.control-panel{padding:15px 14px}.control-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.main-options .control-group{width:auto}.advanced-grid{grid-template-columns:1fr}.privacy-strip{padding:13px 15px;align-items:flex-start;line-height:1.5;text-align:left}.tuner-content{margin-top:21px}.tuner-content>section{padding:19px}.tuner-breadcrumb{overflow:hidden;white-space:nowrap}.pitch-setup,.result-grid{grid-template-columns:1fr}.pitch-setup{padding:17px 15px}.pitch-live{margin:0 15px 17px;grid-template-columns:1fr}.pitch-live p{grid-column:1}.pitch-live strong{font-size:36px}}
@media(prefers-reduced-motion:reduce){.needle,.level-track i{transition:none}}

/* A held reading is the last confirmed note during a short detector gap. */
.tuner-display.is-held .frequency-primary,.tuner-display.is-held .confidence-value{opacity:.55}
.tuner-display.is-held .needle{opacity:.55}
.tuner-display.is-held .status-line{opacity:.72}

/* Mobile tuner: a dedicated operating layout, not a scaled desktop console. */
body.tuner-body{overflow-x:clip}
body.tuner-body .tuner-console,.tuner-console canvas,.pitch-trail,.input-meter{max-width:100%;min-width:0}
.guzheng-current{display:none}
@media(min-width:769px){
 .instrument-selector.is-guzheng{display:block;overflow:visible}
 .instrument-selector.is-guzheng .guzheng-string-scroller{display:grid;grid-template-columns:repeat(11,minmax(58px,1fr));gap:7px}
 .instrument-selector.is-guzheng .guzheng-string-scroller .note-button{min-width:0}
}

/* Pitch Test has its own three-state layout; all rules stay page-scoped. */
.pitch-test-page .pitch-console[data-pitch-state=ready] .pitch-live,.pitch-test-page .pitch-console[data-pitch-state=ready] + .pitch-results{display:none}
.pitch-test-page .pitch-console[data-pitch-state=testing] .pitch-ready-note{display:none}
.pitch-test-page .pitch-setup{padding:22px 24px;grid-template-columns:minmax(150px,.7fr) minmax(220px,1.2fr) minmax(150px,.7fr);gap:18px 22px;align-items:center}
.pitch-test-page .pitch-target-card{grid-row:1/3;padding:20px 24px;border-right:1px solid var(--music-line);text-align:center}.pitch-test-page .pitch-target-card .control-label{display:block;text-align:left}.pitch-test-page .pitch-target-card strong{display:block;margin-top:12px;color:var(--music-ink);font-size:54px;line-height:1;letter-spacing:-.055em}.pitch-test-page .pitch-target-card .target-frequency{margin-top:9px;color:var(--instrument-accent,var(--music-purple));font-weight:750}.pitch-test-page .pitch-note-control{grid-column:2/3}.pitch-test-page .pitch-note-control select{width:100%;height:46px;border:1px solid var(--music-line);border-radius:9px;background:#fff;padding:0 13px;color:var(--music-ink);font:inherit}.pitch-test-page .pitch-advanced{grid-column:3;grid-row:1;align-self:end}.pitch-test-page #testTone{grid-column:2;grid-row:2}.pitch-test-page #testStart{grid-column:3;grid-row:2}.pitch-test-page .pitch-ready-note{grid-column:2/4}
.pitch-test-page .target-frequency{display:block;margin-top:6px;color:var(--music-muted);font-size:13px;font-variant-numeric:tabular-nums}
.pitch-test-page .pitch-advanced{align-self:end;color:var(--music-muted);font-size:12px}.pitch-test-page .pitch-advanced summary{margin-bottom:7px;cursor:pointer}.pitch-test-page .pitch-advanced .stepper{display:flex;align-items:center;height:46px}.pitch-test-page .pitch-advanced .stepper button{width:40px;height:44px;border:1px solid var(--music-line);background:#fff;cursor:pointer}.pitch-test-page .pitch-advanced input{width:62px;height:44px;border:1px solid var(--music-line);text-align:center}.pitch-test-page .pitch-advanced em{margin-left:5px;font-style:normal}
.pitch-test-page .pitch-ready-note{margin:0;color:var(--music-muted);font-size:13px}.pitch-test-page .pitch-live{display:none}.pitch-test-page .pitch-console[data-pitch-state=testing] .pitch-setup{display:none}.pitch-test-page .pitch-console[data-pitch-state=testing] .pitch-live{display:grid;grid-template-columns:1fr auto;align-items:center;margin:0;padding:26px 32px;border:0;border-radius:0;background:#fff}.pitch-test-page .pitch-live-heading{display:flex;align-items:baseline;gap:12px}.pitch-test-page .pitch-live-heading span{font-size:12px;color:var(--music-muted)}.pitch-test-page .pitch-live-heading strong{font-size:clamp(48px,7vw,72px);line-height:1;font-variant-numeric:tabular-nums}.pitch-test-page .pitch-live-heading small{font-size:14px;color:var(--music-muted)}.pitch-test-page .pitch-live-cents{display:flex;align-items:baseline;gap:6px}.pitch-test-page .pitch-live-cents strong{font-size:36px;font-variant-numeric:tabular-nums}.pitch-test-page .pitch-live-cents small{font-size:11px;color:var(--music-muted)}.pitch-test-page .pitch-live .pitch-meter{grid-column:1/-1;width:100%;margin:12px 0 0}.pitch-test-page .pitch-status{grid-column:1/-1;min-height:25px;margin:6px 0 2px;text-align:center;color:var(--music-muted);font-size:14px;font-weight:700}.pitch-test-page .pitch-test-trail{grid-column:1/-1;width:100%;height:104px;margin-top:8px}.pitch-test-page .pitch-duration{grid-column:1/-1;text-align:right;color:var(--music-muted);font-size:12px}.pitch-test-page .pitch-duration strong{margin-left:6px;color:var(--music-ink)}.pitch-test-page .pitch-results[hidden]{display:none}.pitch-test-page .pitch-results{padding:24px;border:1px solid var(--music-line);border-radius:16px;background:#fff;box-shadow:0 12px 34px rgba(48,42,72,.05)}.pitch-test-page .result-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.pitch-test-page .result-kicker{color:var(--instrument-accent,var(--music-purple));font-size:12px;font-weight:800;letter-spacing:.08em}.pitch-test-page .result-heading h2{margin:3px 0 0}.pitch-test-page .result-verdict{text-align:right}.pitch-test-page .result-evaluation{margin:3px 0;color:var(--music-muted);font-size:13px}.pitch-test-page .result-grid{grid-template-columns:repeat(4,1fr)}.pitch-test-page .result-grid>div{background:#fff}.pitch-test-page .result-grid .result-target strong{font-size:32px}.pitch-test-page .result-grid .result-primary{border-color:#dcd3fa;background:#fbf9ff}.pitch-test-page .result-grid .result-primary strong{color:var(--instrument-accent,var(--music-purple));font-size:25px}.pitch-test-page .result-chart{margin-top:20px;padding:16px;border:1px solid var(--music-line);border-radius:12px}.pitch-test-page .result-chart h3{margin:0 0 12px}.pitch-test-page .result-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.pitch-test-page .result-actions button{min-width:180px;min-height:44px;padding:0 18px}
body.pitch-testing #mobileNav{display:none!important}
/* Keep the stop action available while the live setup controls are hidden. */
.pitch-test-page .pitch-console[data-pitch-state=testing] .pitch-setup{display:flex;justify-content:center;padding:0 24px 20px;gap:0}
.pitch-test-page .pitch-console[data-pitch-state=testing] .pitch-setup>*:not(#testStart){display:none}
.pitch-test-page .pitch-console[data-pitch-state=testing] #testStart{display:flex;width:min(320px,100%);min-height:48px}
.pitch-test-page .result-kicker{display:none}
.pitch-test-page .result-heading h2{margin:0}
@media(max-width:768px){.pitch-test-page{padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}.pitch-test-page .tuner-title{margin-bottom:12px}.pitch-test-page .tuner-title h1{font-size:29px}.pitch-test-page .tuner-title p{font-size:14px}.pitch-test-page .pitch-setup{grid-template-columns:1fr 1fr;gap:10px;padding:16px}.pitch-test-page .pitch-target-card{grid-column:1/-1;grid-row:auto;padding:3px 0 12px;border-right:0;border-bottom:1px solid var(--music-line)}.pitch-test-page .pitch-target-card .control-label{text-align:center}.pitch-test-page .pitch-target-card strong{margin-top:8px;font-size:45px}.pitch-test-page .pitch-target-card .target-frequency{margin-top:5px}.pitch-test-page .pitch-note-control{grid-column:1/-1}.pitch-test-page .pitch-note-control .control-label{display:none}.pitch-test-page .pitch-advanced{grid-column:1/-1;grid-row:auto}.pitch-test-page #testTone,.pitch-test-page #testStart{grid-column:auto;grid-row:auto}.pitch-test-page .pitch-ready-note{grid-column:1/-1}.pitch-test-page .pitch-setup button{min-height:48px}.pitch-test-page .pitch-ready-note{font-size:12px}.pitch-test-page .pitch-console[data-pitch-state=testing] .pitch-live{padding:18px 16px}.pitch-test-page .pitch-live-heading strong{font-size:54px}.pitch-test-page .pitch-live-heading small{font-size:12px}.pitch-test-page .pitch-live-cents strong{font-size:30px}.pitch-test-page .pitch-test-trail{height:84px}.pitch-test-page .pitch-results{margin-top:16px;padding:16px}.pitch-test-page .result-heading{display:block}.pitch-test-page .result-verdict{margin-top:10px;text-align:left}.pitch-test-page .result-grid{grid-template-columns:repeat(2,1fr);gap:8px}.pitch-test-page .result-grid>div{padding:12px}.pitch-test-page .result-chart{padding:12px}.pitch-test-page .result-actions{flex-direction:column}.pitch-test-page .result-actions button{width:100%;min-width:0}.pitch-test-page .pitch-results canvas{max-width:100%;height:auto}}

@media(max-width:768px){
 /* Keep the final selector/action clear of the site's fixed mobile navigation. */
 body.tuner-body .tuner-page{padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))}
 body.tuner-body .note-button,body.tuner-body .start-button,body.tuner-body .reference-button{scroll-margin-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
 body.tuner-body .instrument-selector{scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
 body.tuner-body .note-button{flex:0 0 64px;min-width:64px;min-height:52px;scroll-snap-align:center}
 /* Fretted-string instruments need every standard string visible together. */
 body.tuner-body .instrument-selector.note-count-4{--string-count:4}
 body.tuner-body .instrument-selector.note-count-5{--string-count:5}
 body.tuner-body .instrument-selector.note-count-6{--string-count:6}
 body.tuner-body .instrument-selector.is-guitar,
 body.tuner-body .instrument-selector.is-bass,
 body.tuner-body .instrument-selector.is-ukulele,
 body.tuner-body .instrument-selector.is-violin{display:grid;grid-template-columns:repeat(var(--string-count),minmax(44px,1fr));gap:4px;overflow:visible}
 body.tuner-body .instrument-selector.is-guitar .note-button,
 body.tuner-body .instrument-selector.is-bass .note-button,
 body.tuner-body .instrument-selector.is-ukulele .note-button,
 body.tuner-body .instrument-selector.is-violin .note-button{width:100%;min-width:44px;min-height:48px;padding:6px 2px;flex:initial}
 body.tuner-body .instrument-selector.is-guitar .note-button b,
 body.tuner-body .instrument-selector.is-bass .note-button b,
 body.tuner-body .instrument-selector.is-ukulele .note-button b,
 body.tuner-body .instrument-selector.is-violin .note-button b{font-size:14px}
 body.tuner-body .instrument-selector.is-guitar .note-button small,
 body.tuner-body .instrument-selector.is-bass .note-button small,
 body.tuner-body .instrument-selector.is-ukulele .note-button small,
 body.tuner-body .instrument-selector.is-violin .note-button small{margin-top:2px;font-size:9px;white-space:nowrap}
 body.tuner-body .instrument-selector.is-guqin{display:flex;grid-template-columns:none;overflow-x:auto}
 body.tuner-body .instrument-selector.is-guqin .note-button{flex-basis:64px}
 body.tuner-body .instrument-selector.is-guzheng{display:block;overflow:visible;padding:0}
 body.tuner-body .instrument-selector.is-guzheng .guzheng-current{min-height:72px;margin:0 0 10px;padding:11px 15px;display:flex;align-items:center;justify-content:space-between;border:1px solid color-mix(in srgb,var(--instrument-accent) 25%,#e1dde8);border-radius:12px;background:var(--instrument-accent-soft);color:var(--instrument-accent)}
 body.tuner-body .guzheng-current-caption{font-size:13px;font-weight:750}
 body.tuner-body .guzheng-current-note{font-size:30px;line-height:1;letter-spacing:-.04em}
 body.tuner-body .instrument-selector.is-guzheng .guzheng-string-scroller{display:grid;grid-auto-flow:column;grid-auto-columns:60px;gap:8px;overflow-x:auto;padding:2px 1px 8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
 body.tuner-body .instrument-selector.is-guzheng .note-button{min-width:60px;min-height:58px;scroll-snap-align:center}
 body.tuner-body .instrument-selector.is-piano .octave-nav button{width:44px;height:44px;border-radius:10px}
 body.tuner-body .instrument-selector.is-piano .piano-keys{width:100%;max-width:100%;overflow:hidden}
 body.tuner-body .input-meter{min-width:0}
body.tuner-body .pitch-trail canvas{max-width:100%}
 body.tuner-body .site-footer .footer-title-toggle{display:none}
}

/* Piano range controls: clear hierarchy on desktop, compact on mobile. */
.instrument-selector.is-piano .piano-range{display:flex;justify-content:center;gap:6px;margin:0 0 9px}
.instrument-selector.is-piano .piano-range button{min-height:34px;padding:0 13px;border:1px solid #ded9e5;border-radius:8px;background:#fff;color:#6b6677;font-size:11px;font-weight:700;cursor:pointer}
.instrument-selector.is-piano .piano-range button.is-active{border-color:var(--instrument-accent);background:var(--instrument-accent-soft);color:var(--instrument-accent)}
.instrument-selector.is-piano.is-full .octave-nav{display:none}
.instrument-selector.is-piano .octave-nav button{width:44px;height:44px;border-radius:10px}
.instrument-selector.is-piano .octave-nav strong{text-align:center}
.instrument-selector.is-piano .piano-keys:has(.note-button:nth-child(n+20)){overflow-x:auto;overflow-y:hidden}
.instrument-selector.is-piano .piano-keys:has(.note-button:nth-child(n+20)) .note-button{flex:0 0 48px}
.instrument-selector.is-piano .piano-keys:has(.note-button:nth-child(n+20)) .note-button.is-black{flex-basis:32px}
@media(max-width:560px){.instrument-selector.is-piano .piano-range button{min-height:40px;padding:0 10px}.instrument-selector.is-piano .piano-range{margin-bottom:7px}}
@media(max-width:768px){.instrument-selector.is-piano .piano-range button:last-child{display:none}}

/* Readable piano keyboard: fixed key geometry with horizontal touch scrolling. */
.instrument-selector.is-piano .piano-keys{--white-key-width:48px;display:block;position:relative;overflow-x:auto;overflow-y:hidden;white-space:nowrap;touch-action:pan-y;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.instrument-selector.is-piano .piano-keys .note-button{position:relative;display:inline-flex;vertical-align:top;flex:none;width:var(--white-key-width);min-width:var(--white-key-width);max-width:none}
.instrument-selector.is-piano .piano-keys .note-button.is-white{z-index:1}
.instrument-selector.is-piano .piano-keys .note-button.is-black{position:absolute;width:32px;min-width:32px;max-width:32px;margin:0;z-index:3}
.instrument-selector.is-piano.is-full .piano-keys{width:100%;padding-right:8px}
@media(max-width:560px){.instrument-selector.is-piano .piano-keys{--white-key-width:44px;height:112px}.instrument-selector.is-piano .piano-keys .note-button{width:44px;min-width:44px;height:110px;padding-top:73px}.instrument-selector.is-piano .piano-keys .note-button.is-black{width:29px;min-width:29px;max-width:29px;height:69px;padding-top:42px}}

@media(max-width:560px){
 body.tuner-body .tuner-page{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
 body.tuner-body .note-selector-wrap{padding:12px 14px}
 body.tuner-body .selector-heading{margin-bottom:8px}
 body.tuner-body .primary-actions{padding-bottom:calc(15px + env(safe-area-inset-bottom,0px))}
 /* Idle is intentionally brief: reserve the full live instrumentation for listening. */
body.tuner-body:not(.tuning-active) .tuner-title{margin-bottom:10px}
body.tuner-body:not(.tuning-active) .title-local{margin-top:6px}
/* Idle is a launch surface, not an empty realtime dashboard. Keep the first action compact. */
body.tuner-body:not(.tuning-active) .console-topbar{display:none}
body.tuner-body:not(.tuning-active) .tuner-display{padding:12px 14px 10px}
body.tuner-body:not(.tuning-active) .tuner-display .readout,
body.tuner-body:not(.tuning-active) .tuner-display .pitch-meter,
body.tuner-body:not(.tuning-active) .tuner-display .cents-readout,
body.tuner-body:not(.tuning-active) .tuner-display .pitch-trail,
body.tuner-body:not(.tuning-active) .tuner-display .telemetry{display:none}
body.tuner-body:not(.tuning-active) .tuner-display .pitch-state{display:none}
body.tuner-body:not(.tuning-active) .tuner-display .status-line{min-height:24px;margin:0;text-align:center;font-size:12px}
body.tuner-body:not(.tuning-active) .tuner-display .status-lamp{width:8px;height:8px}
body.tuner-body:not(.tuning-active) .console-topbar{min-height:44px;padding:6px 14px}
body.tuner-body:not(.tuning-active) .tuner-display{padding:11px 14px 10px}
body.tuner-body:not(.tuning-active) .tuner-display .readout{min-height:45px}
body.tuner-body:not(.tuning-active) .tuner-display:not(.has-reading) .detected-note strong{font-size:30px}
body.tuner-body:not(.tuning-active) .tuner-display .frequency-primary{display:none}
body.tuner-body:not(.tuning-active) .tuner-display .status-line{min-height:20px;margin-top:0;font-size:12px}
body.tuner-body:not(.tuning-active) .tuner-display .readout{display:none}
body.tuner-body:not(.tuning-active) .primary-actions{border-top:1px solid #eeecf2}
body.tuner-body:not(.tuning-active) .segmented button{white-space:nowrap;font-size:13px}
 body.tuner-body:not(.tuning-active) .primary-actions{padding:12px 14px;flex-direction:row}
 body.tuner-body:not(.tuning-active) .start-button,
 body.tuner-body:not(.tuning-active) .reference-button{width:auto;min-width:0;min-height:48px;padding-inline:10px;flex:1;font-size:12px;white-space:nowrap}
 body.tuner-body .site-footer .footer-grid{gap:0;padding-top:24px;padding-bottom:24px}
 body.tuner-body .site-footer .footer-col{padding:0;border-top:1px solid rgba(255,255,255,.09)}
 body.tuner-body .site-footer .footer-title{margin:0}
 body.tuner-body .site-footer .footer-title-toggle{width:100%;min-height:48px;padding:0;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent;color:#fff;font:inherit;font-size:13px;font-weight:700;text-align:left;cursor:pointer}
 body.tuner-body .site-footer .footer-title-toggle::after{content:'+';color:#91a0b1;font-size:19px;font-weight:400}
 body.tuner-body .site-footer .footer-col.is-open .footer-title-toggle::after{content:'−'}
 body.tuner-body .site-footer .footer-links{display:none;grid-template-columns:1fr;padding:0 0 12px}
 body.tuner-body .site-footer .footer-col.is-open .footer-links{display:grid}
}

@media(max-width:768px){
 /* Listening is intentionally a compact, single-task view. */
 body.tuner-body.tuning-active{padding-top:44px!important;padding-bottom:env(safe-area-inset-bottom,0px)!important}
 body.tuning-active #mobileNav{display:none!important}
 body.tuning-active .top-navbar,.tuning-active .navbar-container{height:44px!important;min-height:44px!important}
 body.tuning-active .top-navbar .logo-img{width:17px!important;height:17px!important}
 body.tuning-active .top-navbar .logo-text{margin-left:7px!important;font-size:16px!important}
 body.tuning-active .top-navbar .mobile-menu-toggle{transform:translateY(-50%) scale(.8)}
 body.tuning-active .tuner-page{min-height:calc(100dvh - 44px);padding:7px 10px 10px!important}
 body.tuning-active .tuner-breadcrumb,body.tuning-active .tuner-title,body.tuning-active .control-panel,body.tuning-active .privacy-strip,body.tuning-active .tuning-disclaimer,body.tuning-active .tuner-content,body.tuning-active .site-footer{display:none!important}
 body.tuning-active .tuner-console{border-radius:14px;box-shadow:none}
 body.tuning-active .console-topbar{min-height:40px;padding:6px 12px}
 body.tuning-active .local-badge{font-size:9px}
 body.tuning-active .input-meter{width:min(220px,68%);gap:6px}
 body.tuning-active .input-meter strong{font-size:9px}
 body.tuning-active .tuner-display{padding:10px 14px 8px}
 body.tuning-active .pitch-state{margin-bottom:0;font-size:10px}
 body.tuning-active .pitch-state strong{font-size:11px}
 body.tuning-active .readout{min-height:78px}
 body.tuning-active .detected-note strong{font-size:58px}
 body.tuning-active .tuner-display:not(.has-reading) .detected-note strong{font-size:39px}
 body.tuning-active .detected-note small,body.tuning-active .detected-note span{margin-top:4px;font-size:19px}
 body.tuning-active .frequency-primary{margin-top:5px;font-size:13px}
 body.tuning-active .pitch-meter{margin-top:5px}
 body.tuning-active .meter-labels{padding-bottom:7px}
 body.tuning-active .cents-readout strong{font-size:21px}
 body.tuning-active .status-line{min-height:22px;margin-top:0;font-size:13px}
 body.tuning-active .pitch-trail{height:46px;margin-top:7px}
 body.tuning-active .pitch-trail canvas{height:34px}
 body.tuning-active .telemetry{margin-top:7px;font-size:10px}
 body.tuning-active .note-selector-wrap{padding:10px 12px}
 body.tuning-active .selector-heading{margin-bottom:7px}
 body.tuning-active .primary-actions{padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));flex-direction:row;gap:8px}
 body.tuning-active .start-button,body.tuning-active .reference-button{width:auto;min-width:0;min-height:48px;flex:1;padding:0 9px;font-size:12px;white-space:nowrap}
 body.tuning-active .start-button{box-shadow:none}
}

@media(max-width:390px){
 body.tuning-active .telemetry{gap:8px}
 body.tuning-active .telemetry b{margin-left:2px}
 body.tuning-active .start-button,body.tuning-active .reference-button{gap:5px;padding-inline:7px}
}

@media(max-height:540px) and (orientation:landscape){
 body.tuner-body.tuning-active{padding-top:40px!important;padding-bottom:0!important}
 body.tuning-active .top-navbar{position:fixed;left:0;right:0;top:0;height:40px!important;min-height:40px!important}
 body.tuning-active .navbar-container{height:40px!important;min-height:40px!important;padding-inline:12px}
 body.tuning-active .navbar-menu,body.tuning-active .navbar-auth{display:none!important}
 body.tuning-active .top-navbar .logo-img{width:16px!important;height:16px!important}
 body.tuning-active .top-navbar .logo-text{margin-left:6px!important;font-size:15px!important}
 body.tuning-active .tuner-page{min-height:calc(100dvh - 40px);padding:0 8px 0!important}
 /* Landscape is often wider than 768px: explicitly switch off document-mode content. */
 body.tuning-active .tuner-breadcrumb,
 body.tuning-active .tuner-title,
 body.tuning-active .control-panel,
 body.tuning-active .privacy-strip,
 body.tuning-active .tuning-disclaimer,
 body.tuning-active .tuner-content,
 body.tuning-active .site-footer,
 body.tuning-active #mobileNav{display:none!important}
 body.tuning-active .tuner-shell{width:100%;max-width:960px}
 body.tuning-active .tuner-console{border-radius:12px}
 body.tuning-active .console-topbar{display:none}
 /* Keep the complete listening loop, including Stop, inside a short landscape viewport. */
 body.tuning-active .tuner-display{padding:2px 16px 3px}
 body.tuning-active .pitch-state{display:none}
 body.tuning-active .readout{min-height:45px;flex-direction:row;gap:12px}
 body.tuning-active .detected-note strong{font-size:42px}
 body.tuning-active .frequency-primary{margin:0;font-size:14px}
 body.tuning-active .meter-labels{padding-bottom:3px;font-size:9px}
 body.tuning-active .meter{height:21px}
 body.tuning-active .needle{height:25px}
 body.tuning-active .cents-readout strong{font-size:19px}
 body.tuning-active .status-line{min-height:18px;font-size:12px}
 body.tuning-active .pitch-trail{display:block;height:36px;margin-top:0}
 body.tuning-active .pitch-trail canvas{height:32px}
 body.tuning-active .pitch-trail span{display:none}
 body.tuning-active .telemetry{display:none}
 body.tuning-active .note-selector-wrap{padding:5px 16px}
 body.tuning-active .selector-heading{display:none}
 body.tuning-active .primary-actions{padding:5px 16px}
}
/* Piano keyboard interaction and empty-area guard */
.instrument-selector.is-piano .piano-keys{background:#fff;cursor:grab;user-select:none}
.instrument-selector.is-piano .piano-keys.is-dragging{cursor:grabbing}
/* The edge octaves contain fewer white keys (A0-B0 and C7-C8).
   Let those visible keys fill the available width so the keyboard never
   leaves an artificial blank tail, while full view keeps fixed geometry. */
.instrument-selector.is-piano .piano-keys.is-octave-view{
  display:flex;
  width:100%;
  overflow:hidden;
  white-space:normal;
}
.instrument-selector.is-piano .piano-keys.is-octave-view .note-button.is-white{
  flex:1 1 0;
  width:auto;
  min-width:0;
}
.instrument-selector.is-piano .piano-keys.is-octave-view .note-button.is-black{
  position:absolute;
}

/* Pitch Test: compact, scannable A4 advanced setting */
.pitch-test-page .pitch-advanced{
  min-width:0;
  padding:10px 12px;
  border:1px solid var(--music-line);
  border-radius:10px;
  background:#faf9fc;
}
.pitch-test-page .pitch-advanced summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0;
  color:var(--music-muted);
  font-size:12px;
  font-weight:700;
  line-height:1.3;
  cursor:pointer;
}
.pitch-test-page .pitch-advanced summary::marker{color:var(--instrument-accent,var(--music-purple))}
.pitch-test-page .pitch-advanced summary b{
  color:var(--music-ink);
  font-size:13px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.pitch-test-page .pitch-advanced-help{
  display:block;
  margin:8px 0 10px;
  color:var(--music-muted);
  font-size:11px;
  line-height:1.45;
}
.pitch-test-page .pitch-advanced .stepper{
  width:max-content;
  max-width:100%;
  height:44px;
}
.pitch-test-page .pitch-advanced .stepper button{
  width:44px;
  min-width:44px;
  height:44px;
  border-radius:7px;
  font-size:18px;
}
.pitch-test-page .pitch-advanced input{
  width:64px;
  height:44px;
  margin:0 4px;
  border-radius:7px;
  background:#fff;
  color:var(--music-ink);
  font-variant-numeric:tabular-nums;
}
@media(max-width:768px){
  .pitch-test-page .pitch-advanced{padding:10px 12px}
  .pitch-test-page .pitch-advanced-help{font-size:11px}
}

/* ==========================================================================
   顶层调音方式（麦克风 / 用耳朵）—— 2026-09 新增
   耳朵模式让麦克风不可用时依然能完成调音，样式沿用调音器紫色主题。
   ========================================================================== */
.tune-mode-row{margin-bottom:14px}
/* 顶层模式开关独占一行，不受 .control-group 的 50% 宽度限制 */
.tune-mode-row .control-group{width:100%;max-width:420px}
.segmented--tune{height:auto;min-height:44px}
.segmented--tune button{flex:1 1 0;min-width:0;padding:10px 14px;font-size:13.5px;font-weight:700;white-space:nowrap}
.segmented--tune button.is-active{background:#5943ad;color:#fff;box-shadow:0 2px 8px rgba(89,67,173,.28)}

.ear-panel{margin:0 0 16px;padding:16px 18px;border:1px solid #e4e3ea;border-radius:12px;background:#fbfaff}
.ear-hint{margin:0 0 10px;color:#4a4458;font-size:13.5px;line-height:1.7}
.ear-status{margin:0;min-height:20px;color:#5943ad;font-size:13.5px;font-weight:700}
.ear-status:empty{display:none}
.ear-mark{margin:12px 0 0;padding:9px 16px;border:1px solid #cfc3f2;border-radius:8px;background:#fff;color:#5943ad;font-size:13px;font-weight:700;cursor:pointer}
.ear-mark:hover{background:#f5f1ff}
.ear-tip{margin:12px 0 0;color:#8b8598;font-size:12px}

/* 耳朵模式下正在循环播放的弦钮 */
.note-button.is-ear-playing{border-color:#5943ad !important;background:#efe9ff !important;color:#5943ad !important;box-shadow:0 0 0 3px rgba(89,67,173,.16)}
.note-button.is-ear-playing::after{content:'';position:absolute;inset:auto auto 4px 50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:#5943ad;animation:earPulse 1s ease-in-out infinite}
@keyframes earPulse{0%,100%{opacity:.35}50%{opacity:1}}

/* 耳朵模式：麦克风读数整块收起（没有麦克风输入，表针/音分/轨迹都无意义） */
.tuner-display.is-ear-mode .pitch-state,
.tuner-display.is-ear-mode .readout,
.tuner-display.is-ear-mode .pitch-meter,
.tuner-display.is-ear-mode .cents-readout,
.tuner-display.is-ear-mode .pitch-trail,
.tuner-display.is-ear-mode .telemetry{display:none}
.tuner-display.is-ear-mode{padding:18px 24px}
/* 耳朵模式下状态行由引导条承担，避免同一句话出现三次 */
.tuner-display.is-ear-mode .status-line{display:none}


/* ==========================================================================
   乐器插画 + 动态引导条 —— 2026-09 新增
   插画让"我在调哪件乐器"一目了然；引导条把"现在该做什么"实时显示出来。
   ========================================================================== */
.tuner-art{display:flex;justify-content:center;margin:2px 0 16px}
.tuner-art picture{display:contents}
.tuner-art img{max-width:168px;max-height:168px;width:auto;height:auto;object-fit:contain;display:block}
/* 横向乐器（古筝/古琴/钢琴）给宽一点 */
.tuner-art img[width="512"]{max-width:260px;max-height:150px}

.tuner-guide{
  display:flex;align-items:center;gap:9px;
  margin:0 0 14px;padding:11px 15px;
  border:1px solid #e4e3ea;border-radius:11px;background:#fbfaff;
  color:#4a4458;font-size:13.5px;font-weight:600;line-height:1.5;
}
.tuner-guide-dot{
  flex:none;width:8px;height:8px;border-radius:50%;background:#b9b3c7;
  transition:background .2s ease;
}
/* 状态色：等待/聆听/偏低/偏高/已调准 */
.tuner-guide[data-state="idle"] .tuner-guide-dot{background:#b9b3c7}
.tuner-guide[data-state="listening"] .tuner-guide-dot{background:#5943ad;animation:guidePulse 1.2s ease-in-out infinite}
.tuner-guide[data-state="playing"] .tuner-guide-dot{background:#5943ad;animation:guidePulse 1.2s ease-in-out infinite}
.tuner-guide[data-state="flat"] .tuner-guide-dot{background:#d98324}
.tuner-guide[data-state="sharp"] .tuner-guide-dot{background:#d98324}
.tuner-guide[data-state="tuned"] .tuner-guide-dot{background:#1f9d63}
.tuner-guide[data-state="tuned"]{border-color:#c9ead9;background:#f3fbf7;color:#1a7a4e}
@keyframes guidePulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}

@media (max-width:560px){
  .tuner-art img{max-width:96px;max-height:96px}
  .tuner-art img[width="512"]{max-width:150px;max-height:88px}
  .tuner-guide{padding:10px 13px;font-size:12.5px}
}


/* 耳朵面板：没有播放内容时收起，避免空框 */
.ear-panel:has(.ear-status:empty){padding:12px 16px}
.ear-panel .ear-tip{margin-top:8px}


/* ==========================================================================
   乐器工具指南页 —— 2026-09 新增
   ========================================================================== */
.guide-title { margin-bottom: 20px; }
.guide-content { max-width: 860px; }
.guide-content section { margin-bottom: 26px; }
.guide-content h2 { margin: 0 0 12px; }
.guide-content p { margin: 0 0 12px; line-height: 1.85; }
.guide-content b { color: #2f2a3d; }

/* 调弦对照表：行=调弦方案，列=弦序（高音→低音） */
.guide-table-wrap {
  margin: 4px 0 18px;
  overflow-x: auto;
  border: 1px solid #e4e3ea;
  border-radius: 12px;
  background: #fff;
  -webkit-overflow-scrolling: touch;
}
.guide-table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  font-size: 13.5px;
}
.guide-table th,
.guide-table td {
  padding: 9px 12px;
  text-align: center;
  white-space: nowrap;
  border-bottom: 1px solid #f0eef4;
}
.guide-table thead th {
  background: #faf9fd;
  color: #777382;
  font-size: 12px;
  font-weight: 800;
  border-bottom: 1px solid #e4e3ea;
}
/* 第一列是调弦名，左对齐并稍宽 */
.guide-table tbody th {
  text-align: left;
  color: #2f2a3d;
  font-weight: 700;
  background: #fcfcfe;
}
.guide-table tbody tr:hover th,
.guide-table tbody tr:hover td { background: #f7f5ff; }
.guide-table td { color: #5943ad; font-weight: 600; font-variant-numeric: tabular-nums; }
.guide-table td.is-empty { background: #fafafa; }
.guide-table tbody tr:last-child th,
.guide-table tbody tr:last-child td { border-bottom: 0; }

/* 指南页的关联区块（复用 related-tuners 样式，但允许更长标题） */
.guide-content .related-tuners { margin-top: 28px; }
.guide-content .related-tuners h2 { font-size: 15px; }

@media (max-width: 560px) {
  .guide-content { font-size: 14px; }
  .guide-table { font-size: 12.5px; }
  .guide-table th, .guide-table td { padding: 8px 9px; }
}


/* ==========================================================================
   指南索引 /guides.php —— 2026-09 新增
   ========================================================================== */
.guide-index {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px;
  margin: 0 0 30px;
}
.guide-index-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px;
  border: 1px solid #e4e3ea;
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.guide-index-card:hover,
.guide-index-card:focus-visible {
  border-color: #cfc3f2;
  box-shadow: 0 8px 22px rgba(89,67,173,.12);
  transform: translateY(-1px);
}
.guide-index-title {
  font-size: 15px;
  font-weight: 700;
  color: #2f2a3d;
  line-height: 1.45;
}
.guide-index-desc {
  font-size: 12.5px;
  line-height: 1.7;
  color: #777382;
  flex: 1;
}
.guide-index-more {
  font-size: 12.5px;
  font-weight: 700;
  color: #5943ad;
  margin-top: 2px;
}
@media (max-width: 560px) {
  .guide-index { grid-template-columns: 1fr; gap: 11px; }
  .guide-index-card { padding: 15px; }
}


/* ==========================================================================
   和弦图 /guitar-chords.php —— 2026-09 新增
   ========================================================================== */
.chord-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 14px;
  margin: 6px 0 22px;
}
.chord-card {
  margin: 0;
  padding: 10px 6px 8px;
  border: 1px solid #e4e3ea;
  border-radius: 11px;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.chord-svg { width: 100%; max-width: 108px; height: auto; display: block; }
/* 指法图内部元素 */
.chord-svg line { stroke: #b9b3c7; }
.chord-svg line[stroke-width="3"] { stroke: #4a4458; }
.chord-svg .chord-dot { fill: #5943ad; }
.chord-svg .chord-open { fill: none; stroke: #5943ad; stroke-width: 1.6; }
.chord-svg .chord-mark { fill: #9a94a8; font-size: 11px; text-anchor: middle; font-weight: 700; }
.chord-svg .chord-fin { fill: #fff; font-size: 8px; text-anchor: middle; font-weight: 700; }
.chord-svg .chord-fretnum { fill: #777382; font-size: 10px; text-anchor: middle; font-weight: 700; }
.chord-card figcaption {
  font-size: 13.5px;
  font-weight: 800;
  color: #2f2a3d;
  letter-spacing: .01em;
}
.chord-print-hint { color: #8b8598; font-size: 12.5px; }

.song-list { margin: 0 0 18px; padding-left: 20px; }
.song-list li { margin: 0 0 8px; line-height: 1.7; color: #4a4458; }
.song-list b { color: #2f2a3d; }
.guide-content h3 { margin: 18px 0 10px; font-size: 15px; color: #2f2a3d; }

@media (max-width: 560px) {
  .chord-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; }
  .chord-card { padding: 8px 4px 6px; }
}

/* 打印：把和弦图当谱架参考 */
@media print {
  .top-navbar, .site-footer, #mobileNav, .music-tool-switcher, .guide-content .related-tuners { display: none !important; }
  .chord-grid { grid-template-columns: repeat(4, 1fr); }
  .chord-card { break-inside: avoid; }
}