@font-face{font-family:Big Shoulders Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/big-shoulders-vietnamese-wght-normal-Cu-DDijC.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Big Shoulders Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/big-shoulders-latin-ext-wght-normal-C7duU6kR.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Big Shoulders Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/big-shoulders-latin-wght-normal-D2Rs5vCJ.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Instrument Sans Variable;font-style:normal;font-display:swap;font-weight:400 700;src:url(/assets/instrument-sans-latin-ext-wght-normal-B5bTHO_g.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Instrument Sans Variable;font-style:normal;font-display:swap;font-weight:400 700;src:url(/assets/instrument-sans-latin-wght-normal-BbzFLZTg.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--ground:#111010;--surface:#1f1c1a;--line:#3a352f;--text:#f3eee4;--soft:#cfc8bb;--muted:#a8a196;--accent:#ff9a2e;--accent-text:#1e1006;--wood:#2b1d15;--nut:#efe7d6;--string:#d8d4cb;--string-wound:#b8a586;--font-body:"Instrument Sans Variable", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display:"Big Shoulders Variable", "Arial Narrow", "Roboto Condensed", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--font-body)}*{box-sizing:border-box}body{background:var(--ground);color:var(--text);-webkit-tap-highlight-color:transparent;margin:0}h1{margin:8px 0 16px;font-size:1.5rem}h2{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px;font-size:13px;font-weight:600}button{min-height:44px;color:var(--text);background:var(--surface);border:1px solid var(--line);font:inherit;cursor:pointer;border-radius:14px;padding:10px 14px;font-weight:600}button:disabled{opacity:.4;cursor:default}button.primary{color:var(--accent-text);background:var(--accent);border-color:var(--accent);font-weight:700}button.display{font-family:var(--font-display);letter-spacing:.02em;text-transform:uppercase;font-size:32px;font-weight:800}button.link{min-height:52px;color:var(--accent);text-align:left;background:0 0;border:none;border-radius:0;padding:0}:focus-visible{outline:2px solid var(--text);outline-offset:2px}.hint{color:var(--muted);font-size:14px;line-height:20px}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.neck{flex:none;width:100%}.fretboard{font-variant-numeric:tabular-nums;display:block}.fb-wood{fill:var(--wood)}.fb-out{fill:var(--ground);opacity:.62}.fb-band{fill:var(--accent);opacity:.13}.fb-inlay{fill:#eee6d6;opacity:.36}.fb-nut{fill:var(--nut)}.fb-string rect{fill:var(--string)}.fb-string.wound rect{fill:var(--string-wound)}.fb-string.active rect{fill:var(--accent);fill-opacity:.58}.fb-string.active rect.fb-fill{fill-opacity:1}.fb-fill{transform-box:fill-box;transform-origin:0}.fb-fill.from-right{transform-origin:100%}.fb-fill.drain{animation-name:drain;animation-timing-function:linear;animation-fill-mode:forwards}.paused .fb-fill.drain{animation-play-state:paused}@keyframes drain{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.fb-string text,.fb-fretnum{fill:var(--muted);font-size:12px;font-weight:500}.fb-string text.big,.fb-fretnum.big{font-size:15px}.fb-string.active text,.fb-fretnum.hot{fill:var(--accent);font-weight:700}.fb-dot circle{fill:var(--accent);stroke:#1b120c;stroke-width:2px}.fb-dot text{fill:var(--accent-text);font-size:14px;font-weight:700}.fb-dot.big text{font-size:18px}.quiz{flex-direction:column;max-width:900px;height:100dvh;margin:0 auto;display:flex;overflow:hidden}.quiz-top{padding:max(20px, env(safe-area-inset-top)) 16px 0;flex-direction:column;gap:10px;display:flex}.quiz-status{justify-content:space-between;align-items:baseline;gap:16px;min-height:30px;display:flex}.quiz-count{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:28px;font-weight:800;line-height:30px}.quiz-paused{color:var(--accent);font-size:15px;font-weight:600}.session-track{background:var(--line);border-radius:2px;height:4px;overflow:hidden}.session-fill{background:var(--text);height:100%}.prompt{text-align:center;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;min-height:0;display:flex}.prompt-string{color:var(--soft);font-size:30px;font-weight:500;line-height:36px}.prompt-note,.countdown{font-family:var(--font-display);padding-top:6px;font-size:max(96px,min(82vw,38dvh,120dvh - 540px));font-weight:800;line-height:.82}.paused .prompt-string,.paused .prompt-note,.paused .countdown{opacity:.35}.transport{padding:16px 16px max(20px, env(safe-area-inset-bottom));flex:none;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:10px;display:grid}.transport button{border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:6px;height:84px;padding:0;font-size:15px;display:flex}.transport button.primary{font-size:16px}.keys{text-align:center;flex:none;margin:0;padding-bottom:12px}@media (pointer:coarse){.keys{display:none}}@media (orientation:landscape) and (height<=500px){.quiz{grid-template:"note label transport"minmax(0,1fr)"note top transport"minmax(0,1fr)"neck neck neck"/auto minmax(0,1fr) auto;column-gap:24px;max-width:none;display:grid}.prompt{display:contents}.prompt-note,.countdown{padding:0 0 0 max(28px, env(safe-area-inset-left));grid-area:note;align-self:center;font-size:46dvh}.prompt-string{text-align:left;grid-area:label;align-self:end}.quiz-top{grid-area:top;align-self:start;padding:4px 0 0}.session-track,.keys{display:none}.quiz .neck{padding-inline:env(safe-area-inset-left) env(safe-area-inset-right);grid-area:neck}.transport{padding:0 max(28px, env(safe-area-inset-right)) 0 0;grid-area:transport;grid-template-columns:100px 180px;align-self:center}.summary .neck{display:none}.summary-actions{flex-direction:row}.summary-actions button{flex:1}}.setup{flex-direction:column;max-width:640px;min-height:100dvh;margin:0 auto;display:flex}html{scroll-padding-bottom:110px}.wordmark{padding:max(16px, env(safe-area-inset-top)) 16px 14px;font-family:var(--font-display);letter-spacing:.01em;text-transform:uppercase;margin:0;font-size:40px;font-weight:800;line-height:1}.wordmark span{color:var(--accent)}.setup-body{flex:1;padding:4px 16px 8px}.section{border-bottom:1px solid var(--line)}.section:last-child{border-bottom:0}.section summary{cursor:pointer;align-items:center;gap:12px;min-height:48px;list-style:none;display:flex}.section summary::-webkit-details-marker{display:none}.section-title{flex:none;font-size:16px;font-weight:600}.section-value{min-width:0;color:var(--muted);text-align:right;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:15px;overflow:hidden}.section summary svg{color:var(--muted);flex:none;transition:transform .12s}.section[open] summary svg{transform:rotate(180deg)}.section[open] .section-value{color:var(--accent)}.section-body{padding:4px 0 16px}.section-body .hint{margin:12px 0 0}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{min-height:46px;padding:0 16px;font-size:16px}.chip.on{color:var(--accent-text);background:var(--accent);border-color:var(--accent)}.chip.static{border-radius:14px;align-items:center;font-weight:600;display:inline-flex}.chip-grid{gap:6px;display:grid}.chip-grid .chip{min-height:50px;padding:0 4px;font-size:15px}.chip-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.chip-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.chip-grid.six{grid-template-columns:repeat(6,minmax(0,1fr))}.chip-grid.seven{grid-template-columns:repeat(7,minmax(0,1fr))}.chip-grid .chip.note{font-family:var(--font-display);font-size:26px;font-weight:800}.fret-range{color:var(--muted);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;font-size:15px;display:grid}.select{position:relative}.select select{width:100%;height:52px;color:var(--text);background:var(--surface);border:1px solid var(--line);font:inherit;appearance:none;cursor:pointer;border-radius:14px;padding:0 40px 0 16px;font-size:17px;font-weight:600}.select svg{color:var(--muted);pointer-events:none;position:absolute;top:18px;right:14px}.slider{flex-direction:column;gap:4px;margin-bottom:14px;display:flex}.slider:last-child{margin-bottom:0}.slider-label{justify-content:space-between;align-items:baseline;font-size:16px;font-weight:500;display:flex}.slider output{font-variant-numeric:tabular-nums;font-weight:700}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:32px;margin:0}input[type=range]:disabled{opacity:.4;cursor:default}input[type=range]::-webkit-slider-runnable-track{background:var(--line);border-radius:3px;height:6px}input[type=range]::-moz-range-track{background:var(--line);border-radius:3px;height:6px}input[type=range]::-moz-range-progress{background:var(--accent);border-radius:3px;height:6px}input[type=range]::-webkit-slider-thumb{background:var(--accent);appearance:none;border:0;border-radius:50%;width:28px;height:28px;margin-top:-11px}input[type=range]::-moz-range-thumb{background:var(--accent);border:0;border-radius:50%;width:28px;height:28px}.options{flex-direction:column;display:flex}.toggle{cursor:pointer;justify-content:space-between;align-items:center;gap:12px;min-height:52px;font-size:16px;font-weight:500;display:flex}.toggle input{background:var(--line);appearance:none;cursor:pointer;border-radius:16px;flex:none;width:52px;height:32px;margin:0;transition:background .12s;position:relative}.toggle input:after{content:"";background:var(--text);border-radius:50%;width:26px;height:26px;transition:left .12s;position:absolute;top:3px;left:3px}.toggle input:checked{background:var(--accent)}.toggle input:checked:after{background:var(--accent-text);left:23px}.start{padding:12px 16px max(16px, env(safe-area-inset-bottom));background:var(--ground);border-top:1px solid var(--line);text-align:center;flex-direction:column;gap:8px;display:flex;position:sticky;bottom:0}.start .hint{margin:0}@media (height<=740px){.wordmark{padding-top:max(12px, env(safe-area-inset-top));padding-bottom:10px}.setup-body{padding-top:0;padding-bottom:4px}.section summary{min-height:44px}.start{padding-top:10px;padding-bottom:max(12px, env(safe-area-inset-bottom))}.start .primary{height:60px}}@media (height<=655px){.setup .neck{display:none}}.start .primary{border-radius:20px;width:100%;height:68px}.summary{flex-direction:column;max-width:640px;min-height:100dvh;margin:0 auto;display:flex}.summary-result{padding:max(20px, env(safe-area-inset-top)) 16px 16px;flex-direction:column;flex:1;justify-content:center;display:flex}.summary h1{color:var(--soft);margin:0;font-size:30px;font-weight:500;line-height:36px}.summary-count{color:var(--accent);font-family:var(--font-display);font-variant-numeric:tabular-nums;margin:0;font-size:min(51vw,200px);font-weight:800;line-height:.9}.summary-detail{margin:8px 0 0;font-size:22px;font-weight:600;line-height:30px}.summary-actions{padding:20px 16px max(20px, env(safe-area-inset-bottom));flex-direction:column;gap:10px;display:flex}.summary-actions button{border-radius:20px;height:60px;font-size:17px}.summary-actions button.display{height:68px;font-size:32px}.record{max-width:900px;padding:max(16px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));margin:0 auto}.record section{margin-bottom:20px}.record .row h1{margin:0}.record .start .primary{height:auto;padding:16px;font-size:1.25rem}.record .controls{justify-content:center;gap:10px;display:flex}.clip{border-radius:10px;grid-template-columns:1.2em 1fr auto auto auto;align-items:center;gap:8px;padding:6px 8px;display:grid}.clip.recording{background:color-mix(in srgb, var(--accent) 18%, transparent)}.clip-status{color:var(--accent);font-weight:700}.clip-script{font-size:1.1rem}.clip button{padding:8px 10px}.error{color:#e5675a}