:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #181818;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-divider-dark-1: rgba(84, 84, 84, .65);--vt-c-divider-dark-2: rgba(84, 84, 84, .48);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66);--vt-c-text-dark-1: var(--vt-c-white);--vt-c-text-dark-2: rgba(235, 235, 235, .64)}:root{--color-selected: #4CAF50;--color-alert-light: #ffb800;--color-background: var(--vt-c-white);--color-background-soft: var(--vt-c-white-soft);--color-background-mute: var(--vt-c-white-mute);--color-border: var(--vt-c-divider-light-2);--color-border-hover: var(--vt-c-divider-light-1);--color-heading: var(--vt-c-text-light-1);--color-text: var(--vt-c-text-light-1);--section-gap: 160px}@media (prefers-color-scheme: dark){:root{--color-background: var(--vt-c-black);--color-background-soft: var(--vt-c-black-soft);--color-background-mute: var(--vt-c-black-mute);--color-border: var(--vt-c-divider-dark-2);--color-border-hover: var(--vt-c-divider-dark-1);--color-heading: var(--vt-c-text-dark-1);--color-text: var(--vt-c-text-dark-2)}}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);transition:color .5s,background-color .5s;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Arial,sans-serif;text-align:center;background:#1e1e1e;color:#fff;margin:0;padding:0}#app{display:flex;margin:0 auto;padding:0 rem;font-weight:400}a,.green{text-decoration:none;color:#00bd7e;transition:.4s;padding:3px}@media (hover: hover){a:hover{background-color:#00bd7e33}}@media (min-width: 1024px){body{display:flex}#app{display:flex;padding:0 2rem;flex-direction:column;max-width:1200px}}header[data-v-3f0cb838]{line-height:1.5;max-height:100vh}.logo[data-v-3f0cb838]{display:block;margin:0 auto 2rem}nav[data-v-3f0cb838]{width:100%;font-size:12px;text-align:center}nav a.router-link-exact-active[data-v-3f0cb838]{color:var(--color-text)}nav a.router-link-exact-active[data-v-3f0cb838]:hover{background-color:transparent}nav a[data-v-3f0cb838]{display:inline-block;padding:0 1rem;border-left:1px solid var(--color-border)}nav a[data-v-3f0cb838]:first-of-type{border:0}.strobe-scale[data-v-df048522]{width:100%;height:30px;position:relative;overflow:hidden;border:1px solid #444;border-radius:5px;background:#2e2e2e}.strobe[data-v-df048522]{width:200%;height:100%;background:repeating-linear-gradient(90deg,#ff0000,#ff0000 var(--block-size),#ffc6c6 var(--block-size),#ffc6c6 calc(var(--block-size) * 2));position:absolute;top:0;left:0;animation:strobe-df048522 1s linear infinite}.strobe-tuned[data-v-df048522]{background:repeating-linear-gradient(90deg,#00941b,#00941b var(--block-size),#fff var(--block-size),#fff calc(var(--block-size) * 2))}@keyframes strobe-df048522{0%{transform:translate(0)}to{transform:translate(-50%)}}.modal-overlay[data-v-e42e2e68]{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content[data-v-e42e2e68]{background:#2e2e2e;padding:20px;border-radius:10px;width:300px;text-align:center}.note-buttons[data-v-e42e2e68]{display:flex;flex-direction:column;gap:10px}.note-row[data-v-e42e2e68]{display:flex;justify-content:center;gap:10px}.note-button[data-v-e42e2e68]{padding:10px 20px;font-size:16px;background:transparent;color:#fff;border:none;border-radius:5px;cursor:pointer;border:1px solid white;transition:background .3s}.note-button.main[data-v-e42e2e68]{background:var(--color-selected);border:1px solid var(--color-selected)}.note-button[data-v-e42e2e68]:hover{background:#45a049}.octave-buttons[data-v-e42e2e68]{margin-top:20px;display:flex;justify-content:center;gap:10px}.octave-button[data-v-e42e2e68]{padding:10px 20px;font-size:16px;background:#555;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background .3s}.octave-button.active[data-v-e42e2e68]{background:#4caf50}.octave-button[data-v-e42e2e68]:hover{background:#666}body{font-family:Arial,sans-serif;text-align:center;background:#1e1e1e;color:#fff;margin:0;padding:10px}h1{margin-bottom:20px}h3{font-weight:700;font-size:18px}canvas{border:1px solid #444;width:100%;display:block;margin:20px auto;border-radius:5px;will-change:transform,opacity}.header{display:flex;justify-content:space-between;margin-bottom:10px}.notes-select{display:flex;gap:10px}.columns{display:flex;flex-wrap:wrap}.controls{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;margin-bottom:20px}button{padding:10px 20px;font-size:16px;cursor:pointer;background:#4caf50;color:#fff;border:none;border-radius:5px;transition:.3s}button.note-detected{border:1px solid #555;background:#55555543}button.power.on{border:1px solid #ff000062;background:#ff000043}button.power.off{border:1px solid var(--color-selected);background:var(--color-selected)}button:hover{background:#45a049}.tuners{display:flex;flex-direction:column;gap:10px;width:100%}.tuner-box{width:100%;border:1px solid #444;border-radius:5px;background:#2e2e2e}.tuner-box.selected{border-color:var(--color-selected)}.tuner-box .real-note-hz{font-size:12px}#note{padding:.25rem;font-size:20px}.strobe{height:20px;background:repeating-linear-gradient(90deg,#000,#000 10px,#fff 10px,#fff 20px);margin-top:10px;animation:strobe 1s linear infinite}.frequency-label,.cents-display{font-size:18px;margin:5px 0}.detected{font-size:24px;color:#4caf50;margin-top:10px}.ideal-value{font-size:18px;color:#ffb800}.sensitivity-slider{width:100%;margin:10px 0}.visualizer-wrap{position:relative;width:100%}.play-note-button{position:absolute;bottom:40px;right:20px;padding:8px 12px;background-color:#4caf50cc;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;z-index:10;transition:background-color .2s}.play-note-button:hover{background-color:#4caf50}@keyframes strobe{0%{transform:translate(0)}to{transform:translate(-20px)}}@media (min-width: 1024px){.tuners{flex-wrap:nowrap;flex-direction:row}.tuner-box{width:33.3%}}