.guitar-fretboard--ukulele{--nut-width:5rem;--cap-width:2.75rem;--cap-height:1rem;--cap-offset-y:-0.85rem;--cap-inset-right:0.6rem;--fretboard-bg:#4a3728;--fret-color:#a0a0a0;--vg-string-scale:0.8}@media (min-width:768px){.guitar-fretboard--ukulele{--nut-width:5.75rem;--cap-width:3rem;--vg-string-scale:0.9}}.guitar-fretboard--ukulele .guitar-nut-texture{background-color:#c8a96e;background-image:url(/ukulele/nut-texture.webp);background-size:cover;background-position:0}.guitar-fretboard--ukulele .guitar-headstock{box-shadow:inset -8px 0 24px rgba(80,50,20,.28)}.guitar-fretboard--ukulele .guitar-headstock:after,.guitar-fretboard--ukulele .guitar-headstock:before{width:var(--cap-width);height:var(--cap-height);right:var(--cap-inset-right)}.guitar-fretboard--ukulele .guitar-fretboard-surface{background-color:var(--fretboard-bg);background-image:url(/ukulele/fretboard-texture.webp),linear-gradient(180deg,#5a4030 0,var(--fretboard-bg) 45%,#38291c 100%);background-size:cover;background-position:50%}.guitar-fretboard--ukulele .guitar-strings-layer{justify-content:center;gap:.9rem}@media (min-width:768px){.guitar-fretboard--ukulele .guitar-strings-layer{gap:1.1rem}}.guitar-fretboard--ukulele .guitar-string-row{flex:0 0 auto;min-height:1.25rem}.guitar-fretboard--ukulele .guitar-string{border-radius:1px}.guitar-fretboard--ukulele .guitar-string,.guitar-fretboard--ukulele .guitar-strings-layer>.guitar-string-row:first-child .guitar-string,.guitar-fretboard--ukulele .guitar-strings-layer>.guitar-string-row:nth-child(4) .guitar-string{height:calc(1.75px * var(--vg-string-scale))}.guitar-fretboard--ukulele .guitar-strings-layer>.guitar-string-row:nth-child(2) .guitar-string{height:calc(3px * var(--vg-string-scale))}.guitar-fretboard--ukulele .guitar-strings-layer>.guitar-string-row:nth-child(3) .guitar-string{height:calc(3.75px * var(--vg-string-scale))}.guitar-fretboard--ukulele .guitar-fret-dot{width:.5rem;height:.5rem}.guitar-fretboard--ukulele .guitar-nut-note{color:#3d2b10}.guitar-fretboard--ukulele .guitar-nut-note--active{color:#fff;text-shadow:0 0 8px rgba(34,197,94,.85)}.guitar-fretboard--ukulele .guitar-nut-note--playing{color:#15803d;text-shadow:none}.guitar-fretboard--bass{--nut-width:7.75rem;--fretboard-bg:#383838;--fret-color:#7a7a7a;--fret-shadow:#3a3a3a;--vg-string-scale:1}@media (min-width:768px){.guitar-fretboard--bass{--nut-width:8.5rem;--vg-string-scale:1.1}}.guitar-fretboard--bass .guitar-nut-texture{background-color:#8f6340;background-image:url(/bass/nut-texture.webp);background-size:cover;background-position:0}.guitar-fretboard--bass .guitar-headstock{box-shadow:inset -10px 0 30px rgba(40,28,12,.35)}.guitar-fretboard--bass .guitar-headstock:after,.guitar-fretboard--bass .guitar-headstock:before{display:none}.guitar-fretboard--bass .guitar-fretboard-surface{background-color:var(--fretboard-bg);background-image:url(/bass/fretboard-texture.webp),linear-gradient(180deg,#444 0,var(--fretboard-bg) 42%,#2e2e2e 100%);background-size:cover;background-position:50%}.guitar-fretboard--bass .guitar-strings-layer{justify-content:center;gap:1.1rem}@media (min-width:768px){.guitar-fretboard--bass .guitar-strings-layer{gap:1.35rem}}.guitar-fretboard--bass .guitar-string-row{flex:0 0 auto;min-height:1.5rem}.guitar-fretboard--bass .guitar-string{height:calc(5px * var(--vg-string-scale));border-radius:2px}.guitar-fretboard--bass .guitar-strings-layer>.guitar-string-row:nth-child(2) .guitar-string{height:calc(5.75px * var(--vg-string-scale))}.guitar-fretboard--bass .guitar-strings-layer>.guitar-string-row:nth-child(3) .guitar-string{height:calc(6.75px * var(--vg-string-scale))}.guitar-fretboard--bass .guitar-strings-layer>.guitar-string-row:nth-child(4) .guitar-string{height:calc(8px * var(--vg-string-scale))}.guitar-fretboard{--nut-width:6.75rem;--cap-width:3.75rem;--cap-height:1.25rem;--cap-offset-y:-1rem;--cap-inset-right:0.75rem;--neck-bg:#2e2e2e;--fretboard-bg:#404040;--fret-color:#8f8f8f;--fret-shadow:#454545;--dot-color:#4a90e2;--frame-inset-y:0.55rem;--frame-inset-right:0.4rem;--vg-string-scale:0.9}@media (min-width:768px){.guitar-fretboard{--nut-width:7.5rem;--cap-width:4rem;--cap-height:1.35rem;--cap-offset-y:-1.1rem;--cap-inset-right:0.85rem;--frame-inset-y:0.65rem;--frame-inset-right:0.45rem;--vg-string-scale:1.05}}.guitar-neck-frame{background:var(--neck-bg);border-radius:4px;box-shadow:0 4px 20px rgba(0,0,0,.12);overflow:hidden}.guitar-fretboard-inner{display:flex;min-height:12.5rem}@media (min-width:768px){.guitar-fretboard-inner{min-height:14.875rem}}.guitar-headstock{position:relative;width:var(--nut-width);flex-shrink:0;overflow:hidden;box-shadow:inset -10px 0 30px rgba(92,58,12,.3);z-index:2}.guitar-nut-texture{position:absolute;inset:0;background-color:#c4a06a;background-image:url(/guitar/nut-texture.webp),url(/guitar/nut-texture.svg),repeating-linear-gradient(92deg,transparent,transparent 3px,rgba(80,50,20,.07) 0,rgba(80,50,20,.07) 4px),linear-gradient(180deg,#a67c52,#d4a574 18%,#e8c9a0 42%,#c9a06b 68%,#9a7048);background-size:cover;background-position:0}.guitar-nut-edge{position:absolute;top:0;right:0;width:3px;height:100%;background:linear-gradient(180deg,#f5f0e6,#e8dfd0,#f5f0e6);box-shadow:1px 0 2px rgba(0,0,0,.35);z-index:2}.guitar-headstock:after,.guitar-headstock:before{content:"";position:absolute;width:var(--cap-width);height:var(--cap-height);border-radius:50%;background-color:#fff;right:var(--cap-inset-right);left:auto;z-index:3;pointer-events:none}.guitar-headstock:before{top:var(--cap-offset-y)}.guitar-headstock:after{bottom:var(--cap-offset-y)}.guitar-neck{flex:1;min-width:0;display:flex;padding:var(--frame-inset-y) var(--frame-inset-right) var(--frame-inset-y) 0;background:transparent}.guitar-fretboard-inset{position:relative;flex:1;background:var(--fretboard-bg);box-shadow:inset 0 2px 8px rgba(0,0,0,.12);border-radius:2px;overflow:hidden}.guitar-fretboard-surface{position:absolute;inset:0;background-color:var(--fretboard-bg);background-image:url(/guitar/fretboard-texture.webp),url(/guitar/fretboard-texture.svg),linear-gradient(180deg,#484848 0,var(--fretboard-bg) 45%,#383838 100%);background-size:cover;background-position:50%;pointer-events:none}.guitar-fret{width:2px;background:linear-gradient(180deg,#b8b8b8,var(--fret-color) 30%,var(--fret-color) 70%,#6a6a6a);opacity:.65}.guitar-fret,.guitar-fret-shadow{position:absolute;top:0;bottom:0;transform:translateX(-50%);z-index:1}.guitar-fret-shadow{width:1px;background:var(--fret-shadow)}.guitar-fret-dot{position:absolute;width:.6875rem;height:.6875rem;border-radius:50%;background:var(--dot-color);opacity:.92;top:50%;transform:translate(-50%,-50%);z-index:3;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 1px 4px rgba(0,0,0,.45)}.guitar-string{display:block;width:100%;border:none;border-radius:1px;height:calc(3px * var(--vg-string-scale));box-shadow:0 1px 0 rgba(255,255,255,.35),0 .12em .28em rgba(0,0,0,.22);background-image:repeating-linear-gradient(50deg,rgba(0,0,0,.55),transparent .12em,transparent .18em),linear-gradient(180deg,rgba(0,0,0,.15) 8%,hsla(0,0%,100%,.3) 14%,hsla(0,0%,100%,.85) 28%,hsla(0,0%,100%,.28) 46%,rgba(0,0,0,.55) 92%);transition:box-shadow .15s ease,filter .15s ease}.guitar-strings-layer>.guitar-string-row:nth-child(2) .guitar-string{height:calc(3.5px * var(--vg-string-scale))}.guitar-strings-layer>.guitar-string-row:nth-child(3) .guitar-string{height:calc(4px * var(--vg-string-scale))}.guitar-strings-layer>.guitar-string-row:nth-child(4) .guitar-string{height:calc(4.5px * var(--vg-string-scale))}.guitar-strings-layer>.guitar-string-row:nth-child(5) .guitar-string{height:calc(5px * var(--vg-string-scale))}.guitar-strings-layer>.guitar-string-row:nth-child(6) .guitar-string{height:calc(6px * var(--vg-string-scale))}.guitar-string--active.guitar-string--state-untuned{box-shadow:0 0 0 1px rgba(156,163,175,.5),0 0 10px rgba(156,163,175,.45),0 1px 0 rgba(255,255,255,.35),0 .12em .28em rgba(0,0,0,.22)}.guitar-string--active.guitar-string--state-close{box-shadow:0 0 0 1px rgba(245,158,11,.55),0 0 12px rgba(245,158,11,.5),0 1px 0 rgba(255,255,255,.35),0 .12em .28em rgba(0,0,0,.22)}.guitar-string--active.guitar-string--state-in-tune{box-shadow:0 0 0 1px rgba(34,197,94,.55),0 0 12px rgba(34,197,94,.5),0 1px 0 rgba(255,255,255,.35),0 .12em .28em rgba(0,0,0,.22)}.guitar-string-row{position:relative;display:flex;align-items:center;flex:1;min-height:1.375rem}.guitar-string-track:hover .guitar-string{filter:brightness(1.08)}.guitar-string-track:focus-visible{outline:2px solid rgba(34,197,94,.6);outline-offset:1px;border-radius:2px}.guitar-nut-cell{position:absolute;left:0;top:50%;transform:translateY(-50%);width:var(--nut-width);display:flex;align-items:center;justify-content:flex-end;gap:.3rem;padding-right:.4rem;z-index:6;pointer-events:none}.guitar-nut-play{pointer-events:auto;display:flex;align-items:center;justify-content:center;width:1.625rem;height:1.625rem;min-width:1.625rem;border:none;border-radius:9999px;background:rgba(255,255,255,.92);color:#4b5563;box-shadow:0 1px 3px rgba(0,0,0,.18);cursor:pointer;transition:background-color .15s ease,color .15s ease,transform .15s ease}.guitar-nut-play:hover{background:#fff;color:#111827;transform:scale(1.06)}.guitar-nut-play:focus-visible{outline:2px solid rgba(34,197,94,.65);outline-offset:1px}.guitar-nut-play--playing,.guitar-nut-play--playing:active,.guitar-nut-play--playing:hover{background:#22c55e;color:#fff;animation:guitar-nut-pulse .9s ease-in-out infinite}.guitar-nut-play--playing:hover{transform:scale(1.06)}.guitar-nut-note{font-size:.875rem;font-weight:700;line-height:1;min-width:1rem;text-align:center;text-shadow:0 1px 2px rgba(255,255,255,.55);color:#3d2b1f;pointer-events:none}@media (min-width:768px){.guitar-nut-note{font-size:.9375rem}.guitar-nut-play{width:1.75rem;height:1.75rem;min-width:1.75rem}}.guitar-nut-note--active{color:#fff;text-shadow:0 0 8px rgba(34,197,94,.85)}.guitar-nut-note--playing{color:#15803d;text-shadow:none}.guitar-string-track--playing .guitar-string{filter:brightness(1.12)}@keyframes guitar-nut-pulse{0%,to{box-shadow:0 0 0 0 rgba(34,197,94,.45)}50%{box-shadow:0 0 0 4px rgba(34,197,94,.15)}}.guitar-strings-layer{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:calc(var(--frame-inset-y) + .35rem) calc(var(--frame-inset-right) + .35rem) calc(var(--frame-inset-y) + .35rem) 0;z-index:4;pointer-events:none}.guitar-nut-play,.guitar-string-row,.guitar-string-track{pointer-events:auto}.guitar-string-track{flex:1;display:flex;align-items:center;margin-left:var(--nut-width);padding-right:1.25rem;border:none;background:transparent;cursor:pointer}.guitar-in-tune-mark{position:absolute;right:calc(var(--frame-inset-right) + .35rem);top:50%;transform:translateY(-50%);font-size:.6875rem;font-weight:700;color:#22c55e;line-height:1;z-index:5;pointer-events:none}