:root{--ink:#142b42;--sea:#0f6070;--mist:#eef5f6;--gold:#f1c66e;--line:#d6e1e8}
.navbar .nav-link{white-space:nowrap;font-size:.92rem;padding-left:.65rem!important;padding-right:.65rem!important}
.learning-page{padding-top:36px;padding-bottom:64px;color:var(--ink);max-width:1160px}.learning-page nav{font-size:.9rem;margin-bottom:28px}.learning-page h2{font-size:1.65rem;line-height:1.25;margin-bottom:18px}.learning-page h3{font-size:1.2rem;margin:24px 0 12px}.learning-page p,.learning-page li{line-height:1.75}.intro{font-size:1.15rem;max-width:850px;margin-bottom:30px}.learning-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.learning-card,.learning-panel{border:1px solid var(--line);border-radius:16px;background:white;padding:28px;box-shadow:0 6px 24px #142b4207}.learning-card{display:block;color:var(--ink);transition:transform .15s,box-shadow .15s}.learning-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px #142b4212;color:var(--sea)}.learning-card h2{font-size:1.3rem}.learning-card p{color:#54677c}.learning-panel{margin-bottom:24px}.learning-panel .learning-panel{padding:18px}.eyebrow{display:block;text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;font-weight:700;color:var(--sea);margin-bottom:12px}.lesson-summary{display:grid;grid-template-columns:2fr 1fr;gap:32px;padding:30px;background:var(--mist);border-radius:16px;margin-bottom:28px}.note-line{font-size:1.4rem;font-weight:600;letter-spacing:.04em}.lesson-actions{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:14px}.tool-controls{display:flex;flex-wrap:wrap;gap:16px;align-items:end;margin:20px 0}.tool-controls label{display:flex;flex-direction:column;gap:7px;font-size:.9rem;font-weight:600}.tool-controls select,.tool-controls input{border:1px solid #aabcc9;border-radius:8px;background:white;color:var(--ink);padding:10px 14px;min-height:44px;max-width:100%}.tool-controls input[type=checkbox]{min-height:20px;width:20px}.tool-controls button,.tool-buttons button{min-height:44px}.tool-buttons{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}.tool-status{min-height:1.7em;color:#3e5d71;font-size:.95rem}.fret-scroll{overflow-x:auto;padding:6px 0 12px}.fret-svg{width:100%;min-width:530px;display:block;max-height:440px;background:#f5f7fa;border-radius:12px}.fret-note{cursor:pointer}.fret-note:focus{outline:none}.fret-note:focus circle{stroke:#b26b00;stroke-width:4}.scale-diagram{width:100%;height:auto}.pattern-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.pattern-grid figure{margin:0}.pattern-grid figcaption{font-weight:600;margin:12px 0}.chord-svg{width:210px;max-width:100%;display:block;margin:0 auto}.chord-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:14px}.chord-tile{background:var(--mist);padding:16px;border-radius:12px;text-align:center}.chord-tile .chord-svg{width:155px}.chord-tile button{margin-top:10px}.download-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px}details summary{cursor:pointer;font-weight:600;padding:10px 0}details p{margin-top:15px}.scale-tab{overflow:auto;background:var(--ink);color:#f4f7fa;border-radius:10px;padding:20px;font-size:.95rem;line-height:1.65;white-space:pre}.practice-clock{font-size:2.7rem;font-weight:650;font-variant-numeric:tabular-nums}.practice-stage{padding:20px;background:var(--mist);border-left:4px solid var(--sea);border-radius:8px}.progress-track{height:8px;background:var(--line);border-radius:10px;overflow:hidden;margin:20px 0}.progress-fill{height:100%;background:var(--sea);width:0}.comparison-notes{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.note-pill{padding:7px 12px;background:#e1e7ee;border-radius:30px}.note-pill.shared{background:var(--gold);color:#30220a}.fret-shell:fullscreen{padding:30px;background:white;overflow:auto}.fret-shell:fullscreen .fret-svg{max-height:75vh}.fret-shell.expanded{position:fixed;inset:0;z-index:1000;background:white;padding:24px;overflow:auto}.home-start{background:var(--mist);padding:32px;border-radius:16px;margin-bottom:32px}.home-start h2{font-size:2rem}.learning-page a:focus-visible,.learning-page button:focus-visible,.learning-page select:focus-visible,.learning-page input:focus-visible{outline:3px solid #b26b00;outline-offset:4px}.sr-message{color:#8d350e}.navbar{z-index:20}#cookieConsent{position:relative;z-index:30}.learning-page button[disabled]{opacity:.55;cursor:not-allowed}.zoom-modal{position:fixed;inset:0;background:#10263fdd;z-index:1000;display:grid;place-items:center;padding:22px}.zoom-dialog{width:min(100%,1100px);max-height:95vh;overflow:auto;background:white;border-radius:14px;padding:22px}.zoom-dialog img{width:100%;max-height:80vh;object-fit:contain}.zoom-trigger{display:block;margin:8px auto}.learning-panel .chord-grid h3{margin-top:0}.compare-preset{margin:6px 10px 6px 0}
@media(max-width:991px){.learning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lesson-summary{grid-template-columns:1fr}.lesson-actions{flex-direction:row;flex-wrap:wrap}.download-links{grid-template-columns:repeat(2,minmax(0,1fr))}.navbar-collapse{background:#142b42;padding:16px;border-radius:10px}}
@media(max-width:640px){.learning-page{padding:24px 16px 40px}.learning-grid,.two-col,.pattern-grid{grid-template-columns:1fr}.learning-panel,.learning-card,.home-start,.lesson-summary{padding:20px}.tool-controls{gap:12px}.tool-controls label{flex:1 1 125px}.tool-controls select{width:100%}.lesson-actions{flex-direction:column}.learning-page h2{font-size:1.4rem}.download-links{grid-template-columns:1fr}.fret-svg{min-width:530px}.fret-shell:fullscreen{padding:12px}}
@media(prefers-reduced-motion:reduce){.learning-card{transition:none}.learning-card:hover{transform:none}}
@media print{nav,footer,.navbar,.tool-controls,.tool-buttons,.lesson-actions,#cookieConsent{display:none!important}.learning-page{padding:0}.learning-panel{box-shadow:none;break-inside:avoid}.fret-svg{min-width:0}.pattern-grid{grid-template-columns:1fr 1fr}}