.chapter{width:min(1180px,100%);display:grid;grid-template-columns:minmax(280px,.7fr) minmax(420px,1.3fr);gap:8vw;align-items:center}.chapter-intro h1{font:clamp(62px,8vw,118px)/.84 var(--serif);letter-spacing:-.07em;margin:18px 0;overflow-wrap:anywhere}.chapter-intro>p:not(.eyebrow){font:italic 25px var(--serif);color:#587064}.chapter-intro>span{display:inline-block;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.sound-path{max-height:62vh;overflow:auto;padding:45px 40px;scrollbar-width:thin;position:relative}.sound-path:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:linear-gradient(transparent,var(--gold),transparent)}.sound-path button{position:relative;display:grid;grid-template-columns:44px 1fr;align-items:center;width:min(390px,90%);min-height:94px;margin:0 auto 18px;padding:12px 22px;border:1px solid #27574035;border-radius:50%;background:#fffaf0c9;color:var(--g);text-align:left;box-shadow:0 12px 35px #174a3310;transform:translateX(calc((var(--i) % 2) * 70px - 35px));transition:.35s ease;backdrop-filter:blur(8px)}.sound-path button:hover{transform:translateX(calc((var(--i) % 2) * 70px - 35px)) scale(1.045);background:#fff}.sound-path small{grid-row:1/3;color:var(--gold);font-size:9px}.sound-path strong{font:clamp(26px,3vw,42px)/1 var(--serif);overflow-wrap:anywhere}.sound-path span{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.65}
.sonar{position:absolute;inset:10%;display:grid;place-items:center}.sonar i{position:absolute;width:48%;aspect-ratio:1;border:1px solid #ad864866;border-radius:50%;animation:sonar 4.8s ease-out infinite}.sonar i:nth-child(2){animation-delay:-1.6s}.sonar i:nth-child(3){animation-delay:-3.2s}@keyframes sonar{0%{transform:scale(.3);opacity:0}25%{opacity:1}100%{transform:scale(2);opacity:0}}
.tools button,.tools label{border-radius:7px}.tools button.active{background:var(--g);color:#fff}
@media(max-width:780px){header{height:72px;padding:0 18px}header button{font-size:27px}#login{width:40px;height:40px}main{padding:15px 18px 115px;min-height:calc(100vh - 72px)}.chapter{grid-template-columns:minmax(0,1fr);text-align:center;gap:15px;padding-top:30px}.chapter-intro h1{font-size:clamp(54px,15vw,82px)}.chapter-intro>p:not(.eyebrow){font-size:21px}.sound-path{width:100%;max-height:48vh;padding:20px 9px 65px}.sound-path button,.sound-path button:hover{width:88%;min-height:77px;transform:translateX(calc((var(--i) % 2) * 20px - 10px));padding:10px 15px}.sound-path strong{font-size:30px}.lesson-copy{min-width:0}.lesson h1{font-size:clamp(48px,16vw,78px);overflow-wrap:anywhere}.example{grid-template-columns:34px minmax(0,1fr) minmax(0,1fr)}.example>*{overflow-wrap:anywhere;min-width:0}.symbol{font-size:42vw;max-width:90vw;overflow-wrap:anywhere}.symbol.long{font-size:clamp(48px,16vw,70px)}#noteModal section{padding:28px 18px 25px}#noteHeading{font-size:34px}.tools{overflow-x:auto}.surface{height:calc(100% - 130px)}}