/* Content-only adoption of the local visual guide. Header/footer own their tokens.
   Loaded last, screen only. Technical report/print and calculation logic are unchanged. */
@media screen {
html:has(body.visual-guide) { background:#fff; }
html[data-theme=night]:has(body.visual-guide) { background:#191a20; }
body.visual-guide {
 --ui-canvas:#fff; --ui-surface:#fff; --ui-subtle:#f6f7fb;
 --ui-ink:#323338; --ui-muted:#676879; --ui-line:#d0d4e4;
 --ui-accent:#0060b9; --ui-accent-hover:#004f99; --ui-accent-soft:#cce5ff;
 --ui-green:#00854d; --ui-green-soft:#d5f4e6; --ui-red:#b4233d; --ui-red-soft:#ffdde3;
 --ui-amber:#946000; --ui-amber-soft:#fff0c2; --ui-on-accent:#fff;
 --ui-body:Arial,Helvetica,sans-serif; --ui-heading:'Poppins','Poppins-fb',Arial,sans-serif;
 --ui-mono:'JetBrains Mono',ui-monospace,monospace;
 background:var(--ui-canvas)!important; color:var(--ui-ink); font:14px/1.5 var(--ui-body);
 background-image:none!important;
}
html[data-theme=night] body.visual-guide {
 --ui-canvas:#191a20; --ui-surface:#22232c; --ui-subtle:#282a34;
 --ui-ink:#f0eff4; --ui-muted:#b0afbe; --ui-line:#55596c;
 --ui-accent:#8ec5ff; --ui-accent-hover:#b7dcff; --ui-accent-soft:#263e58;
 --ui-green:#a3dbb8; --ui-green-soft:#263e33; --ui-red:#f0acb6; --ui-red-soft:#472e36;
 --ui-amber:#e9c27e; --ui-amber-soft:#423925; --ui-on-accent:#191a20;
}
body.visual-guide::before,body.visual-guide::after { background-image:none!important; }
/* Map the existing component families to guide roles, including local overrides. */
body.visual-guide, body.visual-guide :is(main,.vd,.amp-workspace-strip,dialog,[role=dialog],.drawer,.amp-modal) {
 --sans:var(--ui-body)!important; --serif:var(--ui-heading)!important; --mono:var(--ui-mono)!important;
 --bg:var(--ui-canvas)!important; --bg-card:var(--ui-surface)!important; --bg-deep:var(--ui-subtle)!important; --bg-deepest:var(--ui-subtle)!important;
 --on-dark:var(--ui-ink)!important; --on-dark-dim:var(--ui-muted)!important; --on-dark-line:var(--ui-line)!important;
 --ink:var(--ui-ink)!important; --ink-soft:var(--ui-ink)!important; --ink-mute:var(--ui-muted)!important; --ink-dim:var(--ui-muted)!important; --ink-fade:var(--ui-muted)!important;
 --accent:var(--ui-accent)!important; --accent-bright:var(--ui-accent-hover)!important; --copper:var(--ui-accent)!important; --copper-deep:var(--ui-accent-hover)!important;
 --clay-text:var(--ui-accent)!important; --clay-small:var(--ui-accent)!important; --ink-inverse:var(--ui-on-accent)!important;
 --rule:var(--ui-line)!important; --rule-strong:var(--ui-line)!important; --hairline:var(--ui-line)!important;
 --input:var(--ui-surface)!important; --display:var(--ui-surface)!important; --ctrl:var(--ui-subtle)!important;
 --pass:var(--ui-green)!important; --green:var(--ui-green)!important; --fail:var(--ui-red)!important; --red:var(--ui-red)!important; --amber:var(--ui-amber)!important;
 --glass:var(--ui-surface)!important; --panel-glass:var(--ui-surface)!important; --glass-edge:var(--ui-line)!important;
 --pw-ink:var(--ui-ink)!important; --pw-muted:var(--ui-muted)!important; --pw-line:var(--ui-line)!important; --pw-paper:var(--ui-surface)!important; --pw-soft:var(--ui-subtle)!important;
 --pw-serif:var(--ui-heading)!important; --pw-sans:var(--ui-body)!important;
 --aw-ink:var(--ui-ink)!important; --aw-muted:var(--ui-muted)!important; --aw-line:var(--ui-line)!important; --aw-paper:var(--ui-surface)!important; --aw-soft:var(--ui-subtle)!important;
 --cable-ink:var(--ui-ink)!important; --cable-muted:var(--ui-muted)!important; --cable-line:var(--ui-line)!important; --cable-canvas:var(--ui-canvas)!important; --cable-surface:var(--ui-surface)!important; --cable-subtle:var(--ui-subtle)!important; --cable-accent:var(--ui-accent)!important; --cable-accent-soft:var(--ui-accent-soft)!important;
}
body.visual-guide :is(main,dialog,[role=dialog],.drawer,.amp-workspace-strip) { color:var(--ui-ink); font-family:var(--ui-body); }
body.visual-guide main { background:var(--ui-canvas)!important; }
body.visual-guide :is(main,dialog,[role=dialog]) :is(p,label,input,select,textarea,button,td,th,summary,small,.hint,.sub,.lede,.crumb,.btn-sm,.row-mini,.fl,.fld-label,.unit,.k,.v) {
 font-family:var(--ui-body)!important; letter-spacing:normal; text-transform:none;
}
body.visual-guide :is(main,dialog,[role=dialog]) :is(h1,h2,h3,h4,.plat-title,.vd-head .t,.ct,.lib-name,.sec-head h2) {
 font-family:var(--ui-heading)!important; font-weight:500!important; font-style:normal!important; color:var(--ui-ink)!important; letter-spacing:-.02em; text-transform:none;
}
body.visual-guide :is(main,dialog,[role=dialog]) :is(h1,h2,h3,h4,.plat-title,.vd-head .t,.ct) :is(span,em,strong):not(.guide-calculator-emblem):not(.guide-calculator-emblem *) { font-family:inherit!important; font-style:normal; color:inherit; }
body.visual-guide main :is(h1,.plat-title,.vd-head .t) { font-size:1.5rem!important; line-height:1.35!important; }
body.visual-guide :is(main,dialog) :is(h2,.sec-head h2) { font-size:1.25rem!important; line-height:1.4!important; }
body.visual-guide :is(main,dialog) :is(h3,.ct) { font-size:1rem!important; line-height:1.5!important; }
body.visual-guide :is(main,dialog) :is(.hint,.sub,.lede,.lib-desc,.project-subtitle,.fld-label,.fl,label) { font-size:.875rem; line-height:1.5; }
body.visual-guide :is(main,dialog) :is(.hint,.sub,.lede,.lib-desc,.project-subtitle,.crumb,small) { color:var(--ui-muted); }
body.visual-guide main :is(.mono,code,pre,.lib-no,.lib-std) { font-family:var(--ui-mono)!important; }
/* Neutral surfaces; avoid altering diagrams, charts and technical report canvases. */
body.visual-guide :is(main,dialog) :is(.vd-card,.vd-hero,.lib-item,.library-empty,.kpis,.kpi,.panel,.card,.set-sec,.sheet-card,.library-search) {
 background:var(--ui-surface)!important; border-color:var(--ui-line)!important; border-radius:8px!important; box-shadow:none!important; backdrop-filter:none!important;
}
body.visual-guide main .vd { background:transparent!important; box-shadow:none!important; }
body.visual-guide :is(main,dialog) :is(.vd-head,.plat-head) { background:transparent!important; color:var(--ui-ink)!important; box-shadow:none!important; }
body.visual-guide main :is(.lib-item,.kpi) { transform:none!important; }
body.visual-guide main #library-query { border:0!important; box-shadow:none!important; }
body.visual-guide main .seg-radio label { padding:4px!important; font-size:.75rem!important; white-space:nowrap; }
body.visual-guide main :is(th,thead) {background:var(--ui-subtle)!important;color:var(--ui-muted)!important;border-color:var(--ui-line)!important;}
body.visual-guide main td {border-color:var(--ui-line)!important;}
/* Text inputs: exclude native toggles, ranges, color controls and diagram tools. */
body.visual-guide :is(main,dialog,[role=dialog]) :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]):not([type=button]):not([type=submit]),select,textarea) {
 font:400 .875rem/1.5 var(--ui-body)!important; color:var(--ui-ink)!important; background-color:var(--ui-surface)!important;
 border:1px solid var(--ui-line)!important; border-radius:4px!important; box-shadow:none!important;
 min-height:36px; padding:7px 10px; max-width:100%; box-sizing:border-box;
}
body.visual-guide :is(main,dialog) .field { background:var(--ui-surface)!important; border:1px solid var(--ui-line)!important; border-radius:4px!important; box-shadow:none!important; }
body.visual-guide :is(main,dialog) .field input { border:0!important; background:transparent!important; min-width:0; }
body.visual-guide :is(main,dialog) :is(input,textarea)::placeholder { color:var(--ui-muted); opacity:1; }
body.visual-guide :is(main,dialog) :is(input[type=checkbox],input[type=radio]) { accent-color:var(--ui-accent); }
body.visual-guide :is(main,dialog,[role=dialog]) :is(button,.btn-sm,.row-mini,.button,.sso-btn,.vd-pdf-btn,.vd-save-btn,.vsp-save,.add-btn) {
 font:400 .8125rem/1.5 var(--ui-body)!important; letter-spacing:normal!important; text-transform:none!important;
 border-radius:4px!important; box-shadow:none!important; text-shadow:none!important; transform:none!important;
}
body.visual-guide :is(main,dialog) :is(button,.btn-sm,.row-mini,.button,.vd-pdf-btn,.add-btn,.library-categories button,.seg-radio,.vd-tab) {
 border:1px solid var(--ui-line)!important; background:var(--ui-surface)!important; color:var(--ui-ink)!important;
}
body.visual-guide :is(main,dialog) :is(.primary,.btn-primary,.auth-submit,.btn-sm:not(.ghost):not(.del):not(.danger),.btn-sm.ink,.btn-sm.dark,.vd-save-btn,.vsp-save,.mcc-primary,[type=submit]) {
 background:var(--ui-accent)!important; border-color:var(--ui-accent)!important; color:var(--ui-on-accent)!important;
}
body.visual-guide :is(main,dialog) :is(.primary,.btn-primary,.vd-save-btn,.vsp-save,.mcc-primary,[type=submit]):hover:not(:disabled) { background:var(--ui-accent-hover)!important; }
body.visual-guide :is(main,dialog) :is(button[aria-pressed=true],button[aria-selected=true],.seg-radio label.active,.seg-btn.active,.seg-btn.is-active,.vd-tab.active) { background:var(--ui-accent-soft)!important; color:var(--ui-accent)!important; border-color:var(--ui-accent)!important; }
body.visual-guide :is(main,dialog) :is(button,input,select,textarea):disabled { opacity:.55; cursor:not-allowed; }
body.visual-guide :is(main,dialog) :is(a,input,select,textarea,button,summary,[tabindex]):focus-visible { outline:2px solid var(--ui-accent)!important; outline-offset:3px; }
body.visual-guide :is(main,dialog) :is(.error,.fail,.invalid,.row-mini.del) { color:var(--ui-red)!important; }
body.visual-guide :is(main,dialog) :is(.success,.pass) { color:var(--ui-green)!important; }
body.visual-guide :is(main,dialog) :is(.warning,.warn) { color:var(--ui-amber)!important; }
body.visual-guide :is(main,dialog) a:not(.lib-item):not(.button):not(.btn-sm):not(.row-mini) { color:var(--ui-accent); }
body.visual-guide :is(main,dialog) :is(input,select,textarea,button,a) { transition-duration:100ms!important; }
@media(max-width:600px) {
 body.visual-guide :is(main,dialog) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),select,textarea) { font-size:1rem!important; }
 body.visual-guide :is(main,dialog) :is(button,.btn-sm,.row-mini,.button) { min-height:40px; }
}
@media(prefers-reduced-motion:reduce) { body.visual-guide :is(main,dialog) :is(input,select,textarea,button,a),body.visual-guide main *,body.visual-guide dialog * { transition:none!important; animation:none!important; } }
}
/* Review fixes 31 Oct 2026. S2: section titles (Results, Document) are 20 px;
   the page H1 keeps 24 px. S5: segmented option text matches the 13 px field labels. */
@media screen {
body.visual-guide main .vd-head h2.t { font-size:1.25rem!important; line-height:1.4!important; }
body.visual-guide.page-cable main .vd-fld .fld-label { font-size:13px!important; line-height:18px; }
body.visual-guide.page-cable main .seg-radio label { font-size:13px!important; }
}