:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#15171a;--paper:#24272c;--ink:#eceef0;--muted:#b2b5bc;--accent:#3ddc84;--warn:#c5c8cf;--line:#8a8f98;--radius:18px;color:var(--ink);background:var(--bg);font-family:ui-rounded,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{overscroll-behavior:none;touch-action:manipulation;width:100%;height:100%;margin:0;overflow:hidden}body{position:fixed;inset:0}main,main *{touch-action:manipulation}button,input,summary,a,select{-webkit-tap-highlight-color:transparent}header,#tuner,#settings,button,summary{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button,input,select{font:inherit}button,a,summary,input,select{touch-action:manipulation}button{cursor:pointer;border-radius:var(--radius);background:var(--accent);min-height:48px;color:var(--bg);border:0;padding:12px 18px;font-weight:650}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--warn);outline-offset:4px}button.secondary{background:var(--paper);color:var(--ink)}button:disabled{opacity:.6;cursor:default}main{max-width:640px;height:100dvh;min-height:360px;padding:max(12px, env(safe-area-inset-top)) 22px max(10px, env(safe-area-inset-bottom));flex-direction:column;gap:10px;margin:auto;display:flex}header{flex-shrink:0;justify-content:space-between;align-items:center;display:flex}h1{letter-spacing:-1.5px;margin:0;font-size:34px;font-weight:550}h1 span{color:var(--accent)}#header-version{right:max(16px, env(safe-area-inset-right));top:max(18px, calc(env(safe-area-inset-top) + 6px));z-index:6;color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none;font-size:14px;position:fixed}button.text-button{color:var(--muted);background:0 0;min-height:44px;padding:10px}h2{letter-spacing:-.6px;margin:7px 0 9px;font-size:25px;font-weight:450}p{line-height:1.5}#tuner{flex-direction:column;flex:1;min-height:0;display:flex}.intro{text-align:center;flex-shrink:0}#status{min-height:42px;color:var(--muted);margin:0;font-size:14px}#instrument{--label-height:58px;flex:1;min-height:180px;margin:8px 0 0;position:relative}#readings{text-align:center;grid-template-columns:repeat(6,minmax(0,1fr));display:grid;position:absolute;inset:0}.string{font-variant-numeric:tabular-nums;min-width:0;position:relative}.pitch-lane{inset:16px 0 var(--label-height);position:absolute}.rail{background:linear-gradient(90deg,#454a51,#9097a0,#454a51);border-radius:4px;width:3.5px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.string:nth-child(2) .rail{width:3px}.string:nth-child(3) .rail{width:2.5px}.string:nth-child(4) .rail{width:2px}.string:nth-child(5) .rail{width:1.5px}.string:nth-child(6) .rail{width:1px}.rail:before,.rail:after{content:"";background:var(--line);border-radius:50%;width:7px;height:7px;position:absolute;left:50%;transform:translate(-50%)}.rail:before{top:0}.rail:after{bottom:0}.target{background:var(--bg);border:1px solid #777f89;border-radius:50%;width:44px;height:44px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.landing-line{left:0;right:0;top:calc((100% - var(--label-height) + 16px) / 2);border-top:1px dashed #777f8977;position:absolute}.pitch-position{pointer-events:none;will-change:transform;position:absolute;inset:0}.bead{background:var(--ink);border:2px solid var(--ink);width:36px;height:44px;color:var(--bg);border-radius:18px;place-items:center;transition:opacity .22s,background-color .2s,border-color .2s;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 3px 12px #0004}.direction{font-size:26px;font-weight:550;line-height:1}.thumb{background:currentColor;width:24px;height:24px;display:none;-webkit-mask:url(/thumb-up.svg) 50%/contain no-repeat;mask:url(/thumb-up.svg) 50%/contain no-repeat}.string[data-state=quiet] .bead{opacity:0}.string[data-state=uncertain] .bead{background:var(--bg);border:2px dotted var(--muted);color:var(--muted);box-shadow:none;opacity:.65}.string[data-state=checking] .bead{background:var(--paper);border-color:var(--ink)}.string[data-state=tuned][data-settled=true] .bead{background:var(--accent);border-color:var(--accent);color:var(--bg)}.string[data-state=tuned][data-settled=true] .thumb{display:block}.string[data-state=tuned] .direction{display:none}.string[data-state=tuned][data-held=true] .bead{background:var(--bg);border-color:var(--accent);color:var(--accent);box-shadow:none}.string[data-state=tuned] .note{color:var(--accent)}.note-label{min-height:42px;position:absolute;bottom:0;left:0;right:0}.note{font-size:25px;display:block}.octave{color:var(--muted);margin-left:1px;font-size:12px}.reading,.reading-detail{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}#instrument.precision{--label-height:100px}.precision .reading,.precision .reading-detail{clip-path:none;white-space:normal;width:auto;height:auto;color:var(--muted);min-height:20px;font-size:13px;display:block;position:static;overflow:visible}.precision .string[data-state=tuned] .reading,.precision .string[data-state=tuned] .reading-detail{color:var(--accent)}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.dock{flex-shrink:0;grid-template-columns:repeat(3,1fr);align-items:center;gap:16px;min-height:76px;display:grid}.dock button{width:68px;height:60px;color:var(--muted);background:0 0;border:1px solid #0000;border-radius:22px;place-items:center;margin:auto;padding:14px;display:grid;position:relative}.dock button[data-current]{background:var(--paper);color:var(--ink)}.dock #listen{border-color:var(--line);width:76px;height:68px;color:var(--ink)}.dock #listen[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}.dock-icon{background:currentColor;width:28px;height:28px;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.ear-icon{width:34px;height:34px;-webkit-mask-image:url(/ear.svg);mask-image:url(/ear.svg)}.gear-icon{-webkit-mask-image:url(/settings.svg);mask-image:url(/settings.svg)}.info-icon{-webkit-mask-image:url(/info-circle.svg);mask-image:url(/info-circle.svg)}.stop-mark{background:currentColor;border-radius:2px;width:8px;height:8px;display:none;position:absolute;bottom:11px;right:11px}#listen[data-mode=listening] .stop-mark,#listen[data-mode=requesting] .stop-mark{display:block}#strum-cue{pointer-events:none;z-index:4;position:fixed;inset:0}.cue-hand{background:var(--ink);width:38px;height:44px;filter:drop-shadow(0 0 5px var(--bg));animation:5s ease-in-out infinite tap-then-strum;display:block;position:absolute;top:0;left:0;-webkit-mask:url(/hand-finger.svg) 50%/contain no-repeat;mask:url(/hand-finger.svg) 50%/contain no-repeat}.cue-guitar{left:calc(var(--centreX) - 80px);top:calc(var(--centreY) - 80px);background:var(--ink);opacity:.55;width:160px;height:160px;filter:drop-shadow(0 0 10px var(--bg));animation:5s ease-in-out infinite guitar-arrives;position:absolute;-webkit-mask:url(/guitar.svg) 50%/contain no-repeat;mask:url(/guitar.svg) 50%/contain no-repeat}.cue-tap{left:calc(var(--earX) - 18px);top:calc(var(--earY) - 24px);border:2px solid var(--ink);border-radius:50%;width:72px;height:72px;animation:5s ease-out infinite ear-tap;position:absolute}@keyframes tap-then-strum{0%,8%{transform:translate(var(--earX), var(--earY));opacity:0}14%,20%{transform:translate(var(--earX), var(--earY));opacity:.9}24%{transform:translate(var(--earX), calc(var(--earY) + 4px)) scale(.88);opacity:.9}30%{transform:translate(var(--earX), var(--earY));opacity:.9}52%,58%{transform:translate(var(--guitarX), var(--guitarY)) rotate(-20deg);opacity:.9}74%,82%{transform:translate(calc(var(--guitarX) + 25px), calc(var(--guitarY) + 28px)) rotate(15deg);opacity:.9}92%,to{transform:translate(calc(var(--guitarX) + 25px), calc(var(--guitarY) + 28px));opacity:0}}@keyframes guitar-arrives{0%,32%,94%,to{opacity:0}45%,84%{opacity:.55}}@keyframes ear-tap{0%,20%,42%,to{opacity:0;transform:scale(.9)}24%{opacity:.8;transform:scale(.9)}40%{opacity:0;transform:scale(1.3)}}#strum-cue[data-stage=strum] .cue-tap{display:none}#strum-cue[data-stage=strum] .cue-guitar{animation:none}#strum-cue[data-stage=strum] .cue-hand{animation:2s ease-in-out infinite guitar-strum}@keyframes guitar-strum{0%,15%,to{transform:translate(var(--guitarX), var(--guitarY)) rotate(-20deg);opacity:.25}35%{opacity:.9}70%{transform:translate(calc(var(--guitarX) + 25px), calc(var(--guitarY) + 28px)) rotate(15deg);opacity:.9}}details{margin-top:8px}summary{cursor:pointer;min-height:44px;color:var(--muted);align-content:center;font-size:14px}#settings{overscroll-behavior:none;flex:1;min-height:0;padding:20px 4px;overflow:auto}#settings h2{margin-bottom:8px}#settings-status{color:var(--muted);margin:0 0 28px;font-size:14px}#settings label{margin:16px 0 8px;font-size:14px;display:block}output{float:right;color:var(--accent)}input[type=range]{width:100%;min-height:44px;accent-color:var(--accent);touch-action:pan-y pinch-zoom;display:block}.range-labels{color:var(--muted);justify-content:space-between;font-size:13px;display:flex}select{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;height:44px;padding:8px;font-size:16px}#settings .tuning-row{justify-content:space-between;align-items:center;gap:16px;margin:16px 0 8px;display:flex}#settings .tuning-row label{margin:0}.tuning-row select{min-width:160px;max-width:70%}.room-options{border:0;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0;padding:0;display:grid}.room-options label{margin:0!important;position:relative!important}.room-options input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.room-options span{border:1px solid var(--line);min-height:64px;color:var(--muted);border-radius:14px;place-items:center;padding:12px;font-size:16px;display:grid}.room-options input:checked+span{background:var(--ink);color:var(--bg);border-color:var(--ink)}.room-options input:focus-visible+span{outline:3px solid var(--warn);outline-offset:4px}#settings .precision-row{justify-content:space-between;align-items:center;gap:8px;min-height:44px;margin:20px 0 0;display:flex}.precision-row input{width:24px;height:24px;accent-color:var(--accent);margin:10px}#input-signal{color:var(--muted);margin:26px 0;font-size:14px}#input-db{font-variant-numeric:tabular-nums}#input-level{width:100%;height:16px;accent-color:var(--muted);margin:12px 0 6px;display:block}.signal-scale{justify-content:space-between;font-size:12px;display:flex}#input-level{appearance:none;background:var(--paper);border:0;border-radius:8px}#input-level::-webkit-meter-bar{background:var(--paper);border:0;border-radius:8px}#input-level::-webkit-meter-optimum-value{background:var(--muted)}#input-level::-webkit-meter-suboptimum-value{background:var(--muted)}#input-level::-webkit-meter-even-less-good-value{background:var(--muted)}#input-level::-moz-meter-bar{background:var(--muted)}#install-coach{justify-content:space-between;gap:8px;margin-top:4px;display:flex}#install-shortcut{color:var(--accent)}details p{color:var(--muted);margin:4px 0;font-size:13px}.actions{gap:9px;display:flex}.actions button{flex:1}#about{overscroll-behavior:contain;min-height:0;color:var(--muted);flex:1;padding:20px 0;overflow:auto}#about h2,#about strong{color:var(--ink)}a{color:var(--accent);align-content:center;min-height:44px;display:inline-block}.mark{font-family:ui-monospace,monospace;font-size:14px}.mark a{justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}#update-notice{z-index:5;left:50%;top:max(76px, calc(env(safe-area-inset-top) + 64px));border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);grid-template-columns:1fr auto;align-items:center;gap:8px 12px;width:calc(100% - 32px);max-width:580px;padding:16px;display:grid;position:fixed;transform:translate(-50%);box-shadow:0 8px 40px #0008}#update-notice p{grid-column:1/-1;margin:0}#update-notice .update-detail{color:var(--muted);font-size:13px}#version{font-variant-numeric:tabular-nums;font-size:14px}#update-status,#install-hint{font-size:14px}@media (max-height:740px){h2{font-size:21px}h1{font-size:28px}.intro #status{min-height:32px}#settings-status{margin-bottom:16px}}@media (max-height:550px) and (orientation:landscape){main{max-width:1000px;padding-left:max(22px, env(safe-area-inset-left));padding-right:max(22px, env(safe-area-inset-right));gap:4px}.intro h2{margin:0 0 4px;font-size:18px}.intro #status{min-height:24px}#instrument{min-height:120px}.note{font-size:21px}.dock{min-height:58px}.dock button{height:48px}.dock #listen{width:68px;height:54px}.ear-icon{width:28px;height:28px}#settings{padding-top:8px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto}.bead{transition:none}.cue-hand,#strum-cue[data-stage=strum] .cue-hand{transform:translate(var(--earX), var(--earY));opacity:.8;animation:none}.cue-guitar,.cue-tap{animation:none}.cue-tap{opacity:.6}.cue-guitar{opacity:0}#strum-cue[data-stage=strum] .cue-guitar{opacity:.55}#strum-cue[data-stage=strum] .cue-hand{transform:translate(var(--guitarX), var(--guitarY)) rotate(-20deg)}}