/* Mechanical roadmap only. Reuses Phase 1 tokens and component classes.
   The existing header, footer and other pages keep their original styles. */
.mechanical-hub{min-width:0;overflow-wrap:anywhere}
.mechanical-hub .hub-container{max-width:var(--ab-content-wide);margin-inline:auto;padding-inline:clamp(var(--ab-space-4),4vw,var(--ab-space-8))}
.mechanical-hub .page-breadcrumb{padding:var(--ab-space-6) 0;border-color:var(--ab-line);color:var(--ab-text-muted);font-size:var(--ab-type-sm)}
.mechanical-hub .page-breadcrumb a{color:var(--ab-link)}
.mechanical-hub .section{padding:var(--ab-space-12) 0;scroll-margin-top:var(--ab-space-8)}
.mechanical-hub .hub-hero{padding-block:var(--ab-space-16)}
.mechanical-hub .hub-hero h1{max-width:19ch;font-size:var(--ab-type-h1);line-height:var(--ab-leading-heading);letter-spacing:var(--ab-tracking-heading);margin:0 0 var(--ab-space-6)}
.mechanical-hub .hub-hero p{max-width:var(--ab-content-reading)}
.mechanical-hub .hub-toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--ab-space-4);flex-wrap:wrap;margin-bottom:var(--ab-space-6)}
.mechanical-hub .hub-toolbar .eyebrow{margin:0}
.mechanical-hub .theme-control{margin:0;flex-wrap:wrap}
.mechanical-hub .theme-control select{min-height:var(--ab-target);padding:var(--ab-space-2);color:var(--ab-text);background:var(--ab-surface);border:1px solid var(--ab-control-line);border-radius:var(--ab-radius-sm);font:inherit}
.mechanical-hub .actions{margin-block:var(--ab-space-6)}
.mechanical-hub .hub-availability{border-left:3px solid var(--ab-control-line);padding-left:var(--ab-space-4)}
.mechanical-hub .hub-start{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ab-space-6) var(--ab-space-8);padding-left:var(--ab-space-6);margin-block:var(--ab-space-8)}
.mechanical-hub .hub-start li{padding-left:var(--ab-space-2);min-width:0}
.mechanical-hub .hub-start li::marker{color:var(--ab-domain-mechanical-text);font-family:var(--ab-font-mono)}
.mechanical-hub .hub-start p{margin-top:var(--ab-space-2)}
.mechanical-hub .hub-start a{display:inline-block;min-height:var(--ab-target);padding-block:var(--ab-space-2)}
.mechanical-hub .callout{max-width:var(--ab-content-reading)}
.mechanical-hub .hub-progress{max-width:var(--ab-content-reading);display:grid;gap:var(--ab-space-4)}
.mechanical-hub .hub-progress label{font-weight:600}
.mechanical-hub .hub-progress button{justify-self:start}
.mechanical-hub progress{display:block;width:100%;height:var(--ab-space-4);border:1px solid var(--ab-control-line);border-radius:var(--ab-radius-pill);overflow:hidden;background:var(--ab-surface-raised);color:var(--ab-link);accent-color:var(--ab-link)}
.mechanical-hub progress::-webkit-progress-bar{background:var(--ab-surface-raised)}
.mechanical-hub progress::-webkit-progress-value{background:var(--ab-link)}
.mechanical-hub progress::-moz-progress-bar{background:var(--ab-link)}
.mechanical-hub .hub-level-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ab-space-4);margin:var(--ab-space-6) 0 0}
.mechanical-hub .hub-level-nav a{display:flex;flex-direction:column;gap:var(--ab-space-3);color:var(--ab-text);text-decoration:none;border-color:var(--ab-control-line)}
.mechanical-hub .hub-level-nav a:hover strong{text-decoration:underline;text-underline-offset:.2em}
.mechanical-hub .hub-level-nav strong{font-family:var(--ab-font-heading);font-size:var(--ab-type-h3);line-height:1.3}
.mechanical-hub .hub-level-nav span{color:var(--ab-text-muted);font-size:1rem}
.mechanical-hub .hub-level-nav .difficulty{color:var(--ab-domain-mechanical-text)}
.mechanical-hub .fundamentals{background:var(--ab-bg)}
.mechanical-hub .learning-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ab-space-6);border:0;background:transparent;margin:var(--ab-space-8) 0}
.mechanical-hub .topic-card{padding:var(--ab-space-6);background:var(--ab-surface);border-color:var(--ab-line);border-top-color:var(--ab-domain-mechanical);border-radius:var(--ab-radius-md);overflow:visible;gap:var(--ab-space-4);scroll-margin-top:var(--ab-space-8)}
.mechanical-hub .topic-card h3{font-size:var(--ab-type-h3);line-height:1.3;margin:0;color:var(--ab-text)}
.mechanical-hub .topic-card p{font-size:1rem;line-height:var(--ab-leading-body);color:var(--ab-text)}
.mechanical-hub .topic-card .small{font-size:var(--ab-type-sm);color:var(--ab-text-muted)}
.mechanical-hub .difficulty,.mechanical-hub .hub-status{font-size:var(--ab-type-sm);line-height:1.5;color:var(--ab-text-muted)}
.mechanical-hub .difficulty{border:1px solid var(--ab-control-line);border-radius:var(--ab-radius-pill);padding:var(--ab-space-1) var(--ab-space-3)}
.mechanical-hub .topic-card .review-details{margin:0;padding:var(--ab-space-3);border-color:var(--ab-control-line)}
.mechanical-hub .review-details summary{color:var(--ab-link);line-height:1.5}
.mechanical-hub .hub-intro{padding-block:var(--ab-space-4) var(--ab-space-2)}
.mechanical-hub .hub-read{display:flex;align-items:center;gap:var(--ab-space-3);min-height:var(--ab-target);cursor:pointer;font-size:var(--ab-type-sm);margin-top:auto}
.mechanical-hub .hub-read input{width:1.25rem;height:1.25rem;flex:none;accent-color:var(--ab-link);margin:0}
.mechanical-hub .text-link{display:inline-flex;align-items:center;min-height:var(--ab-target);color:var(--ab-link)}
.mechanical-hub .hub-lesson-outline{columns:2;column-gap:var(--ab-space-12);padding-left:var(--ab-space-6)}
.mechanical-hub .hub-lesson-outline li{break-inside:avoid;padding-left:var(--ab-space-2)}
.mechanical-hub .hub-resource{display:flex;flex-direction:column;gap:var(--ab-space-3);text-decoration:none;border-color:var(--ab-control-line)}
.mechanical-hub .hub-resource strong{text-decoration:underline;text-underline-offset:.2em}
.mechanical-hub .hub-resource span{color:var(--ab-text-muted)}
.mechanical-hub :where(a,button,input,select,summary,[tabindex]):focus-visible{outline:3px solid var(--ab-link);outline-offset:4px;box-shadow:none}
.mechanical-hub [hidden]{display:none!important}
.hub-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
/* Same Phase 1 light values, scoped to this hub for JS-off system preference.
   Explicit user choice is applied to the existing root data-ab-theme attribute. */
@media(prefers-color-scheme:light){
 html:not([data-ab-theme]) .mechanical-hub{--ab-bg:#F6F4EF;--ab-surface:#FFFFFF;--ab-surface-raised:#EEEAE2;--ab-text:#111C27;--ab-text-muted:#495A68;--ab-line:#C9C5BC;--ab-control-line:#65727C;--ab-link:#875100;--ab-link-hover:#623A00;--ab-domain-mechanical-text:#236390;color-scheme:light}
}
@media(max-width:42rem){
 .mechanical-hub .learning-grid,.mechanical-hub .hub-level-nav,.mechanical-hub .hub-start{grid-template-columns:1fr}
 .mechanical-hub .hub-hero{padding-block:var(--ab-space-12)}
 .mechanical-hub .hub-lesson-outline{columns:1}
 .mechanical-hub .topic-card{padding:var(--ab-space-4)}
 .mechanical-hub .actions .button{width:100%}
}
@media(prefers-reduced-motion:reduce){html:has(.mechanical-hub){scroll-behavior:auto}.mechanical-hub *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(forced-colors:active){.mechanical-hub :focus-visible{outline:3px solid Highlight}.mechanical-hub progress{border:1px solid CanvasText}.mechanical-hub .topic-card{border:1px solid CanvasText}}
@media print{
 .mechanical-hub .hub-toolbar label,.mechanical-hub .hub-progress,.mechanical-hub .hub-read{display:none!important}
 .mechanical-hub .hub-container{max-width:none;padding:0}.mechanical-hub .section{padding-block:1rem}
 .mechanical-hub .learning-grid,.mechanical-hub .hub-level-nav,.mechanical-hub .hub-start{display:block}
 .mechanical-hub .topic-card,.mechanical-hub .panel{break-inside:avoid;margin-bottom:1rem}
 .mechanical-hub .hub-lesson-outline{columns:1}
}