:root{--max-width:1100px;--border-radius:12px;--font-mono:ui-monospace,Menlo,Monaco,"Cascadia Mono","Segoe UI Mono","Roboto Mono","Oxygen Mono","Ubuntu Monospace","Source Code Pro","Fira Mono","Droid Sans Mono","Courier New",monospace;--foreground-rgb:0,0,0;--background-start-rgb:255,255,255;--background-end-rgb:255,255,255;--primary-glow:conic-gradient(from 180deg at 50% 50%,#16abff33 0deg,#0885ff33 55deg,#54d6ff33 120deg,#0071ff33 160deg,transparent 360deg);--secondary-glow:radial-gradient(#fff,hsla(0,0%,100%,0));--tile-start-rgb:239,245,249;--tile-end-rgb:228,232,233;--tile-border:conic-gradient(#00000080,#00000040,#00000030,#00000020,#00000010,#00000010,#00000080);--callout-rgb:238,240,241;--callout-border-rgb:172,175,176;--card-rgb:180,185,188;--card-border-rgb:131,134,135;--fretboard-height:120;--number-of-strings:6;--string-height:4;--half-string-height:calc(var(--string-height) /2);--string-top-position:calc(var(--fretboard-height) / var(--number-of-strings) / 2 - var(--half-string-height));--double-fretmark-position-1:calc(var(--fretboard-height) * 0.25);--double-fretmark-position-2:calc(var(--fretboard-height) * 0.75);@media (min-width:576px){--fretboard-height:150;--string-height:5}@media (min-width:768px){--fretboard-height:180;--string-height:6}@media (min-width:992px){--fretboard-height:240;--string-height:8}@media(min-width:1088px){--fretboard-height:300;--string-height:10}}*{box-sizing:border-box;padding:0;margin:0}body,html{max-width:100vw;overflow-x:hidden}body{color:rgb(var(--foreground-rgb));background:linear-gradient(to bottom,transparent,rgb(var(--background-end-rgb))) rgb(var(--background-start-rgb))}a{color:inherit;text-decoration:none}@media (prefers-color-scheme:dark){html{color-scheme:dark}}.btn{font-weight:700!important}#scale-display-switch{height:1.5rem!important;width:3rem;margin-right:.5rem;background-color:#bf00c2}.form-check.form-switch{align-items:end!important;cursor:pointer!important}.form-check-input,.form-check-label{font-weight:700!important;cursor:pointer!important}#fret-shape-panel{max-width:100%!important}.cursorPaywall{cursor:not-allowed!important}.fretboard{flex-direction:column;background:#fff;height:calc(var(--fretboard-height)*1px);box-shadow:30px 120px 30px -40px rgba(102,106,133,.25)}.fretboard,.string{display:flex;width:100%}.string{height:100%;position:relative}#high-e-string>.fret{background-image:linear-gradient(180deg,#eee,#444);background-size:100% calc(var(--string-height)*.2px);background-repeat:no-repeat;background-position:50%}#high-e-string>.fret:hover{background-image:linear-gradient(180deg,#20c997,#1ab687);background-size:100% calc(var(--string-height)*1px)}#b-string>.fret{background-image:linear-gradient(180deg,#eee,#444);background-size:100% calc(var(--string-height)*.4px);background-repeat:no-repeat;background-position:50%}#b-string>.fret:hover{background-image:linear-gradient(180deg,#20c997,#1ab687);background-size:100% calc(var(--string-height)*1px)}#g-string>.fret{background-image:linear-gradient(180deg,#eee,#444);background-size:100% calc(var(--string-height)*.5px);background-repeat:no-repeat;background-position:50%}#g-string>.fret:hover{background-image:linear-gradient(180deg,#20c997,#1ab687);background-size:100% calc(var(--string-height)*1px)}#d-string>.fret{background-image:repeating-linear-gradient(-80deg,#eee,#444 2px,#444 0,#eee 4px);background-size:100% calc(var(--string-height)*.6px);background-repeat:no-repeat;background-position:50%}#d-string>.fret:hover{background-image:repeating-linear-gradient(-80deg,#20c997,#1ab687 2px,#1ab687 0,#20c997 4px);background-size:100% calc(var(--string-height)*1px)}#a-string>.fret{background-image:repeating-linear-gradient(-80deg,#eee,#444 2px,#444 0,#eee 4px);background-size:100% calc(var(--string-height)*.8px);background-repeat:no-repeat;background-position:50%}#a-string>.fret:hover{background-image:repeating-linear-gradient(-80deg,#20c997,#1ab687 2px,#1ab687 0,#20c997 4px)}#a-string>.fret:hover,#low-e-string .fret{background-size:100% calc(var(--string-height)*1px)}#low-e-string .fret{background-image:repeating-linear-gradient(-80deg,#eee,#444 2px,#444 0,#eee 4px);background-repeat:no-repeat;background-position:50%}#low-e-string .fret:hover{background-image:repeating-linear-gradient(-80deg,#20c997,#1ab687 2px,#1ab687 0,#20c997 4px);background-size:100% calc(var(--string-height)*1px)}#high-e-string .single-fretmark:after{top:calc(var(--fretboard-height)/2*1px)}#high-e-string .double-fretmark:before,#high-e-string .single-fretmark:after{content:"";position:absolute;height:calc(var(--string-height)*4px);width:calc(var(--string-height)*4px);border-radius:50%;background:#444;transform:translateY(-50%)}#high-e-string .double-fretmark:before{top:calc(var(--double-fretmark-position-1)*1px)}#high-e-string .double-fretmark:after{content:"";position:absolute;height:calc(var(--string-height)*4px);width:calc(var(--string-height)*4px);border-radius:50%;background:#444;top:calc(var(--double-fretmark-position-2)*1px);transform:translateY(-50%)}#fret-numbers .fret{background:none;border-right:none;border-image:none}.fret{display:flex;flex:1 1;border-right:calc(var(--string-height)*.8px) solid;border-image:linear-gradient(270deg,#777,#bbb,#777) 1 100%;justify-content:center;align-items:center;position:relative;cursor:pointer}.fret:first-child{background:#f2f2f2;min-width:76px;border-right:calc(var(--string-height)*2.4px) solid;flex-grow:0;flex-shrink:0;border-image:linear-gradient(270deg,#bbb,#fff,#bbb) 1 100%}.circle{content:"";line-height:calc(var(--string-height)*4.8px);text-align:center;background:#005fdb;filter:drop-shadow(0 0 10px #eeeeee);opacity:1;color:#fff;font-size:calc(var(--string-height)*1.8px);font-weight:700}.circle,.scale-circle{width:calc(var(--string-height)*4.8px);height:calc(var(--string-height)*4.8px);z-index:2}.scale-circle{background:none;border:calc(var(--string-height)*.5px) dashed #bf00c2;position:absolute;filter:none}.fret-shape{z-index:2!important;width:calc(var(--string-height)*4.8px);height:calc(var(--string-height)*4.8px);border:3px solid;font-size:calc(var(--string-height)*1.8px)}.bg-transparent{background-color:transparent;color:#000}.bg-white{background-color:#fff;color:#222}.bg-black{background-color:#222;color:#fff}.bg-grey{background-color:#a0a0a0;color:#222}.bg-red{background-color:#dc3545}.bg-red,.bg-sky{color:hsla(0,0%,100%,.92)}.bg-sky{background-color:#1b97ad}.bg-lemon{background-color:#f8e374;color:#3d3300}.bg-salmon{background-color:#f6546a}.bg-salmon,.bg-teal{color:hsla(0,0%,100%,.92)}.bg-teal{background-color:#31abab}.border-transparent{border:3px solid transparent}.border-white{border:3px solid #fff}.border-black{border:3px solid #222}.border-grey{border:3px solid #a0a0a0}.border-red{border:3px solid #dc3545}.border-sky{border:3px solid #1b97ad}.border-lemon{border:3px solid #f8e374}.border-salmon{border:3px solid #f6546a}.border-teal{border:3px solid #31abab}.border-solid{border-style:solid!important}.border-dashed{border-style:dashed!important}.border-dotted{border-style:dotted!important}.circle{border-radius:50%}.diamond,.square{border-radius:10%}.diamond{transform:rotate(45deg)}.diamond span.label-display{transform:rotate(-45deg)}#fret-numbers .fret-shape{display:none!important}.popover-body,.triad-style-controls{max-width:3000px!important}.popover-body .option-label,.triad-style-controls .option-label{font-size:9px;color:gray;font-weight:700;text-align:center}.popover-body .input-group,.triad-style-controls .input-group{width:72px}.popover-body .menu-circle,.triad-style-controls .menu-circle{height:24px;width:24px}.popover-body .dropdown-menu,.triad-style-controls .dropdown-menu{min-width:0!important}.popover-body .dropdown-menu .dropdown-options,.triad-style-controls .dropdown-menu .dropdown-options{display:grid;grid-template-columns:1fr 1fr 1fr}.popover-body .form-check>input,.triad-style-controls .form-check>input{width:28px;height:28px;border:none;border-radius:50%;box-shadow:0 4px 8px rgba(0,0,0,.15)}.popover-body .form-check>label,.triad-style-controls .form-check>label{display:none}.popover-body .form-check.option-bg-transparent>input,.triad-style-controls .form-check.option-bg-transparent>input{background:linear-gradient(to bottom left,transparent calc(50% - 2px),red calc(50% - 1px),red calc(50% + 1px),transparent calc(50% + 2px)) no-repeat 0 0/100px 100px}.popover-body .form-check.option-bg-white>input,.triad-style-controls .form-check.option-bg-white>input{background-color:#fff}.popover-body .form-check.option-bg-black>input,.triad-style-controls .form-check.option-bg-black>input{background-color:#222}.popover-body .form-check.option-bg-grey>input,.triad-style-controls .form-check.option-bg-grey>input{background-color:#a0a0a0}.popover-body .form-check.option-bg-red>input,.triad-style-controls .form-check.option-bg-red>input{background-color:#dc3545}.popover-body .form-check.option-bg-sky>input,.triad-style-controls .form-check.option-bg-sky>input{background-color:#1b97ad}.popover-body .form-check.option-bg-lemon>input,.triad-style-controls .form-check.option-bg-lemon>input{background-color:#f8e374}.popover-body .form-check.option-bg-salmon>input,.triad-style-controls .form-check.option-bg-salmon>input{background-color:#f6546a}.popover-body .form-check.option-bg-teal>input,.triad-style-controls .form-check.option-bg-teal>input{background-color:#31abab}.popover-body .form-check.option-border-transparent>input,.triad-style-controls .form-check.option-border-transparent>input{background:linear-gradient(to bottom left,transparent calc(50% - 2px),red calc(50% - 1px),red calc(50% + 1px),transparent calc(50% + 2px)) no-repeat 0 0/100px 100px;border:3px solid red}.popover-body .form-check.option-border-white>input,.triad-style-controls .form-check.option-border-white>input{border:3px solid #fff}.popover-body .form-check.option-border-black>input,.triad-style-controls .form-check.option-border-black>input{border:3px solid #222}.popover-body .form-check.option-border-grey>input,.triad-style-controls .form-check.option-border-grey>input{border:3px solid #a0a0a0}.popover-body .form-check.option-border-red>input,.triad-style-controls .form-check.option-border-red>input{border:3px solid #dc3545}.popover-body .form-check.option-border-sky>input,.triad-style-controls .form-check.option-border-sky>input{border:3px solid #1b97ad}.popover-body .form-check.option-border-lemon>input,.triad-style-controls .form-check.option-border-lemon>input{border:3px solid #f8e374}.popover-body .form-check.option-border-salmon>input,.triad-style-controls .form-check.option-border-salmon>input{border:3px solid #f6546a}.popover-body .form-check.option-border-teal>input,.triad-style-controls .form-check.option-border-teal>input{border:3px solid #31abab}.popover-body .form-check.option-border-solid>input,.triad-style-controls .form-check.option-border-solid>input{border:3px solid gray!important}.popover-body .form-check.option-border-dashed>input,.triad-style-controls .form-check.option-border-dashed>input{border:3px dashed gray!important}.popover-body .form-check.option-border-dotted>input,.triad-style-controls .form-check.option-border-dotted>input{border:3px dotted gray!important}.popover-body .form-check.option-circle>input,.triad-style-controls .form-check.option-circle>input{border-radius:50%;background:#90ee90}.popover-body .form-check.option-square>input,.triad-style-controls .form-check.option-square>input{border-radius:10%;background:#90ee90}.popover-body .form-check.option-diamond>input,.triad-style-controls .form-check.option-diamond>input{border-radius:10%;transform:rotate(45deg);background:#90ee90}.hero .hero-content{z-index:2}.hero .hero-content h1{line-height:1.2}.orientation-overlay{z-index:1000;position:absolute;background:#fff;top:0;right:0;bottom:0;left:0}.orientation-overlay .icon{font-size:64px}.features-grid{display:grid;grid-template-columns:1fr;grid-gap:2rem;gap:2rem}@media(min-width:440px){.features-grid{grid-template-columns:1fr 1fr;gap:1rem}}@media(min-width:768px){.features-grid{grid-template-columns:1fr 1fr 1fr}}@media(min-width:992px){.features-grid{grid-template-columns:1fr 1fr 1fr 1fr}}.features-grid .grid-item:focus,.features-grid .grid-item:hover{box-shadow:0 8px 16px rgba(0,0,0,.1);background-color:#f8f8f8}.features-grid .grid-item:active{box-shadow:0 4px 8px rgba(0,0,0,.2);background-color:#f7f7f7}.pitch-row-one{-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 85%)!important;clip-path:polygon(0 0,100% 0,100% 100%,0 85%)!important}.pitch-row-three{-webkit-clip-path:polygon(0 15%,100% 0,100% 100%,0 100%)!important;clip-path:polygon(0 15%,100% 0,100% 100%,0 100%)!important}.navbar{z-index:3;-webkit-backdrop-filter:blur(1.5rem);backdrop-filter:blur(1.5rem)}.navbar .dropdown-menu{max-height:100vh;overflow-y:auto;box-shadow:0 0 1rem rgba(0,0,0,.1)}.offcanvas .dropdown-menu{border:none!important;background:hsla(0,0%,100%,.95)}.hidden{display:none}select{min-width:160px}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/ba9851c3c22cd980-s.woff2) format("woff2");unicode-range:U+0460-052f,U+1c80-1c8a,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/21350d82a1f187e9-s.woff2) format("woff2");unicode-range:U+0301,U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/c5fe6dc8356a8c31-s.woff2) format("woff2");unicode-range:U+1f??}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/19cfc7226ec3afaa-s.woff2) format("woff2");unicode-range:U+0370-0377,U+037a-037f,U+0384-038a,U+038c,U+038e-03a1,U+03a3-03ff}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/df0a9ae256c0569c-s.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/8e9860b6e62d6359-s.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,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:__Inter_f367f3;font-style:normal;font-weight:100 900;font-display:swap;src:url(/_next/static/media/e4af272ccee01ff0-s.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Inter_Fallback_f367f3;src:local("Arial");ascent-override:90.20%;descent-override:22.48%;line-gap-override:0.00%;size-adjust:107.40%}.__className_f367f3{font-family:__Inter_f367f3,__Inter_Fallback_f367f3;font-style:normal}