:root{--radius:6px;--seg-off:#E5E5E5;--seg-on:#0D0D0D;--seg-green:#2e8b57;--seg-green-off:#c8e6d4;--tuned:#2e8b57;--db-on:#0D0D0D;--db-red:#d44;--font-logo:'DM Serif Display',serif}[data-theme=dark]{--seg-off:rgba(255,255,255,0.12);--seg-on:#ECECEC;--seg-green:#5cb882;--seg-green-off:rgba(92,184,130,0.2);--tuned:#5cb882;--db-on:#ECECEC;--db-red:#e55}.tuner-page{padding:12px 0 16px}.tuner-page-desc{font-family:system-ui,sans-serif;font-weight:400;font-size:14px;color:var(--sub);line-height:1.7;margin-bottom:28px}.tuner-section{display:flex;flex-direction:column;gap:20px}.divider{width:100%;height:1px;background:var(--line)}.pitch-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.pitch-info{display:flex;align-items:baseline;gap:8px}.pitch-label-text{font-family:system-ui,sans-serif;font-weight:500;font-size:14px;color:var(--text)}.pitch-display{font-family:system-ui,sans-serif;font-weight:500;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.snap-btns{display:flex;gap:6px}.snap-btn{font-family:system-ui,sans-serif;font-weight:500;font-size:13px;padding:4px 12px;border:1px solid var(--line);border-radius:var(--radius);background:0 0;color:var(--mute);cursor:pointer;transition:background var(--transition),color var(--transition),border-color var(--transition);min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:center}.snap-btn.active{background:var(--text);color:var(--bg);border-color:var(--text)}.meter-row{display:flex;gap:8px;align-items:stretch}.meter-left{flex:1;display:flex;flex-direction:column;align-items:center}.meter-right{width:40px;display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0}.arc-wrap{width:100%;max-width:320px}.arc-svg{width:100%;height:auto;display:block}.arc-note{text-align:center;margin-top:-32px;position:relative;z-index:1}.arc-note-name{font-family:var(--font-logo);font-weight:400;font-size:52px;color:var(--text);line-height:1.1;transition:color .2s;-webkit-text-stroke:0.8px currentColor}.arc-note-name.tuned{color:var(--tuned)}.arc-note-cent{font-family:system-ui,sans-serif;font-weight:400;font-size:15px;color:var(--mute);font-variant-numeric:tabular-nums;min-height:22px;transition:color .2s}.arc-note-cent.tuned{color:var(--tuned)}.direction-area{height:40px;display:flex;align-items:center;justify-content:center;font-family:system-ui,sans-serif;font-weight:500;font-size:14px;color:var(--mute);margin-top:4px}.direction-check{width:40px;height:40px;border-radius:50%;background:var(--tuned);display:flex;align-items:center;justify-content:center;box-shadow:0 0 12px rgba(46,139,87,.4);animation:.25s ease-out pop}@keyframes pop{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}.direction-check svg{width:22px;height:22px}.vdb-label{font-family:system-ui,sans-serif;font-weight:400;font-size:9px;color:var(--mute)}.vdb-container{flex:1;display:flex;gap:3px;position:relative;min-height:120px;touch-action:none;cursor:ns-resize;user-select:none;-webkit-user-select:none;padding-left:0;padding-right:0}.vdb-scale{display:flex;flex-direction:column;justify-content:space-between;font-family:system-ui,sans-serif;font-weight:400;font-size:7px;color:var(--mute);font-variant-numeric:tabular-nums;text-align:right;padding:0 2px}.vdb-bar-bg{width:3px;position:relative;background:var(--seg-off);border-radius:2px;overflow:hidden}.vdb-bar-fill{position:absolute;bottom:0;left:0;right:0;background:var(--db-on);border-radius:2px;transition:height 60ms ease-out}.vdb-bar-red{position:absolute;top:0;left:0;right:0;height:10%;background:var(--db-red);opacity:0;transition:opacity .1s}.vdb-bar-red.clip{opacity:1}.vdb-thresh{position:absolute;right:-4px;width:19px;height:3px;background:var(--accent);border-radius:1px;transform:translateY(-50%);pointer-events:none}.vdb-value{font-family:system-ui,sans-serif;font-weight:400;font-size:9px;color:var(--mute);font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap}.mic-section{text-align:center}.start-btn{display:inline-block;padding:12px 28px;font-family:system-ui,sans-serif;font-weight:500;font-size:14px;letter-spacing:.04em;color:var(--bg);background:var(--text);border:none;border-radius:var(--radius);cursor:pointer;transition:opacity var(--transition),background var(--transition),color var(--transition);min-height:44px}.start-btn:hover{opacity:.7}.start-btn.active{background:var(--db-red);color:#fff}.start-btn.active:hover{opacity:.8}.mic-error{font-family:system-ui,sans-serif;font-weight:400;font-size:13px;color:var(--db-red);margin-top:8px;min-height:0}.privacy-note{font-family:system-ui,sans-serif;font-weight:400;font-size:11px;color:var(--text);text-align:center;margin-top:12px;line-height:1.6}.tuner-pitch,.tuner-top-pitch{padding:24px 0 0;margin-bottom:4px}.pitch-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.pitch-value{font-family:system-ui,sans-serif;font-weight:500;font-size:14px;color:var(--text)}.tuner-controls{display:flex;gap:12px;margin-bottom:24px;flex-wrap:wrap}.tuner-select-group{flex:1;min-width:140px}.tuner-select-label{display:block;font-family:system-ui,sans-serif;font-weight:500;font-size:12px;color:var(--mute);margin-bottom:6px}.tuner-select{width:100%;padding:12px 36px 12px 16px;font-family:system-ui,sans-serif;font-weight:400;font-size:15px;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;outline:0;transition:border-color var(--transition);-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239A9A9A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}[data-theme=dark] .tuner-select{background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23707070' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--seg-off:rgba(255,255,255,0.12);--seg-on:#ECECEC;--seg-green:#5cb882;--seg-green-off:rgba(92,184,130,0.2);--tuned:#5cb882;--db-on:#ECECEC;--db-red:#e55}:root:not([data-theme=light]) .tuner-select{background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23707070' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}}.tuner-select:focus{border-color:var(--accent)}.string-buttons{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}.string-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:56px;min-height:56px;padding:6px 10px;background:0 0;border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;transition:background var(--transition),border-color var(--transition),color var(--transition);color:var(--text);gap:2px}.string-btn:hover{border-color:var(--mute)}.string-btn.active{background:var(--text);color:var(--bg);border-color:var(--text)}.string-btn-num{font-family:system-ui,sans-serif;font-weight:400;font-size:10px;opacity:.5;line-height:1}.string-btn-note{font-family:var(--font-logo);font-weight:400;font-size:20px;line-height:1.2;-webkit-text-stroke:0.4px currentColor}.method-toggle{display:flex;gap:0;margin-bottom:28px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.method-btn{flex:1;padding:12px 16px;font-family:system-ui,sans-serif;font-weight:500;font-size:14px;letter-spacing:.04em;color:var(--mute);background:0 0;border:none;cursor:pointer;transition:background var(--transition),color var(--transition);text-align:center;min-height:44px}.method-btn:first-child{border-right:1px solid var(--line)}.method-btn.active{background:var(--text);color:var(--bg)}.meter-area{padding:24px 0;text-align:center}.meter-note-display{font-family:var(--font-logo);font-weight:400;font-size:48px;color:var(--text);margin-bottom:4px;min-height:58px;line-height:1.2;-webkit-text-stroke:0.8px currentColor}.meter-freq-display{font-family:system-ui,sans-serif;font-weight:400;font-size:13px;color:var(--mute);margin-bottom:20px;min-height:20px}.meter-v-wrapper{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 auto 16px}.meter-v-labels{display:flex;flex-direction:column;justify-content:space-between;height:200px;text-align:right}.meter-v-label{font-family:system-ui,sans-serif;font-weight:400;font-size:12px;color:var(--mute)}.meter-v-container{position:relative;width:32px;height:200px}.meter-v-track{position:absolute;top:0;bottom:0;left:50%;width:4px;background:var(--line);border-radius:2px;transform:translateX(-50%)}.meter-v-center{position:absolute;top:50%;left:0;right:0;height:2px;background:var(--mute);transform:translateY(-50%)}.meter-v-indicator{position:absolute;top:50%;left:50%;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid var(--accent);transform:translate(-50%,-50%);transition:top .1s ease-out}.meter-v-indicator.in-tune{border-left-color:var(--tuned)}.meter-check{display:flex;align-items:center;justify-content:center;margin:16px auto 0;width:32px;height:32px;opacity:0;transition:opacity .2s}.meter-check.visible{opacity:1}.meter-check svg{width:28px;height:28px}.meter-status{font-family:system-ui,sans-serif;font-weight:500;font-size:16px;color:var(--mute);margin-top:12px;min-height:24px}.meter-status.in-tune{color:var(--tuned)}.level-meter-section{margin-top:20px}.level-meter-label{font-family:system-ui,sans-serif;font-weight:400;font-size:12px;color:var(--mute);margin-bottom:6px}.level-bar{position:relative;width:100%;max-width:300px;height:8px;background:var(--line);border-radius:4px;margin:0 auto;overflow:hidden}.level-bar-fill{height:100%;width:0;background:var(--mute);border-radius:4px;transition:width 50ms ease-out;opacity:.4}.level-bar-fill.active{background:var(--accent);opacity:1}.sensitivity-section{margin-top:16px}.sensitivity-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.sensitivity-label-text,.sensitivity-value{font-family:system-ui,sans-serif;font-weight:400;font-size:12px;color:var(--mute)}.sensitivity-slider{-webkit-appearance:none;appearance:none;width:100%;max-width:300px;height:3px;background:var(--line);outline:0;border-radius:2px;cursor:pointer}.sensitivity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer;border:none}.sensitivity-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer;border:none}.ear-visual{display:flex;align-items:center;justify-content:center;gap:4px;height:48px;margin-bottom:16px}.ear-visual-bar{width:3px;height:8px;background:var(--accent);border-radius:2px;transition:height .1s}.ear-visual.playing .ear-visual-bar{animation:.6s ease-in-out infinite alternate ear-wave}@keyframes ear-wave{from{height:8px}to{height:36px}}.ear-visual.playing .ear-visual-bar:first-child{animation-delay:0s}.ear-visual.playing .ear-visual-bar:nth-child(2){animation-delay:.1s}.ear-visual.playing .ear-visual-bar:nth-child(3){animation-delay:.2s}.ear-visual.playing .ear-visual-bar:nth-child(4){animation-delay:.3s}.ear-visual.playing .ear-visual-bar:nth-child(5){animation-delay:.2s}.ear-visual.playing .ear-visual-bar:nth-child(6){animation-delay:.1s}.ear-visual.playing .ear-visual-bar:nth-child(7){animation-delay:0s}.ear-instruction{font-family:system-ui,sans-serif;font-weight:400;font-size:13px;color:var(--mute);text-align:center}.mic-prompt{text-align:center;padding:32px 0}.mic-prompt-text{font-family:system-ui,sans-serif;font-weight:400;font-size:14px;color:var(--mute);margin-bottom:16px;line-height:1.7}.mic-start-btn{display:inline-block;padding:12px 32px;font-family:system-ui,sans-serif;font-weight:500;font-size:14px;letter-spacing:.04em;color:var(--bg);background:var(--text);border:none;border-radius:var(--radius);cursor:pointer;transition:opacity var(--transition);min-height:44px}.mic-start-btn:hover{opacity:.7}.string-edit-row{display:flex;gap:8px;align-items:center;justify-content:center;margin-bottom:24px;flex-wrap:wrap}.string-edit-select{padding:8px 28px 8px 12px;font-family:system-ui,sans-serif;font-weight:400;font-size:14px;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;outline:0;transition:border-color var(--transition);-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='8' height='5' viewBox='0 0 8 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l3 3 3-3' stroke='%239A9A9A' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.string-edit-select:focus{border-color:var(--accent)}.string-edit-label{font-family:system-ui,sans-serif;font-weight:400;font-size:13px;color:var(--mute)}.chromatic-detected{text-align:center;padding:16px 0 8px}.chromatic-detected-label{font-family:system-ui,sans-serif;font-weight:400;font-size:13px;color:var(--mute)}@media (max-width:640px){.tuner-select-group{min-width:0}.string-btn{min-width:48px;min-height:48px}.string-btn-note{font-size:17px}.meter-note-display{font-size:40px}.meter-v-container,.meter-v-labels{height:160px}.arc-note-name{font-size:42px}.arc-note{margin-top:-24px}}