/* A photographed paper surface with live, responsive printed lettering. */
html{background:#201c20;scroll-padding-top:26px}
body{width:min(1240px,calc(100% - 48px));margin:24px auto;background-color:var(--bg);background-image:url(sleeve-paper.jpg);background-size:1200px;background-blend-mode:multiply;border:1px solid #fff4;box-shadow:0 12px 50px #0007,inset 0 0 16px #4b283222;color:var(--ink);font:18px/1.65 Georgia,'Times New Roman',serif}
.brand,main,footer{width:calc(100% - 112px)}
.brand{padding:26px 0;border-color:color-mix(in srgb,var(--ink) 28%,transparent)}
.brand span{font-family:Georgia,serif;letter-spacing:.09em;font-weight:400}.brand small{letter-spacing:.12em}.brand img{mix-blend-mode:multiply}
.hero{padding:64px 0 54px;gap:50px}.hero h1{max-width:100%;background:none;color:var(--ink);font-size:clamp(68px,8vw,122px);line-height:1.03;letter-spacing:-.025em;text-shadow:.3px .4px 0 #301c3033}
.hero figure{position:relative;transform:rotate(1deg);padding:8px;background:#f0e6d4;box-shadow:2px 3px 7px #38292d44,inset 0 0 3px #fff8;border:1px solid #907d7555}.hero figure img{box-shadow:none;filter:saturate(.88) contrast(.94)}.hero figure::after{content:'';position:absolute;inset:8px;pointer-events:none;background:url(sleeve-paper.jpg) center/600px;mix-blend-mode:multiply;opacity:.11}.hero figcaption{position:relative;text-align:left;margin:12px 4px 3px;font:11px/1.4 Georgia,serif;letter-spacing:.03em;color:#54453f}
.intro{font-size:28px;font-style:italic;line-height:1.35;letter-spacing:0}.lead{max-width:430px;margin:20px 0 26px}.facts{font-size:13px;line-height:1.6}
.eyebrow{font:normal 12px/1.6 Georgia,serif;letter-spacing:.13em;color:var(--accent)}
h2{font:normal italic clamp(30px,3.5vw,43px)/1.18 Georgia,serif;letter-spacing:-.025em}h3{font-family:Georgia,serif;font-weight:normal}
.contents{gap:22px;padding:17px 0;border-color:color-mix(in srgb,var(--ink) 28%,transparent)}.contents a{font:15px/1.6 Georgia,serif;color:var(--ink);text-underline-offset:5px}.contents a:hover{color:var(--accent)}
.support-links{padding:12px 0 0;gap:8px}.support-links .button{font-size:13px;padding:9px 12px;margin:0}.button,.practice-button,.controls button{font-family:Georgia,serif;border-radius:1px;letter-spacing:.015em;font-weight:normal}.button{border-color:var(--accent);padding:12px 18px;gap:16px;font-size:16px}.button:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.primary,.practice-button,.controls button{background:var(--accent);color:#fff8ee;border-color:var(--accent);box-shadow:1px 2px 0 #3d243133}.primary:hover,.practice-button:hover,.controls button:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 85%,black);color:#fff8ee;box-shadow:1px 3px 0 #3d243144}.practice-button[aria-pressed=true]{background:var(--ink);color:#fff8ee;border-color:var(--ink);box-shadow:inset 4px 0 0 var(--accent)}
.lessons{gap:0 34px}.lesson{padding:26px 0 28px;background:transparent;border-top:1px solid var(--accent)}.lesson.is-selected{box-shadow:none;border-top:2px solid var(--accent);padding-top:25px}.lesson h3{font-size:28px;line-height:1.3;margin:20px 0 14px}.lesson .number{font:italic 29px Georgia,serif;color:var(--accent);right:3px;top:21px}.lesson p,.lesson li{font-size:17px;color:var(--muted)}.lesson .small{font:normal 11px/1.5 Georgia,serif;letter-spacing:.05em}.lesson ul{padding-left:20px;margin:0 0 18px}.lesson li+li{margin-top:9px}.lesson .level-badge{font:12px/1.4 Georgia,serif;padding:4px 0;margin-bottom:18px;border:none;border-bottom:1px solid #68537144;border-radius:0;color:var(--accent)}.lesson .aim{font:italic 15px/1.6 Georgia,serif;border-color:color-mix(in srgb,var(--ink) 20%,transparent);padding-top:16px;margin:2px 0 24px}.practice-button{padding:13px 16px;font-size:16px}.practice-button small{font:11px/1.45 Georgia,serif;margin-top:5px;opacity:.85}
.chord-map strong{background:transparent;color:var(--accent);border-color:var(--accent);font-family:Georgia,serif;font-weight:normal}.music-preview svg{border-radius:0}.connection,.listen,.finish,footer{border-color:color-mix(in srgb,var(--ink) 28%,transparent)}
.player-choice{background:color-mix(in srgb,var(--surface) 55%,transparent);border-color:var(--accent)}.player-choice label{font-family:Georgia,serif;font-weight:normal}.player-choice select,select{background-color:var(--bg);border-color:var(--accent);border-radius:0;color:var(--ink)}.player-choice select{font:18px Georgia,serif;padding:16px}.controls{background:color-mix(in srgb,var(--surface) 70%,transparent);border-color:var(--accent)}.controls button{font-size:16px}.controls label{font:13px Georgia,serif}.controls select{font:14px Georgia,serif}.paper{border:1px solid #74665c55;box-shadow:0 2px 5px #382c2722;background:#fffdf5}.text-link{color:var(--accent)}
.practice b{font:12px Georgia,serif;text-transform:uppercase;letter-spacing:.09em}.practice h3{font-size:23px;line-height:1.35}.practice p,.finish{font-size:17px}footer{font:11px/1.6 Georgia,serif;letter-spacing:.06em}.teacher h1{font:normal italic clamp(36px,6vw,60px)/1.15 Georgia,serif}
@media(max-width:700px){body{width:calc(100% - 16px);margin:8px auto;background-size:800px;font-size:18px}.brand,main,footer{width:calc(100% - 38px)}.brand{padding:19px 0}.brand span{font-size:11px}.hero{padding:36px 0 30px;gap:30px}.hero h1{font-size:clamp(57px,16vw,91px);letter-spacing:-.025em}.hero figure{width:82%;max-width:350px;margin:14px auto}.intro{font-size:25px}.lead{max-width:none}.contents{gap:12px 20px}.contents a{font-size:14px}.support-links .button{width:auto;font-size:12px;padding:10px}section:not(.hero){padding:40px 0}.lesson h3{font-size:27px}.lesson{padding:23px 0}.lesson .number{right:2px}.lesson p,.lesson li{font-size:17px}.controls{padding:12px}.player-heading h2{font-size:33px}.player-choice{padding:18px}.player-choice select{font-size:16px}.selection-details{overflow-wrap:anywhere}.practice-button{min-height:66px}.teacher{padding:30px 0}}
@media print{html,body{background:#fff!important;color:#111;box-shadow:none;border:0;width:100%;margin:0}.brand,main,footer{width:100%}.lesson{border:1px solid #999;padding:12px}.lesson p,.lesson li,.practice p,.finish{color:#222}.hero figure::after{display:none}}

/* Align the Solo Study with the visually verified The Gold song-study layout. */
.brand span,.brand small,.eyebrow{font-family:Arial,sans-serif}.eyebrow{text-transform:uppercase;font-weight:700}
.hero h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:normal;transform:none;font-size:clamp(60px,7.8vw,110px);letter-spacing:-.045em}
.contents{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border-top:0;padding:0 0 30px;counter-reset:study-section}
.contents a{display:flex;flex-direction:column;justify-content:center;min-height:122px;padding:20px 24px;background:var(--ink);color:#fff8ee;font-size:20px;line-height:1.3;text-decoration:none;box-shadow:1px 3px 0 #3d243133}
.contents a::before{counter-increment:study-section;content:'0' counter(study-section) ' /';font:bold italic 28px Georgia,serif;margin-bottom:8px;color:#e3dfd2}
.contents a:hover{background:var(--accent);color:#fff8ee;text-decoration:none}
@media(max-width:700px){.hero h1{font-size:clamp(49px,13.8vw,80px)}.contents{grid-template-columns:1fr;gap:12px}.contents a{min-height:90px;padding:16px 20px;font-size:20px}.contents a::before{font-size:25px;margin-bottom:5px}}
