*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#1b1b1b;--surface:#2a2a2a;--accent:#ff3c78;--accent-muted:#3a3a3a;--text:#f0ece2;--text-dim:#908a7e;--radius:10px;--pink:#ff3c78;--yellow:#ffd23f;--turquoise:#2dd4bf;--orange:#ff6b35}html,body{overscroll-behavior:none;height:100%}body{background:var(--bg);color:var(--text);touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;justify-content:center;align-items:flex-start;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex}#app{flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:400px;padding:1.5rem;display:flex}header{text-align:center}h1{letter-spacing:-.02em;font-size:1.8rem;font-weight:700}.back-link{color:var(--text-dim);letter-spacing:.04em;font-size:.8rem;text-decoration:none}.back-link:hover{color:var(--accent)}.slider-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;font-size:.85rem}input[type=range]{appearance:none;background:var(--surface);border-radius:4px;outline:none;width:100%;height:8px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);cursor:pointer;border:none;border-radius:50%;width:28px;height:28px}input[type=range]::-moz-range-thumb{background:var(--accent);cursor:pointer;border:none;border-radius:50%;width:28px;height:28px}.badness-header{justify-content:space-between;align-items:baseline;width:100%;display:flex}.badness-descriptor{color:var(--accent);font-size:.9rem;font-weight:600}select{appearance:none;background:var(--surface);color:var(--text);border:2px solid var(--accent-muted);border-radius:var(--radius);cursor:pointer;touch-action:manipulation;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;padding:.5rem 2rem .5rem .75rem;font-family:inherit;font-size:.95rem}select:focus{border-color:var(--accent);outline:none}.controls{gap:1rem;width:100%;padding-top:.5rem;display:flex}.btn-start,.btn-tap{border-radius:var(--radius);cursor:pointer;touch-action:manipulation;border:none;flex:1;height:56px;font-size:1.1rem;font-weight:600}.btn-start{background:var(--yellow);color:var(--bg)}.btn-start.playing{background:var(--pink);color:var(--text)}.btn-start:active{filter:brightness(.85)}.btn-tap{background:var(--surface);color:var(--text);border:2px solid var(--accent-muted)}.btn-tap:active{background:var(--accent-muted)}.sound-picker,.tonic-picker,.tuning-picker,.jawari-header{justify-content:space-between;align-items:center;width:100%;display:flex}.jawari-value{color:var(--accent);font-size:.9rem;font-weight:600}