/* Transformer screen layout on the accepted calculator design basis
   (docs/design/CALCULATOR-DESIGN-BASIS.md). Screen only. Module-scoped tokens;
   the engine, document controls and printed report are unchanged by this file. */
@media screen {
html:has(body.page-transformer) { background:#fff; scroll-padding-top:0; }
html[data-theme="night"]:has(body.page-transformer) { background:#191a20; }
body.page-transformer {
 --tx-canvas:#fff; --tx-surface:#fff; --tx-subtle:#f6f7fa; --tx-group-edge:#e1e5ed;
 --tx-ink:#323338; --tx-muted:#676879; --tx-line:#d0d4e4;
 --tx-accent:#0060b9; --tx-accent-hover:#004f99; --tx-accent-soft:#cce5ff; --tx-on-accent:#fff;
 --tx-pass:#006b40; --tx-fail:#b4233d; --tx-amber:#6b4500;
 --tx-body:Arial,Helvetica,sans-serif; --tx-heading:'Poppins','Poppins-fb',Arial,sans-serif;
 --tx-mono:'JetBrains Mono',ui-monospace,monospace;
 background:var(--tx-canvas)!important; background-image:none!important; color:var(--tx-ink);
 font:14px/1.5 var(--tx-body);
}
html[data-theme="night"] body.page-transformer {
 --tx-canvas:#191a20; --tx-surface:#22232c; --tx-subtle:#22242e; --tx-group-edge:#414654;
 --tx-ink:#f0eff4; --tx-muted:#b0afbe; --tx-line:#55596c;
 --tx-accent:#8ec5ff; --tx-accent-hover:#b7dcff; --tx-accent-soft:#263e58; --tx-on-accent:#191a20;
 --tx-pass:#a3dbb8; --tx-fail:#f0acb6; --tx-amber:#e9c27e;
 color-scheme:dark;
}
body.page-transformer::before, body.page-transformer::after { background-image:none!important; }

/* Map the grouped-card component tokens to the module palette. */
body.page-transformer .vd-stage, body.page-transformer .vd-stage .vd, body.page-transformer .amp-workspace-strip,
body.page-transformer dialog, body.page-transformer [role=dialog] {
 --sans:var(--tx-body)!important; --serif:var(--tx-heading)!important; --mono:var(--tx-mono)!important;
 --bg:var(--tx-canvas)!important; --bg-card:var(--tx-surface)!important; --bg-deep:var(--tx-subtle)!important; --bg-deepest:var(--tx-subtle)!important;
 --ink:var(--tx-ink)!important; --ink-soft:var(--tx-muted)!important; --ink-dim:var(--tx-muted)!important; --ink-fade:var(--tx-muted)!important; --ink-mute:var(--tx-muted)!important;
 --on-dark:var(--tx-ink)!important; --on-dark-dim:var(--tx-muted)!important; --on-dark-line:var(--tx-line)!important;
 --accent:var(--tx-accent)!important; --copper:var(--tx-accent)!important; --clay-text:var(--tx-accent)!important; --clay-small:var(--tx-amber)!important; --ink-inverse:var(--tx-on-accent)!important;
 --rule:var(--tx-line)!important; --rule-strong:var(--tx-line)!important; --hairline:var(--tx-line)!important; --soft:var(--tx-subtle)!important;
 --input:var(--tx-surface)!important; --display:var(--tx-surface)!important; --ctrl:var(--tx-subtle)!important;
 --pass:var(--tx-pass)!important; --fail:var(--tx-fail)!important; --amber:var(--tx-amber)!important;
 --glass:var(--tx-surface)!important; --panel-glass:var(--tx-surface)!important; --glass-edge:var(--tx-line)!important; --panel-shadow:none!important;
 --aw-ink:var(--tx-ink)!important; --aw-muted:var(--tx-muted)!important; --aw-line:var(--tx-line)!important; --aw-bg:var(--tx-surface)!important; --aw-soft:var(--tx-subtle)!important; --aw-paper:var(--tx-surface)!important;
 --pad:16px; --gap:12px; --hero-size:42px; --ctl-h:36px;
}

/* Font roles. Explicit rules close shorthand gaps in nested spans, lists, charts and dialogs. */
body.page-transformer :is(main,dialog,[role=dialog],.mobile-drawer,footer) *,
body.page-transformer :is(main,dialog,[role=dialog],.mobile-drawer,footer) *::before,
body.page-transformer :is(main,dialog,[role=dialog],.mobile-drawer,footer) *::after { font-family:var(--tx-body)!important; letter-spacing:normal; }
body.page-transformer :is(main,dialog,[role=dialog],.mobile-drawer,footer) :is(h1,h2,h3,h4,.t,.ct,.doc-h,.brand,.aw-head h2,.aw-people h3,.aw-schedule>summary,.aw-schedule h3,.amp-dc-section::before,.transformer-details>summary,.vd-adv-toggle),
body.page-transformer :is(main,dialog,[role=dialog],.mobile-drawer,footer) :is(h1,h2,h3,h4,.t,.ct,.doc-h,.brand) * { font-family:var(--tx-heading)!important; font-weight:500; font-style:normal; text-transform:none; }
body.page-transformer :is(main,dialog) :is(pre,code,.mono,.amp-dc-docno,.amp-dc-rev,.amp-dc-chip,.amp-dc-vf,.amp-dc-reg,.amp-dc-rrow .rv),
body.page-transformer :is(main,dialog) :is(pre,code,.mono) * { font-family:var(--tx-mono)!important; }

/* Stage and sections */
.page-transformer .vd-stage { display:block; background:var(--tx-canvas); padding:20px 24px 48px; }
.page-transformer .vd-stage .vd-suite.suite-wide { display:flex; flex-direction:column; width:100%; max-width:none; gap:32px; }
.page-transformer .vd-suite.suite-wide .vd { min-width:0; padding:0; border:0; border-radius:0; box-shadow:none; background:transparent; font-family:var(--tx-body); font-weight:400; }
.page-transformer .vd-suite.suite-wide > .vd[data-role="analysis"] { position:static; max-height:none; overflow:visible; }
.page-transformer .vd [hidden] { display:none!important; }
.page-transformer .vd .vd-head { padding:0 0 14px; min-height:42px; flex-wrap:wrap; gap:8px; background:transparent; color:var(--tx-ink); }
.page-transformer .vd .vd-head .hl { display:block; }
.page-transformer .vd .vd-head .t { font:500 24px/1.3 var(--tx-heading); letter-spacing:-.02em; color:var(--tx-ink); margin:0; }
.page-transformer .vd[data-role="analysis"] .vd-head .t, .page-transformer .vd[data-role="doc"] .vd-head .t { font-size:20px; line-height:1.35; }
.page-transformer .transformer-subheading { font:400 14px/1.5 var(--tx-body); color:var(--tx-muted); margin:4px 0 0; }
.page-transformer .vd .vd-head .hr { flex-wrap:wrap; gap:8px; }
.page-transformer .vd .vd-head .tag { font:400 12px/1.5 var(--tx-body); letter-spacing:0; text-transform:none; color:var(--tx-muted); }
.page-transformer .vd .vd-status { background:var(--tx-surface); padding:4px 10px; border:1px solid var(--tx-line); border-radius:12px; box-shadow:none; }
.page-transformer .vd .vd-status select { appearance:auto; background-image:none; color:var(--tx-ink); font:400 13px var(--tx-body); letter-spacing:0; text-transform:none; padding:0; min-height:26px; }
.page-transformer .vd .vd-status select option { color:var(--tx-ink); background:var(--tx-surface); }

/* Reading groups: opaque, quiet, 18 px radius. */
.page-transformer .vd :is(.vd-card,.vd-hero), .page-transformer .transformer-check, .page-transformer .transformer-notices, .page-transformer #amp-workspace {
 min-width:0; background:var(--tx-subtle); border:1px solid var(--tx-group-edge); border-radius:18px; box-shadow:none;
 backdrop-filter:none; -webkit-backdrop-filter:none; padding:16px;
}
.page-transformer .vd .vd-card .ct { display:block; font:500 16px/1.4 var(--tx-heading); letter-spacing:-.01em; text-transform:none; color:var(--tx-ink); margin:0 0 12px; min-height:0; }
.page-transformer .vd .vd-card .ct::before, .page-transformer .vd .ct-meta { display:none; }

/* Inputs */
.page-transformer .vd .vd-cards { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; align-items:start; }
.page-transformer .vd .vd-card .vd-fld-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.page-transformer .vd .vd-adv-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px 12px; }
.page-transformer .vd .vd-fld { min-width:0; margin:0; }
.page-transformer .vd .vd-fld .fl { margin-bottom:4px; min-height:18px; gap:2px 4px; flex-wrap:wrap; display:flex; }
.page-transformer .vd .vd-fld .fld-label { font-size:13px; line-height:1.5; font-weight:400; letter-spacing:0; text-transform:none; color:var(--tx-muted); }
.page-transformer .vd .fld-hint { display:block; flex-basis:100%; font-size:12px; line-height:1.45; color:var(--tx-muted); margin:0; }
.page-transformer .vd .field { min-height:40px; height:auto; display:flex; align-items:center; gap:6px; padding:0 10px; }
.page-transformer .vd .field input { min-width:0; width:100%; font:400 14px/1.5 var(--tx-body); color:var(--tx-ink); border:0; background:transparent; padding:8px 0; }
.page-transformer .vd .field input::placeholder { color:var(--tx-muted); opacity:1; }
.page-transformer .vd .field .unit { flex-shrink:0; font:400 13px var(--tx-body); color:var(--tx-muted); }
.page-transformer .vd select.dd { width:100%; min-height:40px; height:auto; padding:8px 10px; font:400 14px/1.4 var(--tx-body); color:var(--tx-ink); appearance:auto; background-image:none; text-overflow:ellipsis; }
.page-transformer .vd select.dd option { background:var(--tx-surface); color:var(--tx-ink); }
.page-transformer .vd .vd-adv { margin-top:12px; }
.page-transformer .vd .vd-adv-toggle { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; width:100%; min-height:44px; padding:10px 16px; color:var(--tx-ink); font:500 16px/1.4 var(--tx-heading); letter-spacing:0; text-transform:none; text-align:left; cursor:pointer; transition:none; }
.page-transformer .vd .vd-adv-toggle .hint { font:400 13px/1.5 var(--tx-body); color:var(--tx-muted); }
.page-transformer .vd .vd-adv-toggle .chev { margin-left:auto; color:var(--tx-muted); }
.page-transformer .vd .vd-adv-panel .vd-card + .vd-card { margin-top:12px; }
.page-transformer .transformer-input-foot { color:var(--tx-muted); font-size:13px; margin:12px 0 0; }

/* Field errors */
.page-transformer .transformer-field-error { font-size:13px; line-height:1.45; margin:6px 0 0; color:var(--tx-fail); }
.page-transformer .vd .field:has([aria-invalid=true]), .page-transformer .vd select.dd[aria-invalid=true] { border-color:var(--tx-fail)!important; box-shadow:0 0 0 1px var(--tx-fail)!important; }
.page-transformer .transformer-review-input { margin:0 0 16px; min-height:44px; padding:8px 14px; cursor:pointer; color:var(--tx-ink); font:400 14px var(--tx-body); }

/* Results */
.page-transformer .vd .vd-hero { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:24px; margin-bottom:12px; align-items:start; }
.page-transformer .vd .vd-hero-main { border:0; padding:0; min-width:0; max-width:100%; }
.page-transformer .vd .vd-hero-viz { display:block; border:0; padding:0; min-width:0; }
.page-transformer .vd .vd-hero-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.page-transformer .vd .vd-lbl { font-size:14px; font-weight:400; letter-spacing:0; text-transform:none; color:var(--tx-muted); }
.page-transformer .vd .vd-figure { margin:10px 0 4px; }
.page-transformer .vd .vd-figure .big { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; }
.page-transformer .vd .vd-figure .big .v { font:500 42px/1 var(--tx-body); color:var(--tx-ink); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.page-transformer .vd .vd-figure .big .u { font:400 16px var(--tx-body); color:var(--tx-muted); }
.page-transformer .vd .vd-figure .sub { font-size:14px; font-weight:400; margin-top:8px; color:var(--tx-ink); overflow-wrap:anywhere; }
.page-transformer .vd .vd-badge { font-size:13px; font-weight:400; letter-spacing:0; text-transform:none; padding:5px 11px; border-radius:12px; white-space:normal; border:1px solid var(--tx-line); background:var(--tx-surface); color:var(--tx-ink); }
.page-transformer .vd .vd-badge.fail { color:var(--tx-fail); border-color:var(--tx-fail); }
.page-transformer .vd .vd-badge.transformer-unassessed { color:var(--tx-muted); }
.page-transformer .vd .vd-mini { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:18px; }
.page-transformer .vd .vd-mini .m { min-width:0; }
.page-transformer .vd .vd-mini .k { display:block; font:400 13px/1.5 var(--tx-body); color:var(--tx-muted); letter-spacing:0; text-transform:none; }
.page-transformer .vd .vd-mini .v { display:block; margin-top:4px; font:500 24px/1.2 var(--tx-body); color:var(--tx-ink); letter-spacing:-.01em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.page-transformer .transformer-basis { font-size:13px; line-height:1.55; color:var(--tx-muted); margin:14px 0 0; overflow-wrap:anywhere; }
.page-transformer .tx-chartcap { font:400 13px/1.5 var(--tx-body); color:var(--tx-muted); margin:2px 0 6px; letter-spacing:0; text-transform:none; }
.page-transformer .tx-chart { width:100%; max-width:100%; height:auto; display:block; }
.page-transformer .tx-chart .grid { stroke:var(--tx-group-edge); stroke-width:1; }
.page-transformer .tx-chart .axis { stroke:var(--tx-muted); stroke-width:1; }
.page-transformer .tx-chart .curve { fill:none; stroke:var(--tx-ink); stroke-width:2; }
.page-transformer .tx-chart .curve.alt { stroke:var(--tx-accent); stroke-width:1.6; stroke-dasharray:5 3; }
.page-transformer .tx-chart .curve.dash { stroke-dasharray:7 4; stroke-width:1.6; }
.page-transformer .tx-chart .mark { fill:var(--tx-ink); stroke:var(--tx-subtle); stroke-width:1.2; }
.page-transformer .tx-chart .inr { fill:var(--tx-subtle); stroke:var(--tx-ink); stroke-width:1.2; }
.page-transformer .tx-chart text { fill:var(--tx-muted); font-size:10px; }
.page-transformer .tx-chartgrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.page-transformer .tx-chartgrid > div { min-width:0; }
.page-transformer .transformer-check-summary { margin:0 0 16px; font-size:14px; line-height:1.5; color:var(--tx-ink); }
.page-transformer .transformer-check-summary:empty { display:none; }
.page-transformer .transformer-check-summary[data-state="fail"] { color:var(--tx-fail); }
.page-transformer .transformer-key-checks { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:12px; }
.page-transformer .transformer-check { padding:18px; }
.page-transformer .transformer-check-head { display:flex; justify-content:space-between; align-items:baseline; gap:8px; flex-wrap:wrap; }
.page-transformer .transformer-check h3 { font:500 16px/1.35 var(--tx-heading); letter-spacing:-.01em; margin:0; color:var(--tx-ink); }
.page-transformer .transformer-check-status { font-size:13px; color:var(--tx-muted); }
.page-transformer .transformer-check[data-status="pass"] .transformer-check-status { color:var(--tx-pass); }
.page-transformer .transformer-check[data-status="fail"] .transformer-check-status { color:var(--tx-fail); }
.page-transformer .transformer-check[data-status="warn"] .transformer-check-status { color:var(--tx-amber); }
.page-transformer .transformer-check[data-status="fail"] { border-color:var(--tx-fail); }
.page-transformer .transformer-check-value { margin:14px 0 3px; font:500 24px/1.2 var(--tx-body); letter-spacing:-.01em; font-variant-numeric:tabular-nums; color:var(--tx-ink); overflow-wrap:anywhere; }
.page-transformer .transformer-check-limit { font-size:13px; color:var(--tx-muted); margin:0; overflow-wrap:anywhere; }
.page-transformer .transformer-notices { margin-bottom:12px; }
.page-transformer .transformer-notices h3 { font:500 16px/1.4 var(--tx-heading); margin:0 0 8px; color:var(--tx-ink); }
.page-transformer .transformer-notices ul { margin:0; padding-left:18px; color:var(--tx-ink); font-size:14px; line-height:1.55; }
.page-transformer .transformer-notices li { margin:4px 0; overflow-wrap:anywhere; }
.page-transformer .transformer-details { border-top:1px solid var(--tx-line); }
.page-transformer .transformer-details > summary { padding:18px 0; cursor:pointer; font:500 16px/1.4 var(--tx-heading); color:var(--tx-ink); }
.page-transformer .transformer-details > summary span { font:400 13px/1.5 var(--tx-body); color:var(--tx-muted); margin-left:14px; }
.page-transformer .vd .vd-tabs { display:flex; flex-wrap:wrap; gap:8px; border-bottom:1px solid var(--tx-line); padding-bottom:12px; margin-bottom:10px; }
.page-transformer .vd .vd-tab { color:var(--tx-ink); font:400 14px var(--tx-body); padding:9px 16px; transition:none; margin:0; cursor:pointer; }
.page-transformer .vd .vd-tab::after { display:none; }
.page-transformer .vd .vd-tabs .ref { font:400 12px var(--tx-body); color:var(--tx-muted); letter-spacing:0; text-transform:none; align-self:center; margin-left:auto; }
.page-transformer .vd .srow { gap:18px; padding:10px 0; border-bottom:1px solid var(--tx-group-edge); }
.page-transformer .vd .srow .lab, .page-transformer .vd .srow .val { font-size:14px; font-weight:400; color:var(--tx-ink); }
.page-transformer .vd .srow .lab { color:var(--tx-muted); }
.page-transformer .vd .srow .lab .ref { font-size:12px; letter-spacing:0; color:var(--tx-muted); }
.page-transformer .vd .srow .val { white-space:normal; text-align:right; }
.page-transformer .vd .srow .val em { font-style:normal; color:var(--tx-muted); font-weight:400; font-size:.9em; margin-left:3px; }
.page-transformer .vd .srow.gov .val { color:var(--tx-ink); font-size:14px; font-weight:700; }
.page-transformer .vd .creason { padding:12px 0; border-bottom:1px solid var(--tx-group-edge); }
.page-transformer .vd .creason .ctag { font:700 13px/1.5 var(--tx-body); letter-spacing:0; text-transform:none; }
.page-transformer .vd .creason.pass .ctag { color:var(--tx-pass); }
.page-transformer .vd .creason.warn .ctag { color:var(--tx-amber); }
.page-transformer .vd .creason.fail .ctag { color:var(--tx-fail); }
.page-transformer .vd .creason .cmsg { font-size:14px; line-height:1.55; color:var(--tx-ink); }
.page-transformer .vd .vd-insight { border:1px solid var(--tx-group-edge); border-left:3px solid var(--tx-accent); background:var(--tx-surface); border-radius:0 12px 12px 0; padding:10px 14px; font-size:14px; line-height:1.55; color:var(--tx-ink); margin:10px 0 14px; overflow-wrap:anywhere; }
.page-transformer .vd .vd-insight code { font-size:13px; }
.page-transformer .vd .vd-insight .tx-formula { font:inherit; font-family:var(--tx-body); white-space:nowrap; }
.page-transformer .vd .vd-insight .muted { color:var(--tx-muted); }
.page-transformer .vd .vd-pane { min-width:0; }
.page-transformer .vd .vd-pane:focus-visible { outline:2px solid var(--tx-accent); outline-offset:4px; border-radius:4px; }
.page-transformer .vd .vd-pane a { color:var(--tx-accent); text-decoration:underline; text-underline-offset:3px; }
.page-transformer .vd .vd-util { margin-top:14px; padding-top:12px; border-top:1px solid var(--tx-line); }
.page-transformer .vd .vd-util .uhead { font:500 14px/1.5 var(--tx-heading); letter-spacing:0; text-transform:none; color:var(--tx-ink); }
.page-transformer .vd .vd-util .ul, .page-transformer .vd .vd-util .uv { font-size:14px; color:var(--tx-ink); }
.page-transformer .vd .vd-util .um { color:var(--tx-muted); }
.page-transformer .vd .vd-util .ubar { background:var(--tx-group-edge); }
.page-transformer .vd .vd-util .ufill { background:var(--tx-accent); }
.page-transformer .vd .vd-util .ufill.over { background:var(--tx-fail); }
/* Wide tables scroll inside a labelled, focusable region; the page never widens. */
.page-transformer .tx-table-scroll { max-width:100%; overflow-x:auto; margin-top:12px; contain:inline-size; }
.page-transformer .tx-table-scroll:focus-visible { outline:2px solid var(--tx-accent); outline-offset:2px; border-radius:4px; }
.page-transformer .tx-taptbl, .page-transformer .tx-asm { width:100%; border-collapse:collapse; font-size:14px; }
.page-transformer .tx-taptbl { min-width:320px; }
.page-transformer .tx-asm { min-width:520px; table-layout:auto; }
.page-transformer .tx-taptbl :is(th,td) { padding:7px 10px; text-align:right; border-bottom:1px solid var(--tx-group-edge); color:var(--tx-ink); }
.page-transformer .tx-taptbl th { font-weight:400; color:var(--tx-muted); }
.page-transformer .tx-taptbl :is(th,td):first-child { text-align:left; }
.page-transformer .tx-taptbl tr.rec td { font-weight:700; background:var(--tx-surface); }
.page-transformer .tx-selected { font-weight:400; font-size:12px; color:var(--tx-muted); margin-left:6px; }
.page-transformer .tx-asm :is(th,td) { padding:7px 8px; border-bottom:1px solid var(--tx-group-edge); vertical-align:top; text-align:left; color:var(--tx-ink); overflow-wrap:anywhere; }
.page-transformer .tx-asm .k { font-weight:700; }
.page-transformer .tx-asm .flag { font-size:12px; color:var(--tx-amber); margin-left:4px; }
.page-transformer .vd .uhead { font:500 15px/1.4 var(--tx-heading); color:var(--tx-ink); margin:16px 0 8px; letter-spacing:0; text-transform:none; }
.page-transformer .tx-audit-list { margin:0; padding-left:18px; font-size:14px; line-height:1.55; }
.page-transformer .tx-audit-versions { font-size:13px; line-height:1.6; color:var(--tx-muted); margin:0; overflow-wrap:anywhere; }
.page-transformer .tx-audit-versions .mono { font-size:12px; }

/* Document */
.page-transformer .vd .vd-docgrid { margin-top:12px; }
.page-transformer .vd .doc-h { text-transform:none; font:500 16px/1.4 var(--tx-heading); letter-spacing:0; color:var(--tx-ink); margin:0 0 12px; }
.page-transformer .vd .vd-notes ol { padding-left:22px; }
.page-transformer .vd .vd-notes li, .page-transformer .vd .vd-refs li { font:400 14px/1.55 var(--tx-body); color:var(--tx-ink); padding:6px 8px; border-radius:8px; overflow-wrap:anywhere; }
.page-transformer .vd .vd-notes li[contenteditable]:focus { background:var(--tx-surface); }
.page-transformer .vd .vd-refs ul { margin:0; padding-left:22px; }
.page-transformer .vd :is(.vd-pdf-btn,.vd-save-btn,.add-btn,.amp-dc-act,.vsp-save,.transformer-document-button), .page-transformer #amp-workspace button {
 font:400 14px/1.4 var(--tx-body)!important; letter-spacing:0!important; text-transform:none!important; border-radius:12px!important; min-height:40px; padding:8px 14px; margin:0; box-shadow:none!important; cursor:pointer;
}
.page-transformer .vd :is(.vd-pdf-btn,.add-btn,.amp-dc-act,.transformer-document-button), .page-transformer #amp-workspace button { color:var(--tx-ink)!important; background:var(--tx-surface)!important; border:1px solid var(--tx-line)!important; }
.page-transformer .vd :is(.vd-save-btn,.vsp-save,#vd-save-do) { background:var(--tx-accent)!important; color:var(--tx-on-accent)!important; border:1px solid var(--tx-accent)!important; }
.page-transformer .vd :is(.vd-save-btn,.vsp-save):hover:not(:disabled) { background:var(--tx-accent-hover)!important; }
.page-transformer .vd :is(button,input,select):disabled { opacity:.55; cursor:not-allowed; }
.page-transformer .transformer-document-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 16px; }
.page-transformer .transformer-document-state { margin-right:auto; font-size:13px; color:var(--tx-muted); }
body.page-transformer:has(#transformer-document-save:not([hidden])) #amp-workspace .aw-working > button { display:none; }
.page-transformer .vd .vd-exports { padding:14px 0; border:0; border-top:1px solid var(--tx-line); border-radius:0; background:transparent; display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; }
.page-transformer .vd .vd-exports .meta, .page-transformer .vd .vd-exports .xlabel { font:400 13px/1.5 var(--tx-body); letter-spacing:0; text-transform:none; color:var(--tx-muted); }
.page-transformer .vd .vd-exports a { color:var(--tx-accent); text-decoration:underline; text-underline-offset:3px; display:inline-flex; align-items:center; min-height:32px; }
.page-transformer .vd :is(.amp-dc-fld input) { min-height:36px; font-weight:400; }
.page-transformer .vd .vd-save-panel { background:var(--tx-surface); color:var(--tx-ink); border:1px solid var(--tx-line); border-radius:18px; box-shadow:0 12px 40px #00000014; max-width:calc(100vw - 48px); }
.page-transformer .vd :is(.vsp-head,.vsp-fld>span,.vsp-msg) { color:var(--tx-muted); letter-spacing:0; text-transform:none; }
.page-transformer .vd :is(.vsp-fld input,.vsp-fld select) { background:var(--tx-surface); color:var(--tx-ink); border-radius:12px; border-color:var(--tx-line); }
.page-transformer .amp-workspace-dialog .amp-dc-sections { display:block!important; }
.page-transformer .amp-workspace-dialog .amp-dc-section { border:0; padding:0; min-width:0; }
.page-transformer .amp-workspace-dialog .amp-dc-section:has(>.amp-dc-grid[hidden]) { display:none; }
.page-transformer .amp-workspace-dialog .amp-dc-section[aria-label="Document details"]::before { display:none; }
.page-transformer .amp-workspace-dialog .amp-dc-grid.g3 { grid-template-columns:minmax(0,1fr); }
.page-transformer .amp-workspace-dialog :is(button,input,select,textarea) { border-radius:12px!important; min-height:44px; }
.page-transformer .amp-workspace-dialog .aw-refresh { border:0!important; background:transparent!important; padding:0; min-height:36px; text-decoration:underline; text-underline-offset:3px; }

/* Section navigation */
.page-transformer .transformer-section-nav { position:sticky; top:calc(var(--tx-header-height,80px) + 8px); z-index:25; display:flex; align-items:center; gap:4px; flex-wrap:wrap; width:fit-content; max-width:100%; box-sizing:border-box; padding:4px; margin:0 0 12px; border:1px solid var(--tx-line); border-radius:14px; background:var(--tx-surface); box-shadow:0 2px 6px rgba(30,45,70,.06); }
.page-transformer .transformer-section-nav a { flex:0 0 auto; white-space:nowrap; overflow-wrap:normal; display:inline-flex; align-items:center; min-height:32px; padding:4px 12px; box-sizing:border-box; text-decoration:none; font-size:13px; border-radius:10px; color:var(--tx-ink); }
.page-transformer .transformer-section-nav a:hover { background:var(--tx-subtle); }
.page-transformer .transformer-nav-result { flex:0 1 auto; min-width:0; font:400 12px/1.4 var(--tx-body); color:var(--tx-muted); padding:0 12px 0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.page-transformer .transformer-nav-result:empty { display:none; }
/* Wide screens: the navigator shares the page-title row, as in the cable reference.
   transformer-workflow.js measures the title text and header controls and sets the
   start/end offsets; higher specificity than the compact-desktop margin rule below. */
@media (min-width:1200px) {
 body.page-transformer .transformer-section-nav.transformer-nav-inline { margin:0 var(--tx-nav-end,420px) calc(-1 * var(--tx-nav-height,42px)) var(--tx-nav-start,300px); max-width:calc(100% - var(--tx-nav-start,300px) - var(--tx-nav-end,420px)); flex-wrap:nowrap; }
 body.page-transformer .transformer-section-nav.transformer-nav-inline a { padding-inline:10px; }
}
.page-transformer .transformer-section-nav.transformer-nav-keyboard { position:static; }
.page-transformer :is(#transformer-inputs,#transformer-analysis,#transformer-document,#transformer-inputs :is(input,select),#adv-panel :is(input,select),#adv-toggle) { scroll-margin-top:calc(var(--tx-header-height,80px) + var(--tx-nav-height,42px) + 24px); }

/* Focus */
.page-transformer :is(main,dialog) :is(a,input,select,textarea,button,summary,[contenteditable],[tabindex]):focus-visible { outline:2px solid var(--tx-accent)!important; outline-offset:3px; }
.page-transformer :is(main,dialog) :is(input,select,textarea,button,a) { transition-duration:100ms!important; }

@media (max-width:1199px) {
 .page-transformer .vd .vd-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .page-transformer .vd .vd-adv-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:1000px) { body.page-transformer header.topbar .nav { display:none; } }
@media (max-width:900px) { .page-transformer .transformer-key-checks { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:800px) {
 .page-transformer .vd .vd-cards, .page-transformer .vd .vd-adv-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .page-transformer .vd .vd-hero { grid-template-columns:1fr; }
 .page-transformer .vd .vd-mini { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
 .page-transformer .vd-stage { padding:16px 16px 32px; }
 .page-transformer .vd .vd-cards, .page-transformer .vd .vd-adv-grid, .page-transformer .tx-chartgrid { grid-template-columns:1fr; }
 .page-transformer .vd .vd-head .hr { width:100%; }
 .page-transformer .vd .vd-head .tag { flex-basis:100%; }
 .page-transformer .vd .vd-tabs .ref { width:100%; padding-top:8px; margin-left:0; }
 .page-transformer .vd .vd-tab { padding:9px 12px; }
 .page-transformer .transformer-key-checks { grid-template-columns:1fr; }
 .page-transformer .transformer-details > summary span { display:block; margin:6px 0 0; }
 .page-transformer .vd .vd-adv-toggle .hint { flex-basis:100%; }
 .page-transformer .transformer-section-nav { width:100%; justify-content:space-between; }
 .page-transformer .transformer-section-nav a { min-height:40px; flex:1; justify-content:center; padding-inline:8px; }
 .page-transformer .transformer-nav-result { flex:1 1 100%; padding:2px 8px 4px; text-align:center; }
 .page-transformer .vd .field input, .page-transformer .vd select.dd { font-size:16px; }
 .page-transformer .transformer-document-state { flex-basis:100%; }
 .page-transformer .vd .srow { flex-wrap:wrap; gap:4px 12px; }
}
@media (max-width:380px) { .page-transformer .vd .vd-mini { grid-template-columns:1fr; } }
@media (pointer:coarse), (max-width:600px) {
 .page-transformer .vd :is(.field,select.dd) { min-height:44px; }
 .page-transformer .vd :is(.vd-pdf-btn,.vd-save-btn,.add-btn,.amp-dc-act,.vsp-save,.transformer-document-button,.vd-tab) { min-height:44px; }
}
/* Compact desktop: keep the primary result in the first view. */
@media (min-width:1000px) and (max-height:900px) {
 .page-transformer .vd-stage { padding-top:12px; }
 .page-transformer .vd-stage .vd-suite.suite-wide { gap:16px; }
 .page-transformer .vd .vd-card { padding:12px; }
 .page-transformer .vd .vd-card .ct { margin-bottom:8px; }
 .page-transformer .vd .vd-head { padding-bottom:8px; }
 .page-transformer .vd .vd-card .vd-fld-grid { gap:6px; }
 .page-transformer .vd .fld-hint { display:none; }
 .page-transformer .transformer-input-foot { display:none; }
 .page-transformer .vd-stage { padding-top:8px; }
 .page-transformer .vd-stage .vd-suite.suite-wide { gap:10px; }
 .page-transformer .transformer-section-nav { margin-bottom:6px; }
 .page-transformer .vd .vd-card { padding:10px 12px; }
 .page-transformer .vd .vd-card .ct { margin-bottom:4px; }
 .page-transformer .vd .vd-card .vd-fld-grid { gap:4px; }
 .page-transformer .vd .vd-fld .fl { margin-bottom:2px; }
 .page-transformer .vd :is(.field,select.dd) { min-height:36px; }
 .page-transformer .vd .field input { padding:6px 0; }
 .page-transformer .vd select.dd { padding-block:6px; }
 .page-transformer .vd .vd-adv { margin-top:8px; }
 .page-transformer .vd .vd-adv-toggle { min-height:40px; padding-block:8px; }
 .page-transformer .vd .vd-hero { padding:12px 16px; }
 .page-transformer .vd .vd-figure { margin:4px 0 2px; }
 .page-transformer .vd .vd-head { padding-bottom:4px; min-height:0; }
}
@media (max-height:500px) { .page-transformer .transformer-section-nav { position:static; } }
@media (prefers-reduced-motion:reduce) {
 .page-transformer *, .page-transformer *::before, .page-transformer *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; }
 /* Match the specificity of the module's own control transition rule so reduced motion wins. */
 .page-transformer :is(main,dialog) :is(input,select,textarea,button,a,summary,[contenteditable],[tabindex]),
 .page-transformer :is(main,dialog,[role=dialog],.mobile-drawer,footer) :is(input,select,textarea,button,a) { transition:none!important; transition-duration:0s!important; animation:none!important; }
}
@media (forced-colors:active) {
 .page-transformer .vd :is(.vd-card,.vd-hero), .page-transformer .transformer-check, .page-transformer .transformer-notices, .page-transformer .transformer-section-nav { border-color:CanvasText; }
 .page-transformer .tx-chart :is(.curve,.axis) { stroke:CanvasText; }
 .page-transformer .tx-chart text { fill:CanvasText; }
}
}
@media print { .transformer-section-nav, .transformer-document-actions, .transformer-review-input { display:none!important; } }
