/* Course indexes only: existing experiment panels keep their measured layout. */
#app[data-page=lab]{padding-top:18px}
#app[data-page=lab]>.breadcrumb{margin:0 0 5px;font-size:11px}
#app[data-page=lab]>h1{font-size:32px;line-height:1.35;margin:5px 0 8px}
#app[data-page=lab]>.page-lead{font-size:12px;line-height:1.65;margin:0 0 14px;max-width:850px}
#app[data-page=home],#app[data-page=courses]{padding-top:30px}
#app[data-page=home] .course-hero{min-height:0;grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr);gap:50px;padding-bottom:15px}
#app[data-page=home] .course-hero h1{font-size:clamp(34px,4vw,50px);line-height:1.35;margin:11px 0 16px}
#app[data-page=home] .hero-copy>p{max-width:640px;font-size:14px;line-height:1.85}
#app[data-page=home] .hero-copy>.eyebrow{font-size:11px;color:var(--teal);letter-spacing:1px}
#app[data-page=home] .hero-actions{margin:20px 0 13px}
#app[data-page=home] .hero-actions a{font-size:13px;padding:10px 16px}
#app[data-page=home] .hero-copy>.hero-use{font-size:12px;max-width:620px;margin:0}
#app[data-page=home] .hero-art{height:260px;max-width:390px;justify-self:end;width:100%}
#app[data-page=home] .hero-caption{font-size:10px;bottom:-3px}
#app[data-page=home] .section-header{margin-top:20px;padding-top:22px}
.question-directory,.course-entry{scroll-margin-top:22px}
.theme-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:3px 0 18px;border-bottom:1px solid var(--line)}
.theme-filter button{background:transparent;border-radius:0;border-color:transparent;color:var(--muted);padding:7px 10px;font-size:13px}
.theme-filter button[aria-pressed=true]{color:var(--gold);border-bottom-color:var(--gold)}
.theme-count{font-size:11px;color:var(--muted);margin-left:auto}
.home-lab-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:50px}
.home-lab-grid .experiment-row{display:grid;grid-template-columns:74px minmax(0,1fr) 17px;align-items:center;gap:15px;padding:19px 0;min-height:105px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--text);transition:background .15s}
.home-lab-grid .experiment-row:hover{transform:none;background:#ffffff03}
.home-lab-grid .experiment-row h3{font-size:20px;line-height:1.55;margin:0 0 7px}
.home-lab-grid .experiment-row p{font-size:11px;line-height:1.65;margin:0;color:var(--muted)}
.home-lab-grid .experiment-row:hover h3,.home-lab-grid .experiment-row:hover .directory-arrow{color:var(--gold)}
.home-lab-grid .experiment-row .directory-number{font-size:11px}
.home-course-directory .section-header{margin-top:34px!important}
.course-index-heading h1{font-size:clamp(32px,3.7vw,46px);line-height:1.4;margin:9px 0 19px}
.course-index-heading .page-lead{font-size:14px;line-height:1.9;max-width:720px}
.course-shortcuts{display:flex;gap:24px;flex-wrap:wrap;padding:17px 0 21px;margin:24px 0 6px;border-top:1px solid var(--line)}
.course-shortcuts>a{display:flex;gap:10px;align-items:baseline;font-size:13px;color:var(--text)}
.course-shortcuts>a:hover{color:var(--gold)}
.course-shortcuts small{font-size:10px}
.course-grid-rich .course-entry{border-bottom:1px solid var(--line);padding:0 0 17px}
.course-grid-rich .course-card{border:0;padding:18px 0 7px;min-height:0;align-items:start}
.course-grid-rich .course-card h3{font-size:19px;line-height:1.65}
.course-grid-rich .course-question{font-size:12px;line-height:1.8;color:var(--muted);margin:4px 24px 9px 62px}
.course-experiments{display:flex;flex-wrap:wrap;gap:6px 17px;margin-left:62px;font-size:12px;line-height:1.6}
.course-experiments>a{padding:4px 0}
@media(max-width:1000px){
 .home-lab-grid{column-gap:28px}
 .home-lab-grid .experiment-row{grid-template-columns:57px minmax(0,1fr) 15px;gap:12px}
 .home-lab-grid .experiment-row h3{font-size:19px}
 #app[data-page=home] .course-hero{gap:20px}
}
@media(max-width:700px){
 #app[data-page=lab]{padding:12px 14px 45px}
 #app[data-page=lab]>.breadcrumb{font-size:10px;margin-bottom:4px}
 #app[data-page=lab]>h1{font-size:25px;line-height:1.35;margin:4px 0 6px}
 #app[data-page=lab]>.page-lead{font-size:11px;line-height:1.6;margin:0 0 11px}
 #app[data-page=home],#app[data-page=courses]{padding-top:21px}
 #app[data-page=home] .course-hero{display:block;padding-bottom:7px}
 #app[data-page=home] .course-hero h1{font-size:34px;line-height:1.35;margin-top:11px}
 #app[data-page=home] .hero-art{display:none}
 #app[data-page=home] .hero-copy>p{font-size:13px;line-height:1.85}
 #app[data-page=home] .hero-copy>.hero-use{font-size:11px}
 #app[data-page=home] .hero-actions{gap:8px;margin:19px 0 12px}
 #app[data-page=home] .hero-actions a{font-size:12px;padding:10px 12px}
 #app[data-page=home] .section-header{margin-top:16px;padding-top:20px;padding-bottom:14px}
 #app[data-page=home] .section-header h2{font-size:23px}
 #app[data-page=home] .section-header p{font-size:11px;line-height:1.7;margin-top:9px}
 .theme-filter{gap:5px 6px;padding-bottom:11px}
 .theme-filter button{font-size:12px;padding:7px 6px}
 .theme-count{font-size:10px}
 .home-lab-grid{grid-template-columns:1fr}
 .home-lab-grid .experiment-row{grid-template-columns:52px minmax(0,1fr) 14px;gap:12px;min-height:98px;padding:17px 0}
 .home-lab-grid .experiment-row h3{font-size:19px;line-height:1.55}
 .home-lab-grid .experiment-row p{font-size:11px}
 .home-lab-grid .experiment-row .directory-number{font-size:10px;line-height:1.8}
 .course-shortcuts{gap:12px 21px;margin-top:22px;padding:15px 0}
 .course-shortcuts>a{font-size:12px;gap:7px}
 .course-shortcuts small{font-size:9px}
 .course-grid-rich .course-card{gap:12px;padding-top:17px}
 .course-grid-rich .course-card h3{font-size:18px}
 .course-grid-rich .course-question{margin-left:44px;margin-right:8px;font-size:11px}
 .course-experiments{margin-left:44px;font-size:11px;gap:5px 14px}
}
