/* Learn & Build: a quiet workbench inside H03 Physical Futures. No ambient animation. */
.hl-page { --hl-paper:#c7e3e6; --hl-soft:#a7bfca; }
.hl-page [hidden] { display:none!important; }
.hl-page input,.hl-page select,.hl-page button { font:inherit; }
.hl-page input:focus-visible,.hl-page select:focus-visible { outline:2px solid var(--cyan);outline-offset:4px; }
.hl-page button:disabled { opacity:.45;cursor:default; }
.hl-page .hm-header nav a[aria-current=page] { color:var(--cyan);border-bottom:1px solid var(--cyan); }
.hl-wrap { width:min(1240px,86%);margin:0 auto; }
.hl-kicker { font:10px/1.7 var(--mono);letter-spacing:.1em;color:#a9d7d5;text-transform:uppercase;margin:0 0 22px; }
.hl-hero { padding:73px 0 54px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1.15fr 1fr;gap:60px;align-items:center; }
.hl-hero h1 { font-size:clamp(54px,6.5vw,94px);font-weight:400;line-height:.99;letter-spacing:-.065em;margin:0 0 28px; }
.hl-hero h1 span { color:var(--cyan); }
.hl-hero-copy { font-size:17px;line-height:1.75;color:#b2cbd4;max-width:510px;margin:0 0 24px; }
.hl-hero-actions { display:flex;align-items:center;gap:24px;flex-wrap:wrap; }
.hl-button { display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:48px;padding:12px 18px;border:1px solid #9ed8cf;background:#b4e9dd;color:#0c2730;font-size:12px;font-weight:600;cursor:pointer; }
.hl-button:hover { background:#d0f8ec; }
.hl-text-link { display:inline-flex;align-items:center;gap:21px;min-height:44px;border-bottom:1px solid #456a79;font-size:12px;color:#c7e2e6; }
.hl-text-link:hover { color:var(--cyan);border-color:var(--cyan); }
.hl-diagram { position:relative;padding:32px 28px;border:1px solid #284c5a;background:radial-gradient(ellipse at 50% 45%,#153741 0%,#091924 60%,#07131d 100%); }
.hl-diagram .hl-kicker { font-size:8px;margin-bottom:25px; }
.hl-device-drawing { height:245px;position:relative;overflow:hidden; }
.hl-drawing-layer { position:absolute;width:57%;height:123px;left:21.5%;border:1px solid #88c8d0;border-radius:50%;transform:rotate(-18deg) skewX(25deg);background:linear-gradient(135deg,#244a58c9,#0b253066); }
.hl-drawing-layer:nth-child(1) { top:12px;z-index:3;box-shadow:inset 0 0 0 14px #0c263278; }
.hl-drawing-layer:nth-child(1):after { content:'+';position:absolute;inset:0;display:grid;place-items:center;font:35px var(--mono);color:#b9ede7;transform:skewX(-25deg) rotate(18deg); }
.hl-drawing-layer:nth-child(2) { top:61px;z-index:2;border-color:#84bb9e;background:repeating-linear-gradient(90deg,transparent 0 18px,#4e8f7d55 18px 19px),linear-gradient(135deg,#1a494f,#0b2530); }
.hl-drawing-layer:nth-child(3) { top:109px;z-index:1;border-color:#4b7688;background:linear-gradient(135deg,#24424e,#071620);box-shadow:0 13px 0 -1px #0a1c27,0 14px 0 #3c6476; }
.hl-drawing-label { position:absolute;right:0;font:8px/1.5 var(--mono);letter-spacing:.05em;color:#99bdc8;background:#0b202ae8;padding:3px 5px;z-index:4; }
.hl-drawing-label:nth-of-type(4) { top:18px; }.hl-drawing-label:nth-of-type(5) { top:100px;left:0;right:auto; }.hl-drawing-label:nth-of-type(6) { top:183px; }
.hl-diagram-line { display:flex;justify-content:space-between;gap:12px;padding-top:17px;border-top:1px solid #2d4b57;font:8px/1.6 var(--mono);color:#b8d4d8; }
.hl-diagram-note { font:9px/1.8 var(--mono);color:#91afbd;margin:18px 0 0; }
.hl-start { padding:43px 0 48px;display:grid;grid-template-columns:.65fr 1.35fr;gap:65px;border-bottom:1px solid var(--line); }
.hl-start h2,.hl-intro h2,.hl-capstone h2,.hl-notes h2 { margin:0;font-size:34px;line-height:1.15;font-weight:400;letter-spacing:-.045em; }
.hl-start p { color:#adc5cf;font-size:14px;line-height:1.8;margin:0 0 14px; }
.hl-start .hl-fine { font:10px/1.8 var(--mono);color:#96b6c2;margin:0; }
.hl-journey { display:grid;grid-template-columns:200px minmax(0,1fr);gap:60px;padding-top:54px; }
.hl-sidebar { align-self:start;position:sticky;top:25px; }
.hl-sidebar h2 { font:10px/1.6 var(--mono);color:#b0d4d8;margin:0 0 19px;font-weight:400; }
.hl-sidebar ol { padding:0;margin:0;list-style:none; }
.hl-sidebar li { border-top:1px solid #213c4b; }
.hl-sidebar a { display:flex;gap:13px;align-items:center;min-height:46px;font-size:12px;line-height:1.6;color:#a7c2ce; }
.hl-sidebar a span { font:9px var(--mono);color:#719eac; }
.hl-sidebar a:hover { color:var(--cyan); }
.hl-progress-panel { border-top:1px solid #35515c;margin-top:29px;padding-top:23px; }
.hl-progress-panel>p:first-child { color:#c4dedf;font:11px/1.6 var(--mono);margin:0 0 12px; }
.hl-progress-panel progress { width:100%;height:4px;display:block;margin:0 0 21px;accent-color:#a3e8db;background:#203c48;border:0; }
.hl-progress-panel progress::-webkit-progress-bar { background:#203c48; }.hl-progress-panel progress::-webkit-progress-value { background:#a3e8db; }.hl-progress-panel progress::-moz-progress-bar { background:#a3e8db; }
.hl-check { display:flex;gap:10px;align-items:flex-start;font-size:11px;line-height:1.7;color:#bdd6dc;cursor:pointer; }
.hl-check input { width:17px;height:17px;flex:0 0 17px;accent-color:#a3e8db;margin:1px 0 0;cursor:pointer; }
.hl-storage { color:#9bb8c3;font-size:10px;line-height:1.8;margin:13px 0; }
.hl-subtle-button { border:1px solid #3c5c68;background:#0d222d;color:#c5dde2;min-height:44px;padding:10px 13px;font-size:10px; }
.hl-subtle-button:hover:not(:disabled) { border-color:#8cd7d1; }
.hl-intro .hl-kicker { margin-bottom:14px; }
.hl-intro>p:last-child { font-size:14px;line-height:1.8;color:#a9c4ce;max-width:620px;margin:19px 0 28px; }
.hl-filters { border:1px solid #2b4b59;background:#091b26;padding:21px;margin:0 0 33px; }
.hl-filters fieldset { border:0;padding:0;margin:0;min-width:0; }
.hl-filters legend { font:10px/1.6 var(--mono);color:#afd4d8;padding:0;margin:0 0 18px; }
.hl-filter-grid { display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:13px; }
.hl-filter-grid label { display:block;font-size:10px;color:#a7c3ce;margin-bottom:8px; }
.hl-filter-grid input,.hl-filter-grid select { width:100%;min-height:44px;padding:10px 12px;background:#07141f;border:1px solid #385b6b;color:#d8eaf0;font-size:12px;line-height:1.5;min-width:0;border-radius:0;color-scheme:dark; }
.hl-filter-bottom { display:flex;justify-content:space-between;gap:24px;align-items:center;margin-top:15px; }
.hl-filter-bottom p { font:9px/1.8 var(--mono);color:#a3c1cc;max-width:440px;margin:0; }
.hl-filter-bottom button { white-space:nowrap; }
.hl-empty { padding:23px 25px;border:1px solid #a99b74;background:#25251e;margin-bottom:28px; }
.hl-empty h3 { font-size:19px;font-weight:400;margin:0 0 9px; }.hl-empty p { color:#d0cbb8;font-size:13px;line-height:1.75; }.hl-empty button { background:transparent;color:#e2e7d7;border-color:#8b9579; }
.hl-stage { position:relative;border-top:1px solid #395763;padding:36px 0 42px;scroll-margin-top:25px; }
.hl-stage-heading { display:flex;align-items:flex-start;gap:20px; }
.hl-stage-number { font:11px/1.6 var(--mono);color:#a1d8d1;border:1px solid #406970;width:37px;height:37px;display:grid;place-items:center;flex-shrink:0; }
.hl-stage h3 { font-size:32px;line-height:1.2;font-weight:400;letter-spacing:-.04em;margin:0 0 13px; }
.hl-stage-heading p { color:#a9c6d0;font-size:14px;line-height:1.75;max-width:620px;margin:0; }
.hl-stage-meta { display:flex;flex-wrap:wrap;gap:7px 15px;padding:0;margin:18px 0 0;font:9px/1.7 var(--mono);color:#a6c3cd;list-style:none; }
.hl-stage-meta li+li { border-left:1px solid #34505e;padding-left:15px; }
.hl-stage-body { padding-left:57px; }
.hl-outcomes { margin:22px 0;color:#a9c1ce;font-size:12px;line-height:1.8; }
.hl-outcomes summary { cursor:pointer;min-height:44px;display:flex;align-items:center;gap:15px;color:#b3d2d7;list-style:none; }
.hl-outcomes summary:after { content:'+';color:#a5e1d9;font:17px var(--mono); }.hl-outcomes[open] summary:after { content:'−'; }
.hl-outcomes ul { padding-left:18px;margin:0 0 15px; }.hl-outcomes p { margin:0 0 12px; }
.hl-resource-group { border-top:1px solid #264451;margin-top:17px; }
.hl-resource-group>summary { cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:15px;list-style:none;min-height:49px;font:10px/1.8 var(--mono);color:#c3dfdf; }
.hl-resource-group>summary::-webkit-details-marker,.hl-outcomes summary::-webkit-details-marker { display:none; }
.hl-resource-group>summary:after { content:'+';font-size:19px;color:#88c9c8; }.hl-resource-group[open]>summary:after { content:'−'; }
.hl-resource-list { margin:0;padding:0;list-style:none; }
.hl-resource { display:grid;grid-template-columns:93px minmax(0,1fr);gap:18px;padding:20px 0 22px;border-top:1px solid #1c3745; }
.hl-resource-type { font:9px/1.8 var(--mono);color:#a5d1cf;text-transform:uppercase; }
.hl-resource-type span { color:#8eaebb;display:block;text-transform:none;font-size:8px;margin-top:5px; }
.hl-resource h4 { font-size:17px;font-weight:400;line-height:1.5;margin:0 0 8px;letter-spacing:-.015em; }
.hl-resource h4 a { text-decoration:underline;text-decoration-color:#456a79;text-underline-offset:5px; }
.hl-resource h4 a:hover { color:var(--cyan);text-decoration-color:var(--cyan); }.hl-external { font-size:13px;white-space:nowrap;color:#90c8c6; }
.hl-resource p { font-size:12px;line-height:1.8;color:#aec8d1;margin:0 0 9px; }
.hl-resource .hl-resource-source { font:9px/1.7 var(--mono);color:#94bac5; }
.hl-resource-access { margin-top:12px; }
.hl-resource-access summary { cursor:pointer;min-height:32px;font-size:10px;color:#accbd0; }
.hl-resource-access dl { margin:9px 0 0;border-left:1px solid #345361;padding-left:14px; }
.hl-resource-access dl>div { display:grid;grid-template-columns:75px 1fr;gap:10px;font-size:10px;line-height:1.8;padding:4px 0; }
.hl-resource-access dt { color:#8eb0bf; }.hl-resource-access dd { margin:0;color:#bad1da;overflow-wrap:anywhere; }
.hl-stage-empty { padding:16px 0;color:#c7ceb5;font-size:12px;line-height:1.75; }
.hl-milestone { margin-top:25px;padding:23px 25px;border:1px solid #375953;background:linear-gradient(120deg,#102a2b,#0a1b26); }
.hl-milestone .hl-kicker { font-size:8px;margin-bottom:12px;color:#a5d6c2; }
.hl-milestone h4 { font-size:22px;line-height:1.3;font-weight:400;letter-spacing:-.025em;margin:0 0 13px;color:#d1e8e4; }
.hl-milestone p,.hl-milestone li { font-size:12px;line-height:1.8;color:#b0c9cb; }.hl-milestone p { margin:0 0 12px; }.hl-milestone ol,.hl-milestone ul { margin:0 0 16px;padding-left:18px; }
.hl-milestone .hl-check { border-top:1px solid #33554e;padding-top:16px;margin-top:18px;color:#c7e2d8; }
.hl-milestone .hl-check input:disabled { cursor:default; }
.hl-visible-count { margin:14px 0 0;font:8px/1.7 var(--mono);color:#96b5c3; }
.hl-capstone { padding:55px 0 60px;border-top:1px solid #3d5b65;margin-top:15px; }
.hl-capstone>p { font-size:15px;line-height:1.8;color:#b1ccd4;margin:24px 0;max-width:670px; }
.hl-capstone-flow { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #315360;border-bottom:1px solid #315360;margin:30px 0;list-style:none;padding:0; }
.hl-capstone-flow li { padding:22px 17px;border-left:1px solid #264552; }.hl-capstone-flow li:first-child { border-left:0;padding-left:0; }
.hl-capstone-flow span { display:block;font:8px var(--mono);color:#7fa8b8;margin-bottom:13px; }.hl-capstone-flow strong { font-size:13px;line-height:1.6;color:#c2e0e0;font-weight:400; }
.hl-capstone ul:not(.hl-capstone-flow),.hl-capstone ol { font-size:13px;line-height:1.9;color:#a9c6d0;padding-left:20px; }
.hl-notes { border-top:1px solid var(--line);padding:49px 0 60px;margin-top:0;display:grid;grid-template-columns:.65fr 1.35fr;gap:65px; }
.hl-notes h2 { font-size:28px; }.hl-notes h3 { font-size:14px;font-weight:400;color:#c6dcdf;margin:24px 0 12px; }.hl-notes h3:first-child { margin-top:0; }
.hl-notes p,.hl-notes li { font-size:12px;color:#a8c1cd;line-height:1.9; }.hl-notes ul { padding-left:18px; }.hl-notes a { color:#bddddc;text-decoration:underline;text-underline-offset:3px; }
.hl-noscript { border:1px solid #506368;padding:16px;color:#bad1d8;font-size:12px;line-height:1.8; }
@media(max-width:1150px) { .hl-journey { grid-template-columns:175px minmax(0,1fr);gap:40px; }.hl-hero { gap:35px; }.hl-start,.hl-notes { gap:40px; }.hl-diagram { padding:26px 20px; }.hl-filter-grid { grid-template-columns:1fr 1fr; }.hl-filter-grid>div:first-child { grid-column:1/-1; }.hl-stage-body { padding-left:0; }.hl-page .hm-header nav { gap:16px; } }
@media(max-width:900px) { .hl-wrap { width:88%; }.hl-hero { grid-template-columns:1.15fr .85fr;gap:28px; }.hl-hero h1 { font-size:64px; }.hl-hero-copy { font-size:15px; }.hl-device-drawing { height:210px; }.hl-drawing-layer { width:67%;left:16.5%;height:103px; }.hl-drawing-layer:nth-child(2) { top:53px; }.hl-drawing-layer:nth-child(3) { top:94px; }.hl-drawing-label { font-size:7px; }.hl-drawing-label:nth-of-type(6) { top:169px; }.hl-diagram-line { font-size:7px; }.hl-journey { grid-template-columns:1fr;gap:35px; }.hl-sidebar { position:static;display:grid;grid-template-columns:1fr 1fr;gap:35px; }.hl-sidebar ol { display:grid;grid-template-columns:1fr 1fr;column-gap:20px; }.hl-sidebar h2 { grid-column:1/-1; }.hl-progress-panel { margin:0; }.hl-sidebar>nav { min-width:0; }.hl-stage-body { padding-left:57px; }.hl-intro { border-top:1px solid var(--line);padding-top:35px; } }
@media(max-width:680px) { .hl-hero { display:block;padding:42px 0 35px; }.hl-kicker { font-size:9px;margin-bottom:21px; }.hl-hero h1 { font-size:clamp(52px,12.6vw,74px); }.hl-hero-copy { font-size:15px; }.hl-diagram { margin-top:37px;padding:23px; }.hl-device-drawing { height:230px;max-width:340px;margin:auto; }.hl-drawing-layer { height:116px; }.hl-drawing-layer:nth-child(2) { top:60px; }.hl-drawing-layer:nth-child(3) { top:108px; }.hl-drawing-label { font-size:8px; }.hl-drawing-label:nth-of-type(6) { top:185px; }.hl-diagram-line { font-size:8px; }.hl-hero-actions { gap:20px; }.hl-start,.hl-notes { grid-template-columns:1fr;gap:23px;padding:35px 0; }.hl-start h2 { font-size:30px; }.hl-start p { font-size:13px; }.hl-start .hl-fine { font-size:9px; }.hl-journey { padding-top:34px;gap:30px; }.hl-sidebar { display:block; }.hl-sidebar ol { grid-template-columns:1fr 1fr;gap:0 20px; }.hl-sidebar a { font-size:11px;gap:9px; }.hl-progress-panel { margin-top:25px; }.hl-progress-panel .hl-check { font-size:12px; }.hl-storage { font-size:11px; }.hl-intro h2 { font-size:31px; }.hl-intro>p:last-child { font-size:13px; }.hl-filters { padding:18px 16px;margin-bottom:27px; }.hl-filter-grid { gap:16px 12px; }.hl-filter-grid input,.hl-filter-grid select { font-size:16px;padding:10px 9px; }.hl-filter-bottom { gap:12px;align-items:flex-start; }.hl-filter-bottom p { font-size:8px; }.hl-filter-bottom button { font-size:9px;padding:10px; }.hl-stage { padding:28px 0 31px; }.hl-stage-heading { gap:14px; }.hl-stage-number { width:31px;height:31px;font-size:9px; }.hl-stage h3 { font-size:28px;margin-bottom:12px; }.hl-stage-heading p { font-size:13px; }.hl-stage-body { padding-left:0; }.hl-stage-meta { font-size:8px;gap:8px 11px; }.hl-stage-meta li+li { padding-left:11px; }.hl-outcomes { margin:15px 0; }.hl-resource { grid-template-columns:1fr;gap:8px;padding:19px 0 20px; }.hl-resource-type { display:flex;gap:13px;font-size:8px; }.hl-resource-type span { display:inline;margin:0; }.hl-resource h4 { font-size:18px; }.hl-resource p { font-size:12px; }.hl-resource .hl-resource-source { font-size:8px; }.hl-resource-access summary { min-height:44px; }.hl-resource-access dl { margin-top:0; }.hl-milestone { padding:21px 18px; }.hl-milestone h4 { font-size:22px; }.hl-milestone .hl-check { font-size:12px; }.hl-capstone { padding:35px 0 40px; }.hl-capstone h2 { font-size:32px; }.hl-capstone>p { font-size:14px; }.hl-capstone-flow { grid-template-columns:1fr 1fr; }.hl-capstone-flow li { border-bottom:1px solid #264552;padding:20px 14px; }.hl-capstone-flow li:nth-child(3) { border-left:0;padding-left:0; }.hl-capstone-flow li:nth-last-child(-n+2) { border-bottom:0; }.hl-notes h2 { font-size:28px; } }
@media(prefers-reduced-motion:reduce) { .hl-page { scroll-behavior:auto; } }
/* Compact, progressive-disclosure learning path. */
.hl-stage>summary { list-style:none;cursor:pointer;min-height:58px; }
.hl-stage>summary::-webkit-details-marker { display:none; }
.hl-stage-heading-text { display:block;flex:1;min-width:0; }
.hl-stage-heading h3 { font-size:29px;margin-bottom:9px; }
.hl-stage-goal { display:block;color:#a9c6d0;font-size:13px;line-height:1.7;max-width:600px; }
.hl-stage:not([open]) { padding-top:27px;padding-bottom:27px; }
.hl-expand-icon { font:24px var(--mono);color:#9edbd4; }
.hl-stage[open]>.hl-stage-heading>.hl-expand-icon { transform:rotate(45deg); }
.hl-lesson-label { font:9px/1.8 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:#9ccfc8;margin:19px 0 0; }
.hl-resource-group>summary { justify-content:flex-start; }.hl-resource-group>summary>span { color:#8daebb;font-size:8px;margin-left:auto; }
.hl-build-details { margin:14px 0; }.hl-build-details summary,.hl-start-details summary { cursor:pointer;font-size:11px;line-height:1.7;color:#b9d9d8;min-height:44px;align-content:center; }
.hl-build-details h5 { font-size:11px;font-weight:400;color:#d1e1dc;margin:20px 0 9px; }.hl-build-details h3 { font-size:16px;font-weight:400;margin:24px 0 10px; }
.hl-start-details { margin-top:12px; }.hl-start-details p { font-size:12px; }.hl-capstone .hl-capstone-route { font:11px/1.9 var(--mono);color:#a2c8cb; }.hl-capstone .hl-build-details p { font-size:13px;line-height:1.9;color:#acc8d1; }

@media(max-width:680px) { .hl-stage-heading h3 { font-size:26px; }.hl-stage-goal { font-size:12px; }.hl-expand-icon { font-size:20px; }.hl-stage-heading { gap:12px; }.hl-stage-number { width:28px;height:28px; } }
.hl-resource .hl-access-warning { border-left:2px solid #9e966a;padding-left:11px;font-size:10px;line-height:1.8;color:#d0cdb5;margin:12px 0; }
.hl-platform-note summary { cursor:pointer;min-height:44px;align-content:center;color:#bfd7d7;font-size:12px; }
.hl-practice-details summary { font-size:11px;line-height:1.8; }
.hl-capstone-flow { grid-template-columns:repeat(3,1fr); }
.hl-capstone-flow li:nth-child(4) { border-left:0;padding-left:0; }
.hl-capstone-flow li:nth-child(-n+3) { border-bottom:1px solid #264552; }
@media(max-width:680px) { .hl-capstone-flow { grid-template-columns:1fr 1fr; }.hl-capstone-flow li:nth-child(4) { border-left:1px solid #264552;padding-left:14px; }.hl-capstone-flow li:nth-child(odd) { border-left:0;padding-left:0; }.hl-capstone-flow li:nth-child(-n+4) { border-bottom:1px solid #264552; } }