/* Shared MEPVirtual page presentation. Diagrams and engineering state colours remain local. */
body{--mv-bg:#07111d;--mv-panel:#0b1726;--mv-line:#24566a;--mv-text:#eef6ff;--mv-muted:#a9c2d2;--mv-accent:#17e6f2;font-family:Arial,Helvetica,sans-serif!important}
body :where(h1,h2,h3,h4,h5,p,div,span,li,a,label,button,input,select,textarea,th,td,summary,small,strong,b,legend){font-family:Arial,Helvetica,sans-serif!important}
body :where(code,pre,kbd,samp,.mono,.monospace){font-family:Consolas,"Courier New",monospace!important}
body :where(.fa,.fas,.far,.fab,.fa-solid,.fa-regular,.fa-brands){font-family:"Font Awesome 6 Free","Font Awesome 5 Free",FontAwesome!important}
body .fa-brands,body .fab{font-family:"Font Awesome 6 Brands","Font Awesome 5 Brands"!important}
body.mv-module,body.mv-page{background-color:var(--mv-bg)!important;color:var(--mv-text);font-size:15px;line-height:1.6}
body.mv-module h1{font-size:clamp(22px,2.3vw,32px);line-height:1.25;letter-spacing:0;font-weight:750}
body.mv-module h2{font-size:clamp(20px,1.8vw,26px);line-height:1.35;letter-spacing:0}
body.mv-module h3{font-size:18px;line-height:1.4;letter-spacing:0}
body.mv-module :where(input,select,textarea){font-size:14px;line-height:1.4;border-radius:8px}
body.mv-module :where(button,.btn){font-size:13px;line-height:1.4;border-radius:8px}
body.mv-module :where(.card,.panel,.box,.module-panel,.content-card){border-radius:12px;border-color:var(--mv-line)}
body.mv-module :where(.card,.content-card){background-color:var(--mv-panel);color:var(--mv-text)}
body.mv-module :where(.card,.content-card) :where(p,li,label){color:inherit}
body.mv-module :where(.main,.main-content,.content,.workspace,.app-content){min-width:0}
body.mv-module :where(.grid,.grid2,.grid3,.grid-2,.grid-3){min-width:0}
body.mv-page main{max-width:1100px;font-size:16px;line-height:1.7}
body.mv-page h1{font-size:clamp(28px,3.2vw,42px);line-height:1.25}
.mv-brandbar{font-family:Arial,Helvetica,sans-serif!important;background:#0b1f3a!important;border-bottom:3px solid #17e6f2!important}
.mv-bottom-lines{box-sizing:border-box;clear:both;width:100%;margin:24px 0 0;padding:22px 20px 18px;background:#0b1f3a;border-top:1px solid #24566a;text-align:center;color:#eef6ff;font:13px/1.7 Arial,Helvetica,sans-serif}
.mv-bottom-lines .mv-credit-line{margin:0 auto 10px;max-width:1400px;color:#8eeafa;font-size:13px;font-weight:700;letter-spacing:.035em}
.mv-bottom-lines .mv-verify-line{margin:0 auto;max-width:1200px;color:#c4d7e6;font-size:11px;font-weight:500;letter-spacing:.025em}
.mv-site-footer{position:relative!important;display:flex!important;width:100%!important;height:auto!important;flex-wrap:wrap!important;justify-content:center!important;gap:10px 16px!important;margin:0!important;padding:14px 20px 20px!important;background:#0b1f3a!important;color:#eef6ff!important;border-top:1px solid #24566a!important;font:13px/1.5 Arial,Helvetica,sans-serif!important}
.mv-site-footer a,.mv-site-footer button{font:inherit!important;font-size:13px!important;color:#8eeafa!important;background:none!important;border:0!important;padding:5px!important;letter-spacing:0!important;min-height:30px!important;text-decoration:underline!important;box-shadow:none!important}
.mv-seo-guide,.mv-learning-link,.mv-guide-preview{width:calc(100% - 36px);max-width:1120px;box-sizing:border-box;margin:24px auto}
.mv-seo-guide summary{font-size:15px;line-height:1.6}
.mv-seo-content{font-size:15px;line-height:1.7}
.mv-seo-content h2{font-size:24px!important}.mv-seo-content h3{font-size:18px!important}
.mv-legacy-credit{display:none!important}
body.light,body.theme-light,body[data-theme="light"],html.theme-light body,html[data-theme="light"] body{--mv-bg:#edf4f8;--mv-panel:#fff;--mv-line:#bdd1df;--mv-text:#183044;--mv-muted:#4d667b}
@media(max-width:650px){body.mv-module h1{font-size:23px}body.mv-module h2{font-size:21px}.mv-bottom-lines{padding:20px 16px}.mv-bottom-lines .mv-credit-line{font-size:12px;letter-spacing:.02em}.mv-bottom-lines .mv-verify-line{font-size:10px}.mv-site-footer{gap:8px 12px!important}.mv-seo-guide,.mv-learning-link,.mv-guide-preview{width:calc(100% - 24px);margin:18px auto}}
@media print{.mv-bottom-lines{background:#fff!important;color:#111!important;border-top:1px solid #aaa;break-inside:avoid}.mv-bottom-lines .mv-credit-line,.mv-bottom-lines .mv-verify-line{color:#111!important}.mv-site-footer{display:none!important}}
/* Keep the shared bottom area outside each lab's tab-panel visibility rules. */
.mv-bottom-lines{display:block!important;position:relative!important;height:auto!important;min-height:0!important;overflow:visible!important}
.mv-bottom-lines p{display:block!important;position:static!important}
.mv-site-footer{box-sizing:border-box!important}

body[data-mv-page="E-118"] .advanced svg{min-width:0!important;width:100%!important;height:auto!important}

/* =====================================================================
   SITE-WIDE UNIFORMITY LAYER (Oct 2026 review)
   One dark theme, one full-width bottom area, side menus that stay in
   view and stop above the bottom area.
   ===================================================================== */

/* --- one dark theme: per-lab theme switches are hidden --- */
body.mv-module :is(#themeBtn,#btnTheme,#themeMenu,[data-theme-toggle],#themeCycleBtn,#themeToggle,.theme-toggle,button.theme,button#theme){display:none!important}
html{color-scheme:dark}

/* --- lively backdrop: soft cyan / amber glow and a faint engineering grid --- */
body.mv-module,body.mv-page{
  background-image:
    radial-gradient(1100px 520px at 12% -8%,rgba(23,230,242,.10),transparent 60%),
    radial-gradient(900px 480px at 100% 0%,rgba(255,159,67,.07),transparent 60%),
    linear-gradient(rgba(36,86,106,.16) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,86,106,.16) 1px,transparent 1px)!important;
  background-size:auto,auto,44px 44px,44px 44px!important;
  background-attachment:fixed,fixed,fixed,fixed!important}
.mv-brandbar{position:relative;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.mv-brandbar::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,transparent,#ffb020,#17e6f2,transparent);background-size:200% 100%;animation:mvSweep 6s linear infinite;pointer-events:none}
@keyframes mvSweep{from{background-position:200% 0}to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.mv-brandbar::after{animation:none}}
.mv-brandbar .mv-home{transition:background .2s,box-shadow .2s}
.mv-brandbar .mv-home:hover{box-shadow:0 0 0 3px rgba(23,230,242,.18)}

/* --- bottom area: always full width, never squeezed by a lab's own footer{} rules --- */
.mv-bottom-lines,.mv-site-footer{max-width:none!important;float:none!important;left:auto!important;right:auto!important;transform:none!important;grid-column:1/-1!important;align-self:stretch!important;flex:0 0 auto!important;z-index:5}
.mv-seo-guide,.mv-learning-link,.mv-guide-preview{position:relative;z-index:5;float:none!important;grid-column:1/-1}
.mv-seo-guide details{transition:border-color .2s,box-shadow .2s}
.mv-seo-guide details:hover{border-color:#17e6f2;box-shadow:0 0 0 1px rgba(23,230,242,.25),0 10px 30px rgba(0,0,0,.3)}
.mv-site-footer a:hover,.mv-site-footer button:hover{color:#ffffff!important}
/* E-121 pads the whole body; let the bottom area bleed to the edges */
body[data-mv-page="E-121"]{padding-bottom:0!important}
body[data-mv-page="E-121"] :is(.mv-bottom-lines,.mv-site-footer){width:auto!important;margin-left:-16px!important;margin-right:-16px!important}

/* --- side menus: stay in view while scrolling, stop above the bottom area --- */
@media (min-width:920px){
  /* E-101: menu was position:fixed and slid over the footer */
  body[data-mv-page="E-101"] .mv-lab-shell{display:grid;grid-template-columns:224px minmax(0,1fr);align-items:start}
  body[data-mv-page="E-101"] .mv-lab-shell .tabs{position:sticky!important;top:0!important;bottom:auto!important;left:auto!important;height:100vh;max-height:100vh;width:auto!important}
  body[data-mv-page="E-101"] .mv-lab-shell .content{margin-left:0!important}
  /* E-105: body overflow-x:hidden stopped the sticky menu working */
  body[data-mv-page="E-105"]{overflow-x:clip!important;overflow-y:visible!important}
  html:has(body[data-mv-page="E-105"]){overflow-x:clip!important;overflow-y:visible!important}
  body[data-mv-page="E-105"] .layout{align-items:start}
  body[data-mv-page="E-105"] .sidebar{position:sticky!important;top:0;max-height:100vh;overflow-y:auto}
  /* E-115 and ELV-301: menus scrolled away with the page */
  body[data-mv-page="E-115"] aside#nav{position:sticky;top:0;align-self:start;max-height:100vh;overflow-y:auto}
  body[data-mv-page="ELV-301"] .app{align-items:flex-start}
  body[data-mv-page="ELV-301"] .sidebar{position:sticky;top:0;align-self:flex-start;max-height:100vh}
  /* E-120 and FA-201: menus taller than the screen, bottom items were unreachable */
  body[data-mv-page="E-120"] nav.sidebar{max-height:calc(100vh - 100px);overflow-y:auto}
  body[data-mv-page="FA-201"] nav.sidebar{max-height:calc(100vh - 86px);overflow-y:auto}
}

/* --- readable text on the dark theme (contrast fixes found in the audit) --- */
body[data-mv-page="E-102"]{--muted2:#8597ad}
body[data-mv-page="E-103"] .lib-btn{color:#ffd9b0!important}
body[data-mv-page="E-103"] .tool.primary{color:#1a0d00!important}
body[data-mv-page="E-108"]{--dimmer:#8794a6}
body[data-mv-page="E-114"],body[data-mv-page="ELV-301"]{--text-faint:#8193a8}
body[data-mv-page="E-114"] .mk-card{color:var(--text,#e7edf3)}
body[data-mv-page="E-115"].dark :is(h1,h2,h3){color:#eaf4ff}
body[data-mv-page="E-119"]{--ink-faint:#8aa0b6}
body[data-mv-page="FA-201"]{--text-mute:#8392b8}
.lv4:not(.tile){color:#062b1c!important}
body[data-mv-page="E-111"] button.on:not(.ghost),body[data-mv-page="E-111"] .skip{color:#04121f!important}
body[data-mv-page="E-121"]{--faint:#8a9aa4}

/* --- layout tidy-ups found in the visual review --- */
/* E-103: the action buttons squeezed the page title into a one-word column */
body[data-mv-page="E-103"] header.top{flex-wrap:wrap}
body[data-mv-page="E-103"] header.top .page-heading{flex:1 1 380px}
body[data-mv-page="E-103"] header.top .top-actions{flex:1 1 auto;flex-wrap:wrap;justify-content:flex-end}
/* ELV-302: sheet code and title ran together in the toolbar */
body[data-mv-page="ELV-302"] .pt-label > *{margin-right:8px}
/* Wi-Fi studio: same top bar look as every other lab */
body[data-mv-page="ELV-307"] > header{background:#0b1f3a!important;border-bottom:3px solid #17e6f2;box-shadow:0 6px 24px rgba(0,0,0,.35)}
body[data-mv-page="ELV-307"] > header > a:not(:first-child){color:#e6f7fb;font-size:13px;font-weight:600;letter-spacing:.04em;padding:6px 12px;border:1px solid rgba(0,194,224,.55);border-radius:6px;text-decoration:none;margin-left:auto}
/* same credit-line sizes on every page (E-106 enlarged its own <p> text) */
.mv-bottom-lines .mv-credit-line{font-size:13px!important;line-height:1.7!important}
.mv-bottom-lines .mv-verify-line{font-size:11px!important;line-height:1.7!important}
@media(max-width:650px){.mv-bottom-lines .mv-credit-line{font-size:12px!important}.mv-bottom-lines .mv-verify-line{font-size:10px!important}}
/* phones: tall lab headers should scroll away instead of covering half the screen */
@media(max-width:919px){
  body[data-mv-page="E-120"] header,body[data-mv-page="E-114"] header.nameplate{position:static!important}
}