.preview-brand{text-decoration:none}
.preview-brand .wordmark{font-size:18px}
.navbtn{text-decoration:none;font-size:13px}
.preview-banner{padding:10px 24px;border-bottom:1px solid var(--line);color:var(--gold2);font-size:12px;font-weight:700;letter-spacing:.08em}
.preview-steps{display:flex;flex-wrap:wrap;gap:8px;padding:14px 24px;border-bottom:1px solid var(--line)}
.preview-steps button{background:#0d1513;color:var(--muted);border:1px solid var(--line);border-radius:10px;padding:9px 11px;font-size:13px;cursor:pointer}
.preview-steps button[aria-current=step]{color:var(--gold2);border-color:var(--gold);background:#201d0f}
.preview-steps span{font-weight:800;color:var(--gold2);margin-right:5px}
.preview-logo{display:block;width:86px;height:86px;object-fit:contain;border-radius:50%;margin-bottom:20px}
#intro .hero h1{font-size:clamp(38px,5vw,64px);line-height:1.05}
#intro .hero{min-height:0;padding:10px 0 22px}
.preview-context{margin-top:16px}
.preview-pills{margin:16px 0}
.preview-price{font-size:38px;color:var(--gold2);font-weight:800;margin:18px 0}
.preview-price small{font-size:15px;color:var(--muted);font-weight:400}
.preview-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.preview-links a{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.preview-school{display:flex;gap:12px;align-items:center;text-decoration:none}
.preview-school img{border-radius:50%;object-fit:contain;flex:none}
.preview-step-actions{display:flex;gap:10px;flex:none}
.nextStepCard button{white-space:normal}
button:disabled{cursor:not-allowed;opacity:.52;box-shadow:none}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold2);outline-offset:3px}
.choices button[aria-pressed=true]{border-color:var(--gold);background:#26210f}
.choices button.correct{background:#123c23;border-color:#287b45}
.choices button.wrong{background:#3c1717;border-color:#9b4343}
.feedback.incorrect{background:#3c1717;border-color:#9b4343}
.instructorIntro .avatar{width:100px;height:100px}
.barSchematic{margin-bottom:16px}
#locked .card{display:flex;flex-direction:column}
#locked .paid-cta{margin-top:auto;min-height:50px}
#previousStep[hidden],#nextStepBar[hidden]{display:none}
.practiceStep input{flex:none;accent-color:var(--gold);width:17px;height:17px}
@media(max-width:760px){
 .preview-brand .wordmark{font-size:14px;letter-spacing:.08em}
 .preview-brand{gap:9px}
 .preview-brand .mark{width:38px;height:38px;font-size:18px;border-radius:10px}
 header{gap:10px}
 header .navbtn{padding:8px;font-size:11px;max-width:100px;text-align:center}
 .preview-banner{padding:10px 14px;font-size:11px}
 .preview-steps{padding:12px 14px;gap:6px}
 .preview-steps button{font-size:12px;padding:9px}
 .instructorIntro{flex-direction:column}
 .preview-links,.preview-step-actions{flex-direction:column;width:100%}
 .preview-links>*{width:100%;text-align:center}
 .nextStepCard button{min-height:48px}
 .footerBrand{flex-direction:column;align-items:flex-start}
 .footerBrand strong{font-size:13px}
 #intro .hero h1{font-size:38px}
 .preview-price{font-size:32px}
}
@media(prefers-reduced-motion:reduce){.page{animation:none}}

/* Selected course content: compact sequence and judgment card. */
#intro .hero h1{font-size:clamp(38px,4.3vw,56px)}
#lesson-47 .card+.card{margin-top:16px}
.buildSequence{list-style:none;padding:0;margin:12px 0;display:grid;gap:8px}
.buildSequence li{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#0b1612;font-size:14px}
.buildSequence li span{color:var(--gold2);font-weight:800;width:18px;flex:none}
.judgmentBody p:last-child{color:var(--gold2);font-weight:800;border-top:1px solid var(--line);padding-top:16px}
.preview-breadth{margin-top:22px}
@media(max-width:760px){#intro .hero h1{font-size:38px}}