:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{color:#e9e9ed;background:#161826;min-height:100vh;margin:0;font-family:Segoe UI,system-ui,Roboto,sans-serif}#root{min-height:100vh}html,body,#root{height:100%}.app{box-sizing:border-box;flex-direction:column;gap:10px;height:100dvh;padding:14px 20px;display:flex;overflow:hidden}.app-header{flex-shrink:0}.app-header h1{margin:0 0 4px;font-size:18px;font-weight:700}.phase-tag{color:#9a9dc4;margin-left:10px;font-size:11px;font-weight:600}.controls{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.controls button{color:#e9e9ed;cursor:pointer;background:#262a52;border:1px solid #4b4f96;border-radius:4px;padding:7px 14px;font-weight:600}.controls button:hover{background:#2e3260}.controls label{color:#9a9dc4;align-items:center;gap:8px;font-size:13px;display:flex}.controls select,.controls input[type=range]{accent-color:#9184d9}.controls select{color:#e9e9ed;background:#20244a;border:1px solid #363b6e;border-radius:3px;padding:6px}.status-dot{background:#33355c;border-radius:50%;width:14px;height:14px;display:inline-block}.status-dot.signal{background:#6dff9c}.status-dot.clip{background:#ff4d3d}.error{color:#f5573c;margin:4px 0 0;font-size:13px}.tuner-layout{flex-direction:row;flex:1;gap:16px;min-height:0;display:flex}.note-rail{flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:8px;width:170px;display:flex}.note-wheel-canvas{cursor:pointer;width:150px;height:150px}.fundamental-frequency{color:#9a9dc4;font-size:13px;font-weight:600}.auto-detect-button{color:#e9e9ed;letter-spacing:.5px;cursor:pointer;background:#262a52;border:1px solid #4b4f96;border-radius:4px;width:100%;padding:8px 10px;font-size:12px;font-weight:700}.auto-detect-button:hover{background:#2e3260}.auto-detect-button.active{color:#f1eefc;background:#3a3470;border-color:#9184d9}.tuner-content{flex-direction:column;flex:1;gap:16px;min-width:0;min-height:0;display:flex}.band-stack{border:1px solid #363b6e;border-radius:4px;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.harmonic-band-canvas{flex:1;width:100%;min-height:0;display:block}.spectrum-row{flex-shrink:0;height:140px}.spectrum-canvas{cursor:default;touch-action:none;width:100%;height:140px;display:block}.settings-overlay{z-index:10;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.settings-panel{background:#1b1e38;border:1px solid #363b6e;border-radius:6px;flex-direction:column;gap:14px;width:280px;padding:20px;display:flex}.settings-panel h2{letter-spacing:1px;color:#9a9dc4;margin:0;font-size:14px;font-weight:700}.settings-field{color:#9a9dc4;flex-direction:column;gap:6px;font-size:13px;display:flex}.settings-field input[type=range]{accent-color:#9184d9}.settings-value{color:#e9e9ed;font-weight:600}.settings-close{color:#e9e9ed;cursor:pointer;background:#262a52;border:1px solid #4b4f96;border-radius:4px;padding:8px 14px;font-weight:600}.settings-close:hover{background:#2e3260}