/* Homepage-specific presentation. The laboratory and resource layouts are unchanged. */
main:has(>#course:not([hidden])){max-width:none;padding-top:24px}
#course .hero{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(24px,2.4vw,56px);align-items:center;min-height:0;padding-top:8px;padding-bottom:38px}
#course .hero>div:first-child{min-width:0;padding-right:clamp(0px,.6vw,14px)}
#course .hero h1{font-size:clamp(34px,3.25vw,64px);line-height:1.38;letter-spacing:-.035em;font-weight:500;margin-bottom:24px;line-break:strict}
#course .hero h1 span{display:block;white-space:nowrap}
#course .hero .intro{font-size:clamp(16px,1.13vw,21px);line-height:1.9;max-width:26em;margin-bottom:0;line-break:strict;text-wrap:pretty;word-break:normal;overflow-wrap:normal}
#course .hero .pills{gap:8px;margin:25px 0 28px}
#course .hero .pills span{white-space:nowrap;padding:4px 10px;font-size:13px}
#course .hero .primary{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:100%;padding:14px 18px;font-size:clamp(14px,1.05vw,18px);line-height:1.6;text-align:left}
#course .hero .primary span{margin-left:0;flex-shrink:0}
#course .hero-model{transform:none;margin:0;padding:0;background:#142c35;border:1px solid #416066;border-radius:12px;box-shadow:0 20px 52px #0003;overflow:hidden;position:relative;isolation:isolate;min-width:0}
.hero-model-heading{display:flex;justify-content:space-between;gap:18px;padding:18px 24px;align-items:center;border-bottom:1px solid #36525c;background:#162e37}
.hero-model-heading>div>span{font:11px/1.6 Arial,sans-serif;letter-spacing:2px;color:#dab987}
.hero-model-heading h2{font-size:clamp(23px,1.65vw,32px);line-height:1.5;font-weight:550;color:#f0eddf;letter-spacing:.06em;margin:0;white-space:nowrap}
.hero-model-type{font-size:13px;color:#b6d1c3;border:1px solid #526b60;border-radius:30px;padding:5px 11px;white-space:nowrap}
.hero-model-stage{position:relative;height:clamp(380px,57vh,720px);background:#152e37;overflow:hidden;min-width:0}
#heroWorld{display:block;width:100%;height:100%;min-height:0;pointer-events:auto;touch-action:none;cursor:grab}
#heroWorld:active{cursor:grabbing}
#heroWorldLabels{display:none!important}
#heroWorldFallback{height:100%;position:absolute;inset:0}
#heroWorldFallback[hidden]{display:none}
#heroWorldFallback img{height:100%;width:100%;object-fit:contain}
#heroWorldFallback p{position:absolute;bottom:5px;left:20px;font-size:13px;color:#d1ddd2}
.hero-model-legend{position:absolute;left:24px;right:24px;bottom:13px;display:flex;align-items:center;justify-content:space-between;gap:15px;pointer-events:none;font-size:12px;color:#bfd0c9;text-shadow:0 1px 5px #10252a}
.hero-model-specs{display:flex;justify-content:space-between;gap:12px;padding:13px 24px 7px;flex-wrap:wrap;border-top:1px solid #34525a;color:#b4c9c8;font-size:14px}
.hero-model-specs>span{white-space:nowrap}
.hero-model-specs b{font:500 21px/1.5 Arial,sans-serif;color:#e9d2a5;margin-right:3px}
.hero-model-note{padding:0 24px 18px;color:#9bb6bb;font-size:12px;line-height:1.7;margin:0}
.hero-model button:focus-visible{outline:2px solid #e9c88e}
.hero-model-legend{justify-content:space-between;flex-wrap:wrap;row-gap:6px;z-index:2}
.hero-model-controls{display:flex;gap:7px;pointer-events:auto}
.hero-model-legend>span{margin-left:auto;padding:6px 10px;border-radius:6px;background:#142e37e8;color:#e0ece4;text-shadow:none;line-height:1.5}
.hero-rotation-toggle{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 13px;border:1px solid #71978f;border-radius:7px;background:#142e37ed;color:#f0f5e9;font-size:14px;line-height:1.4;white-space:nowrap;pointer-events:auto;cursor:pointer;touch-action:manipulation;backdrop-filter:blur(8px);text-shadow:none}
.hero-rotation-toggle[hidden]{display:none}
.hero-rotation-toggle:hover{background:#234a50;border-color:#b1d7c8}
.hero-rotation-toggle svg{width:16px;height:16px;fill:currentColor;flex-shrink:0}
#libraryHub .hub-intro>div:first-child>p,#libraryHub>.hub-note{display:none}
#libraryHub .hub-intro{align-items:center;margin-bottom:15px}
#libraryHub .hub-intro h1{font-size:29px;margin:0}
#libraryHub .hub-status{border:0;padding:0;font-size:13px;color:#a9c2c0}
#libraryHub .hub-tabs{margin-top:10px;margin-bottom:18px}
.section-trail{display:flex;align-items:center;gap:15px;flex-wrap:wrap;color:#a8c4bd;font-size:14px;margin:0 0 22px}
.section-trail>button,.archive-return{font-size:14px}
#libraryCompat[hidden]{display:none!important}
#libraryHub .hub-supplement{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;border-top:1px solid #36515b;padding-top:18px;margin-top:26px}
#libraryHub .hub-supplement label{display:flex;align-items:center;gap:12px;color:#b8ceca;font-size:14px;max-width:100%}
#libraryHub .hub-supplement select{width:min(490px,45vw);max-width:100%;font-size:15px}
#libraryHub .hub-supplement button{font-size:14px}
@media(max-width:600px){#libraryHub .hub-supplement label{width:100%;align-items:flex-start;flex-direction:column;gap:6px}#libraryHub .hub-supplement select{width:100%}}
@media(min-width:1900px){#course .hero .pills span{font-size:15px;padding:5px 12px}.hero-model-type{font-size:15px}.hero-model-specs{font-size:16px}.hero-model-specs b{font-size:25px}.hero-model-note{font-size:13px}}
@media(max-width:1100px) and (min-width:901px){#course .hero{gap:22px}#course .hero h1{font-size:33px}#course .hero .intro{font-size:15px}#course .hero .primary{font-size:14px;padding:12px}.hero-model-heading{padding:16px 18px}.hero-model-heading h2{font-size:23px}.hero-model-type{font-size:12px;padding:4px 9px}.hero-model-specs{padding-inline:18px;font-size:12px}.hero-model-specs b{font-size:19px}.hero-model-note{padding-inline:18px}}
@media(max-width:1000px) and (min-width:901px){#course .hero h1{font-size:30px}}
@media(max-width:900px){#course .hero{grid-template-columns:1fr;gap:28px;max-width:900px;margin:auto}#course .hero>div:first-child{padding-right:0}#course .hero h1{font-size:clamp(34px,5.1vw,46px);line-height:1.35;margin-bottom:18px}#course .hero h1 span{display:inline;white-space:normal}#course .hero h1 span:first-child{display:block}#course .hero .intro{font-size:17px;max-width:38em}#course .hero .pills{margin:20px 0}#course .hero .primary{font-size:16px}.hero-model-stage{height:clamp(340px,58vw,480px)}}
@media(max-width:600px){main:has(>#course:not([hidden])){padding-top:18px}#course .hero{padding-top:0;gap:25px}#course .hero h1{font-size:34px}#course .hero h1 span{display:block;white-space:nowrap}#course .hero .intro{font-size:16px}.hero-model-heading{display:block;padding:16px 17px}.hero-model-heading h2{font-size:24px}.hero-model-type{display:inline-block;margin-top:8px;font-size:12px}.hero-model-stage{height:310px}.hero-model-specs{padding:12px 17px 8px;gap:8px 15px;font-size:12px;justify-content:start}.hero-model-specs b{font-size:18px}.hero-model-note{padding:0 17px 15px}.hero-model-legend{left:17px;right:17px;font-size:11px}}
@media(max-width:360px){#course .hero h1{font-size:30px}}
