/* Homepage sample: retain the mechanics site's original structure. */
.course-intro{padding:30px 0 22px}.course-intro .eyebrow{letter-spacing:1.5px;color:#737a8a}.course-intro h2{font-size:40px;line-height:1.25;margin-bottom:10px}
.unit-cards{gap:16px;margin-bottom:24px}.unit-card{border-color:#e1e3ee;box-shadow:0 3px 12px #29243c04}.unit-card>span{color:#7661b5}.unit-marker{gap:10px}.unit-card strong{color:#25283a}.unit-card small{color:#737d8c;font-size:12px}.unit-card:hover{border-color:#ac98cf;background:#fcfbff;box-shadow:0 4px 15px #7135ec09}.home-grid{gap:14px}.home-card{box-shadow:0 3px 12px #29243c04;border-color:#e1e3ee}.home-card:hover{border-color:#ac98cf;background:#fcfbff}.home-card strong{color:#25283a}.home-card span{color:#738094}.site-footer{color:#7d8390}.unit-card:focus-visible,.home-card:focus-visible{outline:3px solid #a08ad5;outline-offset:3px}
@media(max-width:700px){.course-intro{padding:24px 0 18px}.course-intro h2{font-size:32px}.unit-cards{gap:12px}.unit-card{padding:17px;height:190px}.unit-card strong{font-size:16px}.home-grid{gap:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Responsive chapters: available content width. */
#unitCards{container-type:inline-size;grid-template-columns:repeat(3,minmax(0,1fr))}
.unit-card{height:164px;padding:20px;grid-template-rows:30px minmax(0,1fr) 20px;gap:8px}
@supports(container-type:inline-size){
 .home{container-type:inline-size}
 @container(min-width:1120px){#unitCards{grid-template-columns:repeat(4,minmax(0,1fr))}}
 @container(min-width:800px) and (max-width:1119.98px){#unitCards{grid-template-columns:repeat(3,minmax(0,1fr))}}
 @container(min-width:360px) and (max-width:799.98px){#unitCards{grid-template-columns:repeat(2,minmax(0,1fr))}}
 @container(max-width:359.98px){#unitCards{grid-template-columns:1fr}}
}
@media(max-width:700px){.unit-card{height:166px;padding:16px}.unit-card strong{font-size:16px}}

.wrap,.topbar-inner{max-width:1240px}

.chapter-section-title{display:flex;align-items:center;gap:12px;font-size:22px;line-height:1.4;font-weight:700;color:#25283a;margin:0 0 18px}
.chapter-section-title::before{content:"";display:block;flex:0 0 5px;width:5px;height:25px;border-radius:3px;background:linear-gradient(180deg,#a268ef,#7135ec)}
@media(max-width:700px){.chapter-section-title{font-size:19px;gap:10px;margin-bottom:15px}.chapter-section-title::before{height:22px;width:4px;flex-basis:4px}}
/* Borderless header actions inspired by the approved mockup. */
.title-actions{gap:9px}
.title-actions .home-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;min-height:40px;padding:8px;border:0;border-radius:10px;background:transparent;box-shadow:none;color:#697185;transition:background-color .15s,color .15s}
.title-actions .home-icon-btn svg{width:23px;height:23px;stroke-width:1.8}
.title-actions #topHome{color:#7860da;background:#f1edff}
.title-actions #topHome:hover{background:#e7dfff;color:#6548ca}
.title-actions #profileButton:hover{background:#edf0f5;color:#414c63}
.title-actions .home-icon-btn:focus-visible{outline:3px solid #ab94e7;outline-offset:3px}
@media(max-width:700px){.title-actions{gap:5px}.title-actions .home-icon-btn{width:36px;height:36px;min-height:36px;padding:7px}.title-actions .home-icon-btn svg{width:22px;height:22px}}
/* Three practice entry cards. */
.home-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;border-top:1px solid #e1e3ee;padding-top:24px}
.home-grid .practice-entry{display:flex;align-items:center;gap:14px;padding:20px 17px;min-height:110px;min-width:0;text-align:left;border-radius:12px}
.practice-entry .entry-icon{display:flex;align-items:center;justify-content:center;width:54px;height:60px;flex:0 0 54px;border-radius:11px}
.practice-entry .entry-icon svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.practice-entry .entry-clock{color:#7352bc;background:#efebff}.practice-entry .entry-paper{color:#3866d7;background:#eaf1ff}.practice-entry .entry-star{color:#08b8b4;background:#e5f7f6}
.practice-entry .entry-star svg{fill:#08b8b420}
.practice-entry .entry-copy{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.practice-entry .entry-copy strong{font-size:16px;line-height:1.4}.practice-entry .entry-copy>span{font-size:12px;line-height:1.6;color:#758195}
.practice-entry .entry-arrow{display:flex;align-items:center;justify-content:center;width:30px;height:30px;flex:0 0 30px;border-radius:50%;background:#f4f0ff;color:#8264d4;font-size:19px}
@media(min-width:701px) and (max-width:1000px){.home-grid .practice-entry{gap:10px;padding:17px 12px}.practice-entry .entry-icon{width:42px;height:50px;flex-basis:42px}.practice-entry .entry-arrow{width:24px;height:24px;flex-basis:24px}}
@media(max-width:700px){.home-grid{grid-template-columns:1fr;gap:12px;padding-top:20px}.home-grid .practice-entry{min-height:94px;padding:16px;gap:14px}.practice-entry .entry-icon{width:50px;height:54px;flex-basis:50px}.practice-entry .entry-copy strong{font-size:16px}.practice-entry .entry-copy>span{font-size:12px}}


/* Approved final: large icons without fills, regular card dimensions, no arrows. */
.practice-entry .entry-icon{background:transparent;width:54px;height:60px;flex-basis:54px}
.practice-entry .entry-icon svg{width:44px;height:44px;stroke-width:1.5}
.unit-card strong{position:relative;top:5px}
.chapter-section-title:has(+.unit-cards:empty){display:none}
@media(min-width:701px) and (max-width:1000px){.practice-entry .entry-icon{width:42px;height:50px;flex-basis:42px}.practice-entry .entry-icon svg{width:39px;height:39px}}
@media(max-width:700px){.practice-entry .entry-icon{width:50px;height:54px;flex-basis:50px}}