:root{font-family:DM Sans,sans-serif;color:#f2e9d8;background:#15191f;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px}a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}::selection{background:#f06423;color:#15191f}.site-shell{max-width:1600px;min-height:100vh;margin:auto;padding:0 5.2%;position:relative}.site-shell:before{content:"";position:absolute;top:0;left:5.2%;width:96px;height:3px;background:#c65a43;transform:skew(-28deg);transform-origin:left top}.site-header{height:158px;display:flex;align-items:center;border-bottom:1px solid #343942}.brand{display:inline-flex;align-items:center}.brand-logo{display:block;width:clamp(300px,32vw,430px);height:auto}.tools-section{padding:43px 0 80px}.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.module-card{min-height:284px;padding:25px 27px 27px;display:flex;flex-direction:column;position:relative;overflow:hidden;background:#242a33;border:1px solid #3a4049;border-radius:12px 12px 12px 3px;transition:transform .2s ease,border-color .2s ease,background-color .2s ease}.module-card:before{content:"";position:absolute;top:0;left:27px;width:46px;height:2px;background:#c65a43;opacity:.65;transform:skew(-28deg)}.module-card:after{content:"//";position:absolute;right:25px;bottom:23px;color:#c65a43;font-family:Barlow Condensed,Impact,sans-serif;font-size:19px;font-weight:800;letter-spacing:.11em;opacity:.52}.module-card.unavailable{opacity:.86;filter:saturate(.45)}.module-card.available:hover{transform:translateY(-4px);border-color:#f06423;background:#2a3039}.module-card.available:focus-visible,.brand:focus-visible{outline:2px solid #F06423;outline-offset:4px}.card-top,.card-bottom{display:flex;align-items:center}.card-top{justify-content:flex-end}.card-bottom{justify-content:space-between}.status,.card-bottom{font-size:10px;font-weight:700;letter-spacing:.15em}.status{display:flex;align-items:center;gap:8px;color:#9ca3af}.status-dot{width:5px;height:5px;border-radius:50%;background:#f06423}.card-heading{display:flex;align-items:center;gap:18px;margin:34px 0 17px;min-height:58px}.card-icon{width:58px;height:58px;display:grid;place-items:center;flex:none;color:#f06423;background:#303740;border:1px solid #49505a;border-radius:9px 9px 9px 2px}.card-heading h3{margin:0;font-family:Barlow Condensed,Impact,sans-serif;font-size:30px;font-weight:700;line-height:1;letter-spacing:.025em;text-transform:uppercase}.card-description{max-width:310px;margin:0;color:#9ca3af;font-size:13px;line-height:1.55}.card-bottom{margin-top:auto;padding-top:16px;color:#f06423;font-size:9px}.card-arrow{font-size:17px;line-height:1}.fretboard-page{padding:34px 0 80px}.back-link{display:inline-flex;align-items:center;gap:8px;color:#9ca3af;font-size:13px;font-weight:700}.back-link:hover{color:#f06423}.back-link:focus-visible,.notes-toggle:focus-visible,.wood-switch button:focus-visible,.match-toggle input:focus-visible,.fret-note:focus-visible,.fretboard-scroll:focus-visible{outline:2px solid #F06423;outline-offset:3px}.fretboard-page-heading{display:flex;align-items:end;justify-content:space-between;flex-wrap:wrap;gap:28px;margin:42px 0 30px}.page-kicker{margin:0 0 8px;color:#f06423;font-size:11px;font-weight:700;letter-spacing:.18em}.page-kicker span{color:#c65a43;padding:0 7px}.fretboard-page h1{margin:0;font-family:Barlow Condensed,Impact,sans-serif;font-size:clamp(56px,7vw,86px);font-weight:800;line-height:.95;letter-spacing:.025em;text-transform:uppercase}.page-intro{margin:14px 0 0;color:#9ca3af;font-size:14px;line-height:1.6}.fretboard-controls,.note-controls{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.fretboard-controls{justify-content:flex-end;margin-left:auto}.wood-switch{display:inline-flex;padding:3px;border:1px solid #414852;border-radius:8px;background:#242a33}.wood-switch button{min-height:36px;padding:7px 12px;border:0;border-radius:5px;background:transparent;color:#9ca3af;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.wood-switch button[aria-pressed=true]{background:#f06423;color:#15191f}.wood-switch button:not([aria-pressed=true]):hover{color:#f2e9d8}.match-toggle{display:inline-flex;align-items:center;gap:9px;min-height:44px;color:#f2e9d8;font-size:12px;font-weight:700;cursor:pointer}.match-toggle input{width:17px;height:17px;margin:0;accent-color:#F06423;cursor:pointer}.notes-toggle{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:154px;min-height:44px;padding:10px 16px;border:1px solid #F06423;border-radius:8px;background:#242a33;color:#f2e9d8;font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}.notes-toggle:hover{background:#f06423;color:#15191f}.fretboard-panel{overflow:hidden;container:fretboard / inline-size;border:1px solid #414852;border-radius:12px 12px 12px 3px;background:#242a33}.panel-heading,.fretboard-panel-footer{display:flex;justify-content:space-between;gap:18px;padding:17px 24px;color:#9ca3af;font-size:10px;font-weight:700;letter-spacing:.15em}.panel-heading{border-bottom:1px solid #414852}.panel-heading span:last-child{color:#f06423}.fretboard-scroll{overflow-x:auto;scrollbar-color:#F06423 #242A33}.fretboard-neck{min-width:980px}.fretboard-frets,.fretboard-row{display:grid;grid-template-columns:74px repeat(12,minmax(70px,1fr))}.fretboard-frets{height:45px;align-items:center;color:#9ca3af;font-size:12px;font-weight:700;text-align:center}.fretboard-frets span:nth-child(4),.fretboard-frets span:nth-child(6),.fretboard-frets span:nth-child(8),.fretboard-frets span:nth-child(10),.fretboard-frets span:nth-child(13){color:#f06423}.fretboard-frets .open-fret-label{font-size:10px;letter-spacing:.08em}.fretboard-body{border-top:6px solid var(--wood-binding);border-bottom:6px solid var(--wood-binding);background-color:var(--wood-base);background-image:repeating-linear-gradient(0deg,transparent 0 12px,var(--wood-grain) 13px,transparent 14px,transparent 29px);box-shadow:inset 0 2px #fff4,inset 0 10px 14px #0004,inset 0 -7px 14px #0004}.wood-rosewood{--wood-base: #4B3229;--wood-grain: #1B100D1B;--wood-binding: #B69A7D;--string-color: #BEB2A2;--note-bg: #34241E;--note-border: #816655;--note-text: #F2E9D8;--inlay-color: #E3D0AE}.wood-maple{--wood-base: #C99D68;--wood-grain: #74492818;--wood-binding: #E8D2A9;--string-color: #746B60;--note-bg: #E7C397;--note-border: #8D6845;--note-text: #211A16;--inlay-color: #F5EBDD}.fretboard-row{height:64px}.fret-cell{display:grid;place-items:center;position:relative;border-right:2px solid #AAA8A4;box-shadow:inset -2px 0 2px #0005}.fret-cell:before{content:"";position:absolute;left:0;right:0;top:50%;height:var(--string-width, 2px);transform:translateY(-50%);background:linear-gradient(to bottom,#f5eee0,var(--string-color) 42%,#554e47);box-shadow:0 1px 2px #000b,0 -1px 1px #fff5}.string-1{--string-width: 2px}.string-2{--string-width: 2.5px}.string-3{--string-width: 3px}.string-4{--string-width: 3.5px}.string-5{--string-width: 4px}.string-6{--string-width: 4.5px}.fret-cell.open-string{background:#242a33;border-right:5px solid #D1C5B3}.fret-cell.outside-range{opacity:.32}.fret-inlay{position:absolute;left:50%;bottom:-10px;z-index:2;width:18px;height:18px;transform:translate(-50%);border-radius:50%;background:var(--inlay-color);box-shadow:inset 0 1px 2px #fff6,0 1px 3px #0008;pointer-events:none}.fret-note{z-index:1;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--note-border);border-radius:50%;background:var(--note-bg);color:var(--note-text);font:inherit;font-size:12px;font-weight:700;cursor:pointer;transition:background-color .15s,border-color .15s,transform .15s}.fret-note:hover{transform:scale(1.1);border-color:#f06423;background:#3c342e}.fret-note:disabled{cursor:default}.fret-note:disabled:hover{transform:none}.fret-note.selected{border-color:#f06423;background:#f06423;color:#15191f;box-shadow:0 0 0 4px #f0642333}.fret-note.selected.feedback-correct{border-color:#55c58d;background:#2d7652;color:#fff;box-shadow:0 0 0 4px #55c58d55}.fret-note.selected.feedback-incorrect{border-color:#f27878;background:#a73e42;color:#fff;box-shadow:0 0 0 4px #f2787855}.fret-note.matching{border-color:#f06423;background:#8a4428;color:#f2e9d8;box-shadow:0 0 0 3px #f0642344}.fret-note.concealed{width:26px;height:26px;border-color:var(--note-border);background:var(--note-bg);opacity:.7}.fret-note.concealed:hover,.fret-note.concealed:focus-visible{border-color:#f06423;background:#3c342e}.fretboard-panel-footer{display:none;justify-content:flex-end;border-top:1px solid #414852}.scroll-hint{color:#f06423}@container fretboard (max-width: 979px){.fretboard-panel-footer{display:flex}}.position-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:105px;margin-top:18px;padding:23px 28px;border:1px solid #3a4049;border-radius:10px;background:#242a33}.position-label{color:#9ca3af;font-size:10px;font-weight:700;letter-spacing:.16em}.position-panel p{margin:0;color:#9ca3af;font-size:13px}.position-content{display:flex;align-items:center;gap:22px}.position-note{color:#f06423;font-family:Barlow Condensed,Impact,sans-serif;font-size:46px;line-height:1}.position-content div{display:flex;flex-direction:column;gap:4px;min-width:100px;color:#f2e9d8;font-size:13px}.position-content div span:last-child{color:#9ca3af}.trainer-page{padding:34px 0 80px}.trainer-heading{margin:42px 0 30px}.trainer-heading h1{margin:0;font-family:Barlow Condensed,Impact,sans-serif;font-size:clamp(56px,7vw,86px);font-weight:800;line-height:.95;letter-spacing:.025em;text-transform:uppercase}.trainer-options{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:18px}.trainer-mode,.trainer-difficulty{display:inline-flex;gap:3px;padding:3px;border:1px solid #414852;border-radius:8px;background:#242a33}.trainer-options button{min-height:39px;padding:8px 15px;border:0;border-radius:5px;background:transparent;color:#9ca3af;font:inherit;font-size:12px;font-weight:700;cursor:pointer;text-transform:capitalize}.trainer-options button[aria-pressed=true]{background:#f06423;color:#15191f}.trainer-options button:not([aria-pressed=true]):hover{color:#f2e9d8}.trainer-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px}.trainer-stats div{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:17px 20px;border:1px solid #414852;border-radius:8px;background:#242a33}.trainer-stats span,.trainer-question>span{color:#9ca3af;font-size:10px;font-weight:700;letter-spacing:.14em}.trainer-stats strong{color:#f2e9d8;font-family:Barlow Condensed,Impact,sans-serif;font-size:27px;line-height:1}.trainer-question{padding:22px 24px;border:1px solid #414852;border-bottom:0;border-radius:12px 12px 0 0;background:#242a33}.trainer-question h2{margin:7px 0 4px;color:#f2e9d8;font-family:Barlow Condensed,Impact,sans-serif;font-size:clamp(29px,4vw,39px);line-height:1.05;text-transform:uppercase}.trainer-question h2 em{color:#f06423;font-style:normal}.trainer-question p{margin:0;color:#9ca3af;font-size:13px}.trainer-fretboard{border-radius:0 0 12px 3px}.trainer-fretboard .panel-heading{padding-top:12px;padding-bottom:12px}.trainer-swipe-hint{display:none;color:#f06423;white-space:nowrap}.note-choices{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;margin-top:18px}.note-choices button{min-height:49px;border:1px solid #515862;border-radius:7px;background:#242a33;color:#f2e9d8;font:inherit;font-size:16px;font-weight:700;cursor:pointer;transition:border-color .15s,background-color .15s}.note-choices button:not(:disabled):hover{border-color:#f06423;background:#39302b}.note-choices button.correct-choice{border-color:#55c58d;background:#2d7652;color:#fff}.note-choices button.wrong-choice{border-color:#f27878;background:#a73e42;color:#fff}.trainer-feedback{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:71px;margin-top:18px;padding:15px 20px;border:1px solid #414852;border-radius:8px;background:#242a33}.trainer-feedback p{margin:0;color:#9ca3af;font-size:14px;font-weight:700}.trainer-feedback.correct{border-color:#55c58d;background:#20382f}.trainer-feedback.incorrect{border-color:#f27878;background:#42282b}.trainer-feedback.correct p{color:#87e2b0}.trainer-feedback.incorrect p{color:#faa}.trainer-feedback button{min-height:40px;padding:8px 16px;border:1px solid #F06423;border-radius:6px;background:#f06423;color:#15191f;font:inherit;font-size:13px;font-weight:800;cursor:pointer}.trainer-feedback button:hover{background:#ff7b39}.trainer-options button:focus-visible,.note-choices button:focus-visible,.trainer-feedback button:focus-visible{outline:2px solid #F06423;outline-offset:3px}@media(max-width:1050px){.module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.site-shell{padding:0 6px}.site-shell:before{left:6px}.site-header{height:118px}.brand-logo{width:min(78vw,300px)}.tools-section{padding-top:28px}.module-grid{gap:13px}.module-card{min-height:266px;padding:22px}.module-card:before{left:22px}.fretboard-page{padding-top:25px}.fretboard-page-heading{align-items:start;flex-direction:column;margin:32px 0 24px}.fretboard-controls{justify-content:flex-start;margin-left:0}.fretboard-page h1{font-size:62px}.page-intro{max-width:460px}.panel-heading,.fretboard-panel-footer{padding:14px 18px}.position-panel{align-items:flex-start;flex-direction:column}.trainer-page{padding-top:25px}.trainer-heading{margin:32px 0 24px}.trainer-stats div{flex-direction:column;gap:6px;padding:13px}.note-choices{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:900px)and (orientation:portrait){.trainer-fretboard .trainer-swipe-hint{display:inline}.trainer-fretboard .panel-heading span:first-child{display:none}.fretboard-panel .fretboard-neck{min-width:710px!important}.fretboard-panel .fretboard-frets,.fretboard-panel .fretboard-row{grid-template-columns:50px repeat(12,minmax(55px,1fr))!important}.fretboard-panel .fretboard-frets{height:34px;font-size:10px}.fretboard-panel .fretboard-row{height:46px}.fretboard-panel .fret-note{width:30px;height:30px;font-size:10px}.fretboard-panel .fret-note.concealed{width:21px;height:21px}.fretboard-panel .fret-inlay{width:13px;height:13px;bottom:-7px}}@media(max-width:1200px)and (orientation:landscape){.fretboard-panel .fretboard-neck{min-width:0!important}.fretboard-panel .fretboard-frets,.fretboard-panel .fretboard-row{grid-template-columns:42px repeat(12,minmax(0,1fr))!important}.fretboard-panel .fretboard-frets{height:30px;font-size:10px}.fretboard-panel .fretboard-row{height:39px}.fretboard-panel .fret-note{width:min(26px,85%);height:min(26px,85%);font-size:9px}.fretboard-panel .fret-note.concealed{width:min(19px,70%);height:min(19px,70%)}.fretboard-panel .fret-inlay{width:11px;height:11px;bottom:-6px}.fretboard-panel .fretboard-panel-footer{display:none}}@media(max-width:560px){.module-grid{grid-template-columns:1fr}.module-card{min-height:245px}.card-heading{gap:14px;margin-top:28px}.card-heading h3{font-size:27px}.trainer-options{flex-direction:column;align-items:flex-start}.trainer-mode,.trainer-difficulty{width:100%}.trainer-options button{flex:1;padding:8px 6px}.trainer-stats{gap:7px}.trainer-stats span{font-size:8px}.trainer-stats strong{font-size:24px}.trainer-question{padding:18px}.trainer-feedback{align-items:flex-start;flex-direction:column}}@media(max-width:700px),(max-height:600px){.trainer-feedback.correct,.trainer-feedback.incorrect{position:fixed;z-index:20;right:max(6px,env(safe-area-inset-right));bottom:max(6px,env(safe-area-inset-bottom));left:max(6px,env(safe-area-inset-left));flex-direction:row;align-items:center;gap:8px;min-height:60px;margin:0;padding:10px 12px;box-shadow:0 8px 24px #0009}.trainer-feedback.correct p,.trainer-feedback.incorrect p{font-size:12px}.trainer-feedback.correct button,.trainer-feedback.incorrect button{flex:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}