@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#142f50;--muted:#526982;--blue:#1259a0;--line:#d6e2ed;--tint:#edf4fb}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#fff;font-family:'DM Sans',Arial,sans-serif;line-height:1.7}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}button,input,select{font:inherit}button,a.button{cursor:pointer}button{border:1px solid #acc1d7;border-radius:5px;background:white;color:var(--ink);padding:10px 17px}button:hover{background:var(--tint)}:focus-visible{outline:3px solid #2788e8;outline-offset:4px}[hidden]{display:none!important}.skip{position:absolute;left:15px;top:-80px;z-index:10;background:white;padding:10px}.skip:focus{top:5px}header{max-width:1440px;margin:auto;padding:23px 5%;min-height:108px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:16px;font-weight:700}.brand img{width:145px;height:auto}.brand span{font-size:10px;letter-spacing:3px;border-left:1px solid var(--line);padding-left:16px}nav{display:flex;gap:26px;font-size:13px;flex-wrap:wrap}.artist-link{font-size:12px;border:1px solid var(--line);padding:10px 15px;border-radius:30px}main{max-width:1440px;margin:auto}section{padding:65px 7%}h1,h2,h3{font-family:Manrope,Arial,sans-serif;line-height:1.12}h1{font-size:clamp(44px,5.4vw,78px);font-weight:500;letter-spacing:-3px;margin:24px 0}h2{font-size:clamp(30px,3.3vw,46px);font-weight:500;letter-spacing:-1.5px}h3{font-size:25px;letter-spacing:-.7px;font-weight:600}em{font-family:Georgia,serif;color:#2879c8;font-weight:400}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase}.blue-dot{display:inline-block;background:#2479d1;border-radius:50%;width:6px;height:6px;margin-right:10px}.lede{font-size:17px;color:var(--muted);max-width:520px}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:8%;align-items:center;padding-top:45px;padding-bottom:75px}.hero h1{font-size:clamp(52px,6vw,86px)}.hero .lede{font-size:16px;line-height:1.9;max-width:440px}.portrait{position:relative}.portrait>img{width:100%;height:510px;object-fit:cover;object-position:39% center;border-radius:200px 200px 7px 7px;background:#e5effb}.caption{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;margin-top:12px;color:var(--muted)}.actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin:24px 0}.button{display:inline-block;background:var(--blue);border:1px solid var(--blue);padding:15px 23px;color:#fff;font-size:13px;border-radius:4px;text-decoration:none}.button:hover{background:#0b4786;color:white;text-decoration:none}.text-link{font-size:14px;color:var(--blue);font-weight:600}.small,.note{font-size:12px;color:var(--muted)}.ribbon{padding:24px 5%;text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:10px;letter-spacing:2px;display:flex;justify-content:center;gap:30px;flex-wrap:wrap}.ribbon span{color:#2879c8}.section-head{display:flex;justify-content:space-between;gap:50px;align-items:center;margin-bottom:30px}.section-head h2{margin:10px 0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.card{border:1px solid var(--line);border-radius:7px;padding:30px;display:flex;flex-direction:column;align-items:flex-start}.card h3{margin:12px 0}.card p{font-size:14px;color:var(--muted)}.card .eyebrow{font-size:10px;color:var(--blue)}.card a{margin-top:auto;padding-top:20px;color:var(--blue);font-size:13px}.tint{background:var(--tint)}.page-intro{border-top:1px solid var(--line);padding-bottom:35px}.narrow{max-width:950px;margin:auto}.reading{max-width:900px;margin:auto;padding-top:25px}.reading h2{font-size:30px;margin-top:45px}.reading p,.reading li{color:var(--muted)}.reading li{padding:8px 0}.callout{background:var(--tint);padding:22px 28px;margin-top:30px;border-left:3px solid var(--blue)}.callout p{margin:6px 0}.syllabus li{padding:18px 0;border-bottom:1px solid var(--line)}hr{border:0;border-top:1px solid var(--line);margin:35px 0}.controls{display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap;margin-bottom:24px}label{display:block;font-size:13px;color:var(--muted)}input[type=search],select{display:block;background:white;border:1px solid #acc1d7;color:var(--ink);border-radius:4px;min-height:44px;padding:9px 12px;margin-top:6px;max-width:100%}input[type=search]{min-width:min(330px,85vw)}.controls button{min-height:44px}button:disabled{opacity:.5;cursor:default}.section-top{display:flex;justify-content:space-between;align-items:center}.tag,.topics{font-size:11px;color:var(--blue)}.card .topics{margin:12px 0}.intro h1{font-size:64px}footer{max-width:1440px;margin:auto;padding:45px 7%;border-top:1px solid var(--line);display:flex;align-items:center;gap:30px;font-size:12px;flex-wrap:wrap}footer nav{margin-left:auto}footer p{color:var(--muted)}dialog{border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:35px;max-width:620px;width:calc(100% - 32px);max-height:90dvh;overflow:auto}dialog::backdrop{background:#142f5077}dialog h2{font-size:32px;padding-right:25px}.close{position:absolute;right:15px;top:12px;border:0}.download-intro{font-size:14px}.session-download{display:inline-block;background:var(--blue);color:white;padding:12px 22px;border-radius:4px}#resource-error{font-size:13px}.lab-section{padding-top:15px}.lab-tabs{display:flex;border-bottom:1px solid var(--line);gap:8px;flex-wrap:wrap}.lab-tabs button{border:0;border-radius:5px 5px 0 0;padding:17px 24px;background:var(--tint)}.lab-tabs [aria-selected=true]{background:var(--ink);color:white}.lab-panel{border:1px solid var(--line);border-top:0;padding:40px;border-radius:0 0 8px 8px}.lab-panel h2{margin:12px 0;font-size:36px}.answers{display:flex;gap:10px;flex-wrap:wrap;margin:25px 0}.answers button{min-width:80px}.answers button[aria-pressed=true]{background:var(--ink);color:#fff}.feedback{min-height:52px;padding:15px 20px;background:var(--tint);border-left:3px solid var(--blue);font-size:14px}.feedback[data-result=correct]{border-color:#20805e}.feedback[data-result=wrong]{border-color:#ab5928}.fret-scroll{overflow-x:auto;padding:8px 3px}#fretboard{display:grid;grid-template-columns:50px repeat(13,minmax(45px,1fr));min-width:760px;gap:5px}.fret-label{text-align:center;font-size:12px;align-self:center}.fret{padding:6px;min-height:37px;background:linear-gradient(transparent 48%,#bfcedc 48%,#bfcedc 53%,transparent 53%);border-color:var(--line);font-size:11px}.fret[data-answer=true]{background:#d8eee2;border-color:#20805e}.fret[data-answer=false]{background:#fbe8db}.toggle{display:flex;gap:8px;align-items:center}.toggle input{width:18px;height:18px}
@media(max-width:950px){header{flex-wrap:wrap;gap:18px}header nav{order:3;flex-basis:100%;justify-content:center;border-top:1px solid var(--line);padding-top:15px}.hero{gap:5%}.portrait>img{height:440px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-head{align-items:flex-start}.section-head .lede{max-width:300px}footer nav{margin-left:0}}@media(max-width:600px){header{padding:18px 6%}.brand img{width:110px}.brand span{padding-left:10px;letter-spacing:2px}.artist-link{font-size:10px;padding:7px 10px}header nav{gap:19px;font-size:12px}.hero{grid-template-columns:1fr;padding-top:28px}.hero h1{font-size:62px}.portrait{max-width:380px;margin-top:20px}.portrait>img{height:360px}.ribbon{gap:15px;font-size:8px}.ribbon span{display:none}section{padding:42px 6%}.grid{grid-template-columns:1fr}.section-head{display:block}.card{padding:25px}h1{letter-spacing:-2px}.intro h1{font-size:45px}.lab-tabs{gap:3px}.lab-tabs button{font-size:11px;padding:13px 10px}.lab-panel{padding:23px 16px}.lab-panel h2{font-size:29px}.answers{gap:8px}.answers button{min-width:70px;font-size:12px;padding:9px 11px}.reading{padding-top:0}footer{gap:12px}footer nav{width:100%;gap:20px}.controls{display:grid;grid-template-columns:1fr}input[type=search]{min-width:0;width:100%}}

.hosted-form-fallback{font-size:13px;color:var(--blue);border-top:1px solid var(--line);padding-top:16px}

/* Restore the pale blue arched portrait frame. */
.portrait-frame{height:510px;background:#e5effb;border:1px solid #d3e3f3;border-radius:200px 200px 7px 7px;overflow:hidden}.portrait-frame>img{display:block;width:100%;height:100%;object-fit:cover;object-position:39% center;mix-blend-mode:multiply}@media(max-width:950px){.portrait-frame{height:440px}}@media(max-width:600px){.portrait-frame{height:360px;border-radius:150px 150px 7px 7px}}

/* Lift the portrait within its frame while keeping its proportions. */
.portrait-frame{position:relative}.portrait-frame>img{position:absolute;inset:0;top:-18%;height:118%;object-fit:cover;object-position:39% center}