/* ============================================================
   SentryVolt App Stylesheet - v2.0
   Tools, Power Plan, homepage product sections, ad slots, print.
   Mobile first. Uses the tokens defined in sv-main.css.
   ============================================================ */

/* ─── Light sections: same components, inverted tokens ──────────────────── */
.sv-section-light {
  --sv-text: #0f1b2d;
  --sv-text-sub: #3b4a61;
  --sv-text-muted: #5a6a82;
  --sv-surface: #ffffff;
  --sv-surface-elev: #eef3f9;
  --sv-line: rgba(15, 27, 45, 0.12);
  --sv-line-strong: rgba(15, 27, 45, 0.24);
  --sv-cyan: #0b7fa3;
  background: #f4f7fb;
  color: var(--sv-text);
}
.sv-section-light h2, .sv-section-light h3 { color: var(--sv-text); }
.sv-section-light a:not(.sv-btn-primary) { color: #0a6f90; }

.sv-skip {
  position: absolute; left: 8px; top: -60px; z-index: 200; padding: 10px 14px;
  background: var(--sv-cyan); color: #0b1220; border-radius: var(--sv-radius); font-weight: 600;
}
.sv-skip:focus { top: 8px; color: #0b1220; }

:where(button, input, select, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--sv-cyan);
  outline-offset: 2px;
}

/* ─── Navigation additions ──────────────────────────────────────────────── */
.sv-nav-menu .sv-nav-soon { opacity: 0.6; }
@media (max-width: 767px) {
  .sv-nav-menu li a { min-height: 44px; display: flex; align-items: center; }
  .sv-hamburger { width: 44px; height: 44px; padding: 10px; }
  .sv-nav-links .sv-nav-cta-mobile { display: flex; margin-top: var(--sv-sm); }
}
@media (min-width: 768px) { .sv-nav-links .sv-nav-cta-mobile { display: none; } }

/* ─── Homepage hero ─────────────────────────────────────────────────────── */
.sv-hero { min-height: 0; padding-block: var(--sv-lg) var(--sv-lg); }
@media (min-width: 1024px) { .sv-hero { padding-block: 72px 64px; } }
.sv-hero-grid { display: grid; gap: var(--sv-lg); align-items: start; position: relative; z-index: 1; }
.sv-hero-grid > * { min-width: 0; }
.sv-hero-content { max-width: none; }
@media (min-width: 1024px) { .sv-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); } }
.sv-hero-title { font-size: clamp(2.1rem, 5.2vw, 3.5rem); }
.sv-hero-points {
  display: grid; gap: 10px 20px; grid-template-columns: 1fr 1fr; margin-top: var(--sv-md);
  color: var(--sv-text-sub); font-size: 0.9rem; max-width: 520px;
}
.sv-hero-points li { display: flex; gap: 8px; align-items: flex-start; }
.sv-hero-points svg { flex: none; color: var(--sv-volt); margin-top: 2px; }
.sv-hero-glow { opacity: 0.7; }

.sv-eyebrow-line {
  font-family: var(--font-heading); font-weight: 600; font-size: 0.78rem; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--sv-cyan); margin-bottom: var(--sv-sm);
}

/* ─── Generic grids used on the homepage and tool directory ─────────────── */
.sv-grid { display: grid; gap: var(--sv-md); grid-template-columns: 1fr; }
@media (min-width: 640px) { .sv-grid-2, .sv-grid-3, .sv-grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
  .sv-grid-3 { grid-template-columns: repeat(3, 1fr); }
  .sv-grid-4 { grid-template-columns: repeat(4, 1fr); }
}
.sv-section-header-left { text-align: left; }
.sv-section-header-left .sv-section-sub { margin-inline: 0; }

.sv-tile {
  display: flex; flex-direction: column; gap: 8px; padding: var(--sv-md);
  background: var(--sv-surface); border: 1px solid var(--sv-line); border-radius: var(--sv-radius-card);
  color: var(--sv-text); text-decoration: none; position: relative;
  transition: border-color var(--sv-transition), transform var(--sv-transition);
}
a.sv-tile:hover { border-color: var(--sv-cyan); transform: translateY(-2px); color: var(--sv-text); }
.sv-tile h3 { font-size: 1.05rem; }
.sv-tile p { font-size: 0.9rem; color: var(--sv-text-sub); line-height: 1.55; }
.sv-tile-icon {
  width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px;
  background: rgba(63, 210, 242, 0.1); color: var(--sv-cyan); margin-bottom: 4px;
}
.sv-tile-go { margin-top: auto; padding-top: 8px; font-family: var(--font-heading); font-weight: 600; font-size: 0.85rem; color: var(--sv-cyan); }
.sv-tile-q { font-family: var(--font-heading); font-weight: 600; font-size: 1.05rem; line-height: 1.3; }
.sv-tile-soon { opacity: 0.75; border-style: dashed; }
.sv-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.sv-tag {
  font-size: 0.7rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 999px; border: 1px solid var(--sv-line-strong); color: var(--sv-text-muted);
}
.sv-tag-soon { color: var(--sv-warn); border-color: rgba(255, 181, 71, 0.4); }

.sv-steps4 { counter-reset: step; }
.sv-steps4 .sv-tile::before {
  counter-increment: step; content: counter(step);
  width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%;
  background: var(--sv-cyan); color: #fff; font-family: var(--font-heading); font-weight: 700;
}

.sv-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--sv-md); }
.sv-filter button {
  min-height: 40px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--sv-line-strong);
  color: var(--sv-text-sub); font-size: 0.88rem; font-weight: 500;
}
.sv-filter button[aria-pressed="true"] { background: var(--sv-cyan); border-color: var(--sv-cyan); color: #0b1220; font-weight: 600; }

.sv-final-cta { text-align: center; padding-block: var(--sv-xl); }
.sv-final-cta h2 { max-width: 760px; margin-inline: auto; margin-bottom: var(--sv-md); }

/* ─── Ad slots ──────────────────────────────────────────────────────────────
   Space is reserved up front so nothing shifts when an ad loads. Always
   labeled, always visually separate from SentryVolt content. */
.sv-ad { margin: var(--sv-lg) auto; max-width: 970px; padding-inline: var(--sv-margin-mobile); }
.sv-ad-label {
  display: block; text-align: center; font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--sv-text-muted); margin-bottom: 6px;
}
.sv-ad-frame {
  width: 100%; max-width: 320px; min-height: 100px; margin-inline: auto; display: grid; place-items: center;
  border: 1px dashed var(--sv-line-strong); border-radius: var(--sv-radius);
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(160, 185, 220, 0.04) 10px 20px);
  color: var(--sv-text-muted); font-size: 0.75rem; overflow: hidden;
}
@media (min-width: 768px) { .sv-ad-frame { max-width: 728px; min-height: 90px; } }
@media (min-width: 1024px) { .sv-ad-leaderboard .sv-ad-frame { max-width: 970px; } }
.sv-ad-rect .sv-ad-frame { max-width: 336px; min-height: 280px; }

/* ─── App shell ─────────────────────────────────────────────────────────── */
.sv-app-hero { padding-block: var(--sv-lg) var(--sv-md); border-bottom: 1px solid var(--sv-line); }
.sv-app-hero .sv-page-hero-sub { max-width: 720px; }
.sv-app-section { padding-block: var(--sv-md) var(--sv-lg); }
.sva-root { min-height: 420px; }

/* Home Energy Workspace: an application surface independent of tool / wizard styles. */
.sv-app-section:has([data-sv-tool="power-plan"]) > .sv-container { max-width: 1560px; padding-inline: 24px; }
.svw-app,.svw-welcome,.svw-editor { --w-bg:#0e1928; --w-panel:#142132; --w-line:#2b3d50; --w-text:#edf3f8; --w-muted:#a8b9c9; --w-accent:#51d8d0; color:var(--w-text); font-family:Geist,system-ui,sans-serif; font-size:14px; line-height:1.5; }
.svw-app *,.svw-welcome *,.svw-editor * { box-sizing:border-box; }
.svw-app { background:var(--w-bg); border:1px solid var(--w-line); border-radius:10px; overflow:hidden; scroll-margin-top:calc(var(--sv-nav-height,0px) + 12px); }
.svw-app h2,.svw-app h3,.svw-app h4,.svw-welcome h2,.svw-welcome h3,.svw-editor h2 { color:var(--w-text); font-family:Geist,system-ui,sans-serif; letter-spacing:-.025em; margin:0; }
.svw-app h2 { font-size:25px; font-weight:600; }
.svw-app h3 { font-size:16px; font-weight:600; margin-bottom:16px; }
.svw-app h4 { font-size:14px; margin-bottom:8px; }
.svw-app p { margin:8px 0 14px; }
.svw-app button,.svw-welcome button,.svw-editor button { font:inherit; cursor:pointer; }
.svw-app button:focus-visible,.svw-welcome :focus-visible,.svw-editor :focus-visible,.svw-app a:focus-visible,.svw-app input:focus-visible,.svw-app select:focus-visible,.svw-app summary:focus-visible { outline:2px solid var(--w-accent); outline-offset:3px; }
.svw-app-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 24px; border-bottom:1px solid var(--w-line); background:#101d2c; }
.svw-app-brand,.svw-header-actions,.svw-toolbar,.svw-home-summary,.svw-preset-bar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.svw-app-brand { font-size:14px; gap:14px; }
.svw-app-brand svg { color:var(--w-accent); }
.svw-app-brand strong { font-size:17px; }
.svw-app-brand > span { color:var(--w-muted); }
.svw-save-state { font-size:11px; color:var(--w-muted); margin-right:10px; }
.svw-btn { min-height:38px; border:1px solid var(--w-line); background:#192b3f; color:var(--w-text); padding:8px 13px; border-radius:5px; line-height:1.3; text-align:center; }
.svw-btn:hover { border-color:var(--w-accent); background:#20384c; }
.svw-btn.primary { background:var(--w-accent); color:#082527; border-color:var(--w-accent); font-weight:600; }
.svw-btn.quiet { background:transparent; color:var(--w-accent); border-color:transparent; padding-inline:4px; }
.svw-btn:disabled { opacity:.4; cursor:default; }
.svw-btn[aria-pressed="true"] { background:#214643; color:#a5f7eb; border-color:var(--w-accent); }
.svw-nav { display:flex; gap:4px; padding:0 18px; border-bottom:1px solid var(--w-line); background:#101d2c; }
.svw-nav > button { display:flex; gap:8px; align-items:center; color:var(--w-muted); padding:15px 16px; background:none; border:0; border-bottom:2px solid transparent; font-size:13px; }
.svw-nav > button:hover { color:var(--w-text); background:#192b3f; }
.svw-nav > button[aria-current="page"] { color:var(--w-accent); border-bottom-color:var(--w-accent); }
.svw-scenario-label { margin-left:auto; align-self:center; font-size:11px; color:var(--w-muted); max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.svw-status { color:var(--w-accent); background:#112631; padding:8px 24px; min-height:36px; font-size:12px; border-bottom:1px solid var(--w-line); }
.svw-body { display:grid; grid-template-columns:minmax(0,1fr) 290px; }
.svw-main { min-width:0; padding:24px; max-height:850px; overflow:auto; scrollbar-color:#40586b transparent; }
.svw-main > div > .svw-panel,.svw-main > div > .svw-live,.svw-main > div > .svw-two { margin-top:18px; }
.svw-view-head { display:flex; justify-content:space-between; align-items:start; gap:18px; margin-bottom:18px; }
.svw-view-head p { font-size:13px; color:var(--w-muted); margin-bottom:0; max-width:540px; }
.svw-home-summary { margin:16px 0 20px; }
.svw-home-summary .svw-btn { font-size:12px; }
.svw-panel { padding:20px; background:var(--w-panel); border:1px solid var(--w-line); border-radius:6px; min-width:0; }
.svw-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.svw-overview-canvas { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:16px; margin-top:18px; }.svw-overview-canvas .svw-quickloads { grid-template-columns:1fr; }.svw-overview-canvas .svw-network { gap:25px 14px; min-height:265px; }.svw-overview-canvas .svw-flow-node { padding:10px 5px; }.svw-overview-canvas .svw-home-node strong { font-size:15px; }.svw-overview-canvas .svw-home-node span { font-size:11px; }.svw-overview-canvas .svw-home-node small { font-size:9px; }
.svw-backup-workbench { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }.svw-builder-controls>.svw-panel+.svw-panel,.svw-builder-feedback>.svw-live+.svw-live { margin-top:16px; }.svw-builder-feedback { position:sticky; top:0; }.svw-builder-feedback .svw-quickloads { grid-template-columns:1fr; }.svw-builder-controls .svw-bank { max-height:190px; overflow:auto; }.svw-builder-controls .svw-mini-stats { grid-template-columns:1fr; }.svw-builder-controls .svw-mini-stat { display:flex; justify-content:space-between; align-items:center; }
.svw-panel-foot { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:15px; }
.svw-caption { color:var(--w-muted); font-size:11px; line-height:1.6; }
.svw-badge { font-size:10px; color:var(--w-muted); letter-spacing:.02em; display:inline-block; }
.svw-link { color:var(--w-accent); display:inline-block; text-decoration:none; background:none; border:0; font:inherit; font-size:12px; padding:8px 0; margin-right:16px; }
.svw-link:hover { text-decoration:underline; }
.svw-sample-notice { display:flex; justify-content:space-between; align-items:center; font-size:11px; color:var(--w-muted); border-bottom:1px solid var(--w-line); margin-bottom:20px; padding-bottom:8px; }
.svw-segment { display:flex; gap:3px; border:1px solid var(--w-line); padding:3px; border-radius:5px; width:max-content; }
.svw-segment button { background:none; color:var(--w-muted); border:0; padding:6px 12px; border-radius:3px; font-size:12px; }
.svw-segment button[aria-pressed="true"] { background:#284146; color:#9af4e8; }
.svw-network { position:relative; display:grid; grid-template-columns:1fr 1.3fr 1fr; grid-template-rows:1fr 1fr; gap:40px 50px; padding:25px 0; min-height:270px; background-image:radial-gradient(#25394a .7px,transparent .7px); background-size:16px 16px; margin:14px 0; }
.svw-flow-lines { position:absolute; inset:0; pointer-events:none; }
.svw-flow-lines > svg,.svw-flow-lines svg svg { width:100%; height:100%; }
.svw-flow-lines path { stroke:#34485a; fill:none; stroke-width:2; }
.svw-flow-lines path.active { stroke:#4fcbbb; stroke-dasharray:8 6; animation:svw-energy 4s linear infinite; }
.svw-flow-node,.svw-home-node { position:relative; z-index:1; background:#132232; color:var(--w-muted); border:1px solid #34485a; border-radius:6px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:12px 8px; }
.svw-flow-node:hover,.svw-home-node:hover { border-color:var(--w-accent); }
.svw-flow-node strong { font-size:12px; color:var(--w-text); }
.svw-flow-node span { font-size:11px; }
.svw-flow-node.is-powered,.svw-home-node.is-powered { border-color:#479790; }
.svw-flow-node.is-powered svg,.svw-home-node.is-powered svg { color:var(--w-accent); }
.svw-home-node.is-limited { border-color:#eeb581; }.svw-home-node.is-limited svg,.svw-home-node.is-limited small { color:#eeb581; }
.svw-flow-node.grid { grid-area:1/1; }.svw-flow-node.solar { grid-area:2/1; }.svw-flow-node.battery { grid-area:1/3; }.svw-flow-node.generator { grid-area:2/3; }
.svw-home-node { grid-area:1/2/3/3; align-self:center; min-height:140px; }
.svw-home-node strong { color:var(--w-text); font-size:18px; }.svw-home-node span { font-size:13px; }.svw-home-node small { font-size:10px; }
.svw-sim-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:5px; margin-bottom:18px; }
.svw-runtime { font-size:24px; font-variant-numeric:tabular-nums; color:var(--w-text); }
.svw-chart { display:flex; height:145px; gap:10px; }
.svw-chart-labels { display:flex; flex-direction:column; justify-content:space-between; font-size:10px; color:var(--w-muted); padding:12px 0; }
.svw-chart-plot { flex:1; min-width:0; }
.svw-chart-plot svg { width:100%; height:100%; }
.svw-chart-plot .gridline { stroke:#314658; stroke-width:1; fill:none; stroke-dasharray:3 3; }
.svw-chart-plot .soc-line { stroke:var(--w-accent); fill:none; stroke-width:2; vector-effect:non-scaling-stroke; }
.svw-chart-plot .soc-area { fill:#51d8d021; }
.svw-axis { display:flex; justify-content:space-between; font-size:10px; color:var(--w-muted); margin:8px 0 16px; }
.svw-coverage-row { display:flex; gap:12px; align-items:center; font-size:10px; color:var(--w-muted); margin:10px 0; }
.svw-coverage-row > span { width:45px; }.svw-coverage { height:7px; flex:1; background:#2a394b; border-radius:2px; overflow:hidden; }
.svw-coverage > span { display:block; height:100%; background:#51cbbd; transition:width .25s; }.svw-coverage.fuel > span { background:#d6b777; }
.svw-budget-numbers,.svw-mini-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:15px 0; }
.svw-budget-numbers strong,.svw-mini-stat strong { display:block; font-size:18px; font-variant-numeric:tabular-nums; }.svw-budget-numbers small,.svw-mini-stat small { color:var(--w-muted); font-size:11px; }
.svw-budget-bar { height:10px; background:#2a394b; overflow:hidden; border-radius:3px; margin-block:22px; }.svw-budget-bar span { display:block; height:100%; background:var(--w-accent); transition:width .25s; }.svw-budget-bar.is-over span { background:#eeb581; }
.svw-quickloads { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.svw-quickloads button { display:grid; grid-template-columns:8px 1fr auto; align-items:center; gap:6px 10px; padding:12px; background:#101e2d; border:1px solid var(--w-line); color:var(--w-muted); text-align:left; border-radius:4px; min-height:62px; font-size:12px; }
.svw-quickloads small { grid-area:2/2; font-size:10px; }.svw-quickloads b { grid-area:1/3/3/4; font-size:10px; }
.svw-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#617186; }.svw-quickloads .is-on { border-color:#467b75; color:#e4f5f1; background:#19332f; }.svw-quickloads .is-on .svw-dot,.svw-aside-title .svw-dot { background:var(--w-accent); }
.svw-insights { background:#101d2b; border-left:1px solid var(--w-line); padding:24px 20px; max-height:850px; overflow:auto; }
.svw-aside-title { display:flex; align-items:center; gap:8px; margin-bottom:14px; }.svw-aside-title h2 { font-size:14px; }
.svw-live-stat { padding:12px 0; border-bottom:1px solid var(--w-line); }.svw-live-stat > span { display:block; font-size:11px; color:var(--w-muted); }.svw-live-stat > strong { display:block; font-size:22px; font-variant-numeric:tabular-nums; letter-spacing:-.03em; }.svw-live-stat > small { color:var(--w-muted); font-size:10px; }.svw-live-stat .sva-explain { padding:0; margin-top:8px; border:0; font-size:10px; }.svw-live-stat .sva-explain summary { font-size:10px; }
.svw-limiter { margin:22px 0; border-left:2px solid #eeb581; padding:0 0 0 12px; }.svw-limiter.is-ok { border-color:var(--w-accent); }.svw-limiter small { font-size:9px; letter-spacing:.08em; color:var(--w-muted); }.svw-limiter strong { display:block; font-size:15px; margin-top:4px; }.svw-limiter p { color:var(--w-muted); font-size:12px; }.svw-limiter .svw-btn { font-size:11px; }
.svw-insight-list h3 { font-size:12px; }.svw-insight-list p { font-size:12px; color:var(--w-muted); border-top:1px solid var(--w-line); padding-top:14px; }
.svw-confidence { font-size:12px; border-top:1px solid var(--w-line); padding-top:16px; }.svw-confidence summary { cursor:pointer; color:var(--w-accent); }
.svw-current-fit { margin:20px 0; padding:15px 0; border-block:1px solid var(--w-line); }.svw-current-fit small { font-size:9px; color:var(--w-muted); letter-spacing:.08em; }.svw-current-fit strong { display:block; margin-top:6px; font-size:14px; }.svw-current-fit .svw-btn { font-size:11px; }.svw-mobile-details { display:none; }
.svw-goal-control { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:20px 0; }.svw-goal-control > span { font-size:12px; color:var(--w-muted); margin-right:10px; }
.svw-bank { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }.svw-battery-module { display:flex; flex-direction:column; gap:6px; align-items:center; padding:16px 12px; border:1px solid #487e77; border-radius:6px; background:#183330; min-width:105px; }.svw-battery-module svg { color:var(--w-accent); }.svw-battery-module small { color:var(--w-muted); font-size:10px; }
.svw-range-control { padding:18px 0; border-bottom:1px solid var(--w-line); }.svw-control-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }.svw-control-head label { font-size:13px; }.svw-control-head strong { color:var(--w-accent); font-variant-numeric:tabular-nums; }
.svw-range-control input { width:100%; min-height:30px; accent-color:var(--w-accent); cursor:pointer; }.svw-range-control p { margin-bottom:0; }
.svw-inline-field { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:12px 0; font-size:12px; }
.svw-app select,.svw-app input[type="number"],.svw-field input,.svw-field select { background:#0f1c2b; border:1px solid #40556a; border-radius:4px; padding:10px 12px; color:var(--w-text); min-height:44px; font:inherit; width:100%; }
.svw-inline-field select,.svw-inline-field input { width:auto!important; max-width:100%; }
.svw-empty { padding:18px 0; color:var(--w-muted); }.svw-empty svg { color:var(--w-accent); }
.svw-check { display:flex; gap:10px; align-items:center; font-size:12px; margin:16px 0; cursor:pointer; }.svw-check input { accent-color:var(--w-accent); width:18px; height:18px; }
.svw-load-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 0; border-top:1px solid var(--w-line); }.svw-load-info { min-width:0; }.svw-load-info strong { display:block; font-size:13px; }.svw-load-info small { display:block; font-size:11px; color:var(--w-muted); margin:3px 0; }.svw-load-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.svw-toggle { display:flex; align-items:center; gap:8px; border:1px solid var(--w-line); border-radius:4px; padding:9px; background:#101d2b; color:var(--w-muted); font-size:11px!important; min-height:40px; min-width:112px; }.svw-toggle[aria-pressed="true"] { color:#a2f2df; background:#1b3933; border-color:#3f8273; }
.svw-icon-btn { display:grid; place-items:center; background:none; border:0; color:var(--w-muted); width:36px; height:40px; }.svw-icon-btn:hover { color:#eeb581; }
.svw-preset-bar { margin:18px 0; }.svw-preset-bar .svw-link { margin-left:auto; }
.svw-solar-bars { display:flex; align-items:end; gap:3px; height:160px; border-bottom:1px solid var(--w-line); margin-top:26px; }.svw-solar-hour { display:flex; align-items:end; width:calc(100% / 24); height:100%; gap:1px; }.svw-solar-hour span { width:50%; min-height:1px; background:var(--w-accent); }.svw-solar-hour .usage { background:#60758b; }
.svw-whatifs { display:flex; flex-wrap:wrap; gap:8px; margin:15px 0; }
.svw-scenario-strip { display:flex; gap:12px; overflow:auto; padding:5px 0 16px; scroll-snap-type:x proximity; }.svw-scenario { min-width:180px; border:1px solid var(--w-line); border-radius:5px; background:var(--w-panel); scroll-snap-align:start; }.svw-scenario.is-active { border-color:var(--w-accent); }.svw-scenario > button { background:none; border:0; color:var(--w-text); display:flex; flex-direction:column; gap:7px; align-items:start; padding:16px; width:100%; text-align:left; }.svw-scenario > button small { color:var(--w-muted); font-size:10px; }.svw-scenario .svw-toolbar { padding:0 16px 10px; font-size:11px; }
.svw-comparison { overflow:auto; }.svw-comparison table { border-collapse:collapse; width:100%; font-size:12px; }.svw-comparison th,.svw-comparison td { text-align:left; padding:13px; border-bottom:1px solid var(--w-line); min-width:160px; vertical-align:top; }.svw-comparison thead th { color:var(--w-accent); background:#10202d; }.svw-comparison tbody th { color:var(--w-muted); font-weight:400; position:sticky; left:0; background:var(--w-panel); }.svw-comparison td.is-different { background:#173332; color:#a5eadb; }
.svw-recommendation { font-size:24px!important; margin:10px 0!important; }.svw-reasons { list-style:none; padding:0; }.svw-reasons li { display:flex; align-items:start; gap:10px; margin:12px 0; font-size:13px; }.svw-reasons svg { color:var(--w-accent); flex-shrink:0; margin-top:2px; }.svw-panel li { margin-bottom:9px; }.svw-panel ul,.svw-panel ol { padding-left:20px; }
.svw-welcome { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--w-line); background:var(--w-bg); border-radius:10px; overflow:hidden; }.svw-start-copy { padding:52px 44px; background-image:radial-gradient(#294051 .7px,transparent .7px); background-size:20px 20px; }.svw-eyebrow { color:var(--w-accent); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }.svw-start-copy h2 { font-size:clamp(26px,3vw,42px); line-height:1.2; margin:28px 0 20px; max-width:400px; }.svw-start-copy > p { color:var(--w-muted); margin-bottom:30px; max-width:350px; }.svw-start-copy > small { display:block; color:var(--w-muted); font-size:12px; max-width:300px; margin-top:18px; }.svw-start-form { padding:36px; border-left:1px solid var(--w-line); background:var(--w-panel); }.svw-start-form h3 { font-size:20px; }.svw-start-goals { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:20px 0; }.svw-start-goals label { position:relative; cursor:pointer; }.svw-start-goals input { position:absolute; opacity:0; }.svw-start-goals span { display:block; padding:12px; border:1px solid var(--w-line); border-radius:4px; font-size:12px; }.svw-start-goals input:checked+span { color:#a2f2df; border-color:var(--w-accent); background:#183b34; }.svw-start-goals input:focus-visible+span { outline:2px solid var(--w-accent); outline-offset:3px; }
.svw-field { display:flex; flex-direction:column; gap:7px; margin:16px 0; font-size:12px; }.svw-welcome .svw-two { gap:12px; }.svw-start-form .svw-btn.primary { width:100%; margin-top:16px; }
.svw-editor { width:min(560px,calc(100% - 32px)); max-height:calc(100dvh - 48px); overflow:auto; padding:0; border:1px solid var(--w-line); border-radius:8px; background:var(--w-panel); box-shadow:0 24px 80px #0008; }.svw-editor::backdrop { background:#0009; }.svw-editor-form { padding:24px; }.svw-editor header { display:flex; align-items:center; justify-content:space-between; position:sticky; top:-24px; background:var(--w-panel); padding:10px 0; border-bottom:1px solid var(--w-line); z-index:1; }.svw-editor h2 { font-size:20px; }.svw-editor header button { color:var(--w-muted); background:none; border:0; font-size:26px; min-width:44px; min-height:44px; }.svw-editor footer { display:flex; justify-content:end; gap:10px; margin-top:24px; }.svw-error { color:#f5b697; font-size:12px; }.svw-error:empty { display:none; }
@keyframes svw-energy { to { stroke-dashoffset:-28; } }
@media(min-width:1600px) { .svw-main,.svw-insights { max-height:900px; } }
@media(max-width:1100px) { .svw-body { grid-template-columns:minmax(0,1fr) 245px; }.svw-main { padding:18px; }.svw-panel { padding:16px; }.svw-network { column-gap:24px; }.svw-nav>button { padding-inline:10px; }.svw-scenario-label { display:none; }.svw-two,.svw-overview-canvas,.svw-backup-workbench { grid-template-columns:1fr; }.svw-builder-feedback { position:static; }.svw-welcome .svw-two { grid-template-columns:1fr 1fr; }.svw-load-row { flex-wrap:wrap; }.svw-load-actions { width:100%; justify-content:end; } }
@media(max-width:700px) {
  .sv-app-section:has([data-sv-tool="power-plan"]) { padding-block:8px; }.sv-app-section:has([data-sv-tool="power-plan"])>.sv-container { padding-inline:8px; }
  .svw-app { border-radius:6px; display:flex; flex-direction:column; }.svw-app-header { padding:12px; flex-wrap:wrap; gap:8px; }.svw-app-brand { font-size:12px; gap:8px; }.svw-app-brand strong { font-size:15px; }.svw-header-actions { margin-left:auto; gap:5px; }.svw-header-actions .svw-btn { min-height:34px; padding:6px 9px; font-size:11px; }.svw-save-state { display:none; }
  .svw-nav { position:fixed; bottom:0; left:0; right:0; padding:3px 5px max(3px,env(safe-area-inset-bottom)); z-index:30; justify-content:space-around; background:#101d2bf5; border-top:1px solid var(--w-line); }.svw-nav>button { flex-direction:column; gap:3px; padding:9px 6px; font-size:9px; flex:1; }.svw-nav>button svg { width:18px; height:18px; }.svw-nav>button[aria-current="page"] { border-top:2px solid var(--w-accent); border-bottom:0; }
  .svw-status { padding:6px 12px; font-size:10px; min-height:29px; }.svw-body { display:flex; flex-direction:column; }.svw-main { padding:14px; max-height:calc(100dvh - 280px); min-height:380px; overflow:auto; padding-bottom:30px; }.svw-view-head { flex-wrap:wrap; gap:10px; }.svw-view-head h2 { font-size:23px; }.svw-view-head p { font-size:12px; }.svw-main>div>.svw-panel,.svw-main>div>.svw-live,.svw-main>div>.svw-two { margin-top:14px; }
  .svw-insights { order:-1; padding:8px 12px; border-left:0; border-bottom:1px solid var(--w-line); max-height:none; overflow:visible; }.svw-insights>.svw-aside-title,.svw-insights>.svw-live-stat,.svw-insights>.svw-limiter,.svw-insights>.svw-insight-list,.svw-insights>.svw-confidence,.svw-insights>.svw-current-fit { display:none; }.svw-mobile-metrics { display:grid; grid-template-columns:1fr 1fr 1.15fr; gap:8px; }.svw-live-stat { border:0; padding:0; min-width:0; }.svw-live-stat>span { font-size:9px; }.svw-live-stat>strong { font-size:14px; }.svw-live-stat>small { display:none; }.svw-live-stat .sva-explain { display:none; }
  .svw-mobile-details { display:block; font-size:10px; margin-top:6px; max-height:190px; overflow:auto; }.svw-mobile-details summary { color:var(--w-accent); cursor:pointer; }.svw-mobile-details p { font-size:11px; color:var(--w-muted); border-top:1px solid var(--w-line); padding-top:8px; }
  .svw-network { min-height:250px; gap:35px 12px; }.svw-flow-node strong { font-size:10px; }.svw-flow-node span { font-size:9px; }.svw-flow-node,.svw-home-node { padding:10px 4px; }.svw-home-node strong { font-size:15px; }.svw-home-node span { font-size:11px; }.svw-home-node small { font-size:9px; }.svw-home-node { min-height:125px; }.svw-flow-node svg { width:20px; }
  .svw-home-summary { gap:6px; }.svw-home-summary .svw-btn { font-size:10px; padding:7px; }.svw-panel { padding:14px; }.svw-panel h3 { font-size:14px; }.svw-runtime { font-size:21px; }.svw-quickloads { grid-template-columns:1fr; }.svw-budget-numbers strong,.svw-mini-stat strong { font-size:16px; }.svw-mini-stats { gap:8px; }.svw-mini-stat small { font-size:10px; }
  .svw-overview-canvas { display:flex; flex-direction:column; }.svw-overview-canvas>.svw-panel { order:-1; }.svw-overview-canvas .svw-quickloads { grid-template-columns:repeat(2,minmax(0,1fr)); }.svw-overview-canvas .svw-quickloads button { padding:9px; font-size:10px; gap:5px; min-height:72px; }.svw-overview-canvas .svw-quickloads b { font-size:9px; }.svw-overview-canvas .svw-panel-foot .svw-btn { font-size:10px; }.svw-overview-canvas .svw-network { min-height:250px; }
  .svw-load-actions { gap:8px; }.svw-load-row { gap:8px; }.svw-load-info strong { font-size:13px; }.svw-load-info small { font-size:10px; }.svw-toggle { margin-right:auto; }.svw-comparison th,.svw-comparison td { min-width:145px; padding:12px 10px; }.svw-whatifs .svw-btn { font-size:11px; }.svw-goal-control .svw-btn { font-size:11px; padding:8px 10px; }.svw-sample-notice { margin-bottom:14px; }
  .svw-welcome { display:flex; flex-direction:column; }.svw-start-copy { padding:26px 24px; }.svw-start-copy h2 { margin:20px 0; font-size:30px; }.svw-start-form { padding:24px; border-left:0; border-top:1px solid var(--w-line); }.svw-welcome .svw-two { grid-template-columns:1fr; gap:0; }.svw-start-copy>p { margin-bottom:20px; }
  .svw-editor { width:100%; max-width:100%; max-height:90dvh; margin:auto 0 0; border-radius:12px 12px 0 0; }.svw-editor-form { padding:20px; }.svw-editor footer { position:sticky; bottom:-20px; background:var(--w-panel); padding:16px 0; }
  body:has(.svw-app) { padding-bottom:70px; }
}
@media(prefers-reduced-motion:reduce) { .svw-app * { animation:none!important; transition:none!important; } }
/* Screen-fit layout reserves the site navigation and scrolls only work panels. */
.svw-help-button { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; min-width:32px; padding:0; border:1px solid #40556a; border-radius:50%; background:transparent; color:var(--w-accent); font-size:12px!important; margin-left:6px; vertical-align:middle; }
.svw-metric-label { display:flex; align-items:center; justify-content:space-between; gap:4px; }
.svw-mini-stat small,.svw-panel>h3 { display:flex; align-items:center; gap:4px; }
.svw-help .svw-editor-form>p { margin:16px 0; }.svw-help h3 { font-size:14px; margin:20px 0 8px; }.svw-help-section details { border-top:1px solid var(--w-line); }.svw-help summary { cursor:pointer; padding:12px 0; min-height:44px; }.svw-help details p { color:var(--w-muted); }.svw-help.is-context { max-width:420px; max-height:min(65dvh,370px); }
.svw-welcome-sheet h3 { font-size:19px; margin-top:20px; }.svw-welcome-actions { display:grid; gap:10px; margin-top:24px; }.svw-welcome-sheet .svw-link { display:block; margin-top:18px; }
.svw-welcome-sheet,.svw-help:not(.is-context) { margin:auto; }
.svw-tutorial { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:12px 24px; background:#122f3a; border-bottom:1px solid #51d8d0; max-height:30dvh; overflow:auto; flex-shrink:0; }
.svw-tutorial[hidden] { display:none; }.svw-tutorial h3 { font-size:16px; margin:2px 0!important; }.svw-tutorial p { font-size:12px; margin:4px 0!important; max-width:760px; }.svw-tutorial small { font-size:9px; color:#b4d7df; }.svw-tutorial-actions { display:flex; flex-shrink:0; align-items:center; flex-wrap:wrap; gap:8px; max-width:340px; }.svw-tutorial .svw-btn { min-height:44px; }.svw-tutorial-change { display:flex; flex-wrap:wrap; gap:4px 14px; font-size:11px; }.svw-tutorial-change>strong { width:100%; }.svw-tutorial-change>small { width:100%; }.is-tutorial-target { outline:2px solid #51d8d0!important; outline-offset:3px; }
.svw-human-insight { color:var(--w-text); font-size:13px; }
.sv-learn-page .sv-container { max-width:1120px; }.sv-learn-page .sv-section h2 { margin:30px 0 18px; }.sv-learn-page p { margin:12px 0; max-width:850px; color:var(--sv-text-sub); }.sv-learn-page h3 { font-size:20px; }.sv-learn-model,.sv-learn-compare { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:24px 0; }.sv-learn-model { grid-template-columns:1fr 32px 1fr; align-items:center; }.sv-learn-model>div,.sv-learn-compare>section { border:1px solid var(--sv-line); padding:24px; border-radius:8px; background:var(--sv-surface); }.sv-learn-model>span { color:var(--sv-cyan); font-size:28px; }.sv-learn-number { font-size:36px; font-weight:600; color:var(--sv-cyan)!important; }.sv-learn-number small { font-size:16px; }.sv-learn-bar { height:12px; background:#26394b; border-radius:4px; overflow:hidden; }.sv-learn-bar span { display:block; height:100%; background:var(--sv-cyan); }.sv-learn-questions,.sv-learn-steps { padding-left:24px; }.sv-learn-questions li { margin:10px 0; }.sv-learn-steps li { padding:8px 0; }
@media(max-width:700px) {
  .svw-help-button { width:44px; height:44px; min-width:44px; }.svw-mobile-metrics .svw-help-button { margin-left:0; }.svw-live-stat>span.svw-metric-label { font-size:9px; }.svw-help.is-context { left:0!important; top:auto!important; margin:auto 0 0!important; max-width:100%; max-height:80dvh; }.svw-help footer { padding-bottom:max(16px,env(safe-area-inset-bottom)); }
  .svw-welcome-sheet,.svw-help:not(.is-context) { margin:auto 0 0; }.svw-editor-form { padding-bottom:max(20px,env(safe-area-inset-bottom)); }
  .svw-tutorial { flex-direction:column; align-items:stretch; gap:5px; padding:8px 12px; max-height:30dvh; }.svw-tutorial h3 { font-size:14px; }.svw-tutorial p { font-size:11px; }.svw-tutorial-actions { max-width:none; gap:6px; }.svw-tutorial .svw-btn { padding:6px 10px; font-size:11px; }.svw-tutorial-copy>small { font-size:8px; }.svw-header-actions .svw-btn { min-height:44px; }.svw-start-copy .svw-link { display:block; }
  .svw-app:has(.svw-tutorial:not([hidden])) .svw-app-brand { display:none; }
  .svw-app:has(.svw-tutorial:not([hidden]))>.svw-status { position:absolute; width:1px; height:1px; min-height:0; padding:0; clip-path:inset(50%); }
  .svw-tutorial-copy { min-height:0; max-height:90px; overflow:auto; }
  .svw-toggle,.svw-icon-btn { min-height:44px; }.svw-icon-btn { min-width:44px; }
  .sv-learn-compare { grid-template-columns:1fr; }.sv-learn-model { grid-template-columns:1fr; }.sv-learn-model>span { transform:rotate(90deg); justify-self:center; }.sv-learn-page h3 { font-size:18px; }
}
@media(max-width:700px) and (max-height:740px) {
  html.svw-screen-fit #sv-nav { display:none; }
}
html.svw-screen-fit,html.svw-screen-fit body { overflow:hidden; overscroll-behavior:none; }
html.svw-screen-fit body { height:100dvh; min-height:0; padding-bottom:0!important; }
html.svw-screen-fit #sv-main,html.svw-screen-fit .sv-app-section,html.svw-screen-fit [data-sv-tool="power-plan"] { min-height:0; padding-block:0; }
html.svw-screen-fit .sv-plan-hero,html.svw-screen-fit .sv-section,html.svw-screen-fit .sv-footer,html.svw-screen-fit .sv-ad:not(.svw-ad),html.svw-screen-fit .dev-bar { display:none; }
.svw-app>.svw-ad { flex-shrink:0; width:100%; max-width:none; display:flex; flex-direction:column; align-items:center; gap:2px; margin:0; padding:5px 12px; border:0; border-top:1px solid var(--w-line); background:#0d1724; min-height:70px; }
.svw-ad .sv-ad-label { font-size:8px; line-height:10px; margin:0; color:var(--w-muted); letter-spacing:.1em; text-transform:uppercase; }
.svw-ad .sv-ad-frame { width:min(728px,100%); height:50px; min-height:50px; max-height:50px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.svw-app.is-screen-fit { position:fixed; z-index:25; top:var(--svw-screen-top,0px); left:0; right:0; height:var(--svw-screen-height,100dvh); max-width:none; display:flex; flex-direction:column; border-radius:0; margin:0; }
.svw-app.is-screen-fit>.svw-app-header,.svw-app.is-screen-fit>.svw-nav,.svw-app.is-screen-fit>.svw-status { flex-shrink:0; }
.svw-app.is-screen-fit>.svw-status:empty { display:none; }
.svw-app.is-screen-fit>.svw-body { flex:1; min-height:0; overflow:hidden; }
.svw-app.is-screen-fit .svw-main,.svw-app.is-screen-fit .svw-insights { min-height:0; max-height:none; overflow:auto; overscroll-behavior:contain; }
.svw-app.is-screen-fit .svw-main { scrollbar-gutter:stable; }
@media(max-width:700px) {
  .svw-app.is-screen-fit>.svw-nav { position:static; order:4; padding-bottom:max(3px,env(safe-area-inset-bottom)); }
  .svw-app.is-screen-fit>.svw-ad { order:3; }
  .svw-app.is-screen-fit .svw-main { flex:1; min-height:0; max-height:none; }
  .svw-app.is-screen-fit .svw-insights { flex-shrink:0; max-height:none; overflow:auto; }
  .svw-app.is-screen-fit .svw-mobile-details[open] { max-height:20dvh; overflow:auto; }
}
@media print {
  html.svw-screen-fit,html.svw-screen-fit body { overflow:visible!important; height:auto!important; }
  .svw-app.is-screen-fit { position:static!important; height:auto!important; display:block!important; }
  .svw-app.is-screen-fit>.svw-body { display:block!important; overflow:visible!important; }
  .svw-app>.svw-ad { display:none!important; }
  .svw-tutorial,.svw-help-button { display:none!important; }
  body:has(.svw-app) { background:white!important; color:black!important; padding:0!important; }
  body:has(.svw-app) .sv-header,body:has(.svw-app) .sv-footer,body:has(.svw-app) .dev-bar,body:has(.svw-app) .sv-plan-hero,body:has(.svw-app) .sv-ad-slot,body:has(.svw-app) .sv-section,body:has(.svw-app) .svw-nav,body:has(.svw-app) .svw-status,body:has(.svw-app) .svw-insights,body:has(.svw-app) button,body:has(.svw-app) dialog { display:none!important; }
  .svw-app { border:0!important; --w-bg:white; --w-panel:white; --w-line:#ccc; --w-text:#111; --w-muted:#555; --w-accent:#146d65; background:white!important; color:#111!important; }
  .svw-body { display:block; }.svw-main { max-height:none!important; overflow:visible!important; padding:0; }.svw-panel { background:white!important; border:1px solid #ccc; break-inside:avoid; margin-bottom:16px; }.svw-app-header { background:white; border-bottom:1px solid #ccc; padding:12px 0; }.svw-app-brand { color:#111; }.svw-header-actions,.svw-sample-notice { display:none!important; }.svw-two { grid-template-columns:1fr 1fr; }.svw-reasons { color:#111; }
}
.sva-root[data-sv-tool="home-demo"], [data-sv-tool="home-demo"] { min-height: 560px; }
.sva-loading { color: var(--sv-text-muted); padding: var(--sv-lg) 0; }
.sva-error { color: var(--sv-warn); }
.sva-root > * + * { margin-top: var(--sv-md); }

.sva-panel {
  background: var(--sv-surface); border: 1px solid var(--sv-line); border-radius: var(--sv-radius-card);
  padding: var(--sv-md);
}
@media (max-width: 480px) { .sva-panel { padding: 18px 16px; } }
.sva-panel > * + *, .sva-wizard-body > * + * { margin-top: 20px; }
.sva-panel-flat { margin-top: var(--sv-md); }
.sva-panel-flat > * + * { margin-top: 12px; }
.sva-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.sva-two { display: grid; gap: var(--sv-md); align-items: start; }
@media (min-width: 960px) { .sva-two { grid-template-columns: 1fr 1fr; } }
.sva-inline { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); align-items: start; }
.sva-inline[hidden] { display: none; }
.sva-section { margin-top: var(--sv-lg); }
.sva-section > * + * { margin-top: 16px; }

.sva-h2 { font-size: 1.3rem; line-height: 1.25; }
.sva-h3 { font-size: 1rem; font-family: var(--font-heading); font-weight: 600; margin-bottom: 10px; }
.sva-lead { color: var(--sv-text-sub); }
.sva-hint { font-size: 0.85rem; color: var(--sv-text-muted); line-height: 1.5; }
.sva-eyebrow { font-family: var(--font-heading); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sv-cyan); }
.sva-list { list-style: disc; padding-left: 1.2em; display: grid; gap: 6px; color: var(--sv-text-sub); font-size: 0.92rem; }
.sva-list-num { list-style: decimal; gap: 10px; font-size: 0.97rem; }
.sva-dl dt { font-weight: 600; margin-top: 10px; }
.sva-dl dd { color: var(--sv-text-sub); font-size: 0.92rem; }
.sva-actions, .sva-plan-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--sv-md); }
.sva-btn-text {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 8px 10px;
  color: var(--sv-text-sub); font-size: 0.88rem; text-decoration: underline; text-underline-offset: 3px;
}
.sva-btn-text:hover { color: var(--sv-cyan); }
.sva-privacy { font-size: 0.82rem; color: var(--sv-text-muted); text-align: center; }
.sva-disclaimer { display: flex; gap: 8px; font-size: 0.8rem; color: var(--sv-text-muted); line-height: 1.5; }
.sva-disclaimer svg { flex: none; margin-top: 2px; }

/* ─── Fields ────────────────────────────────────────────────────────────── */
.sva-field { display: grid; gap: 6px; align-content: start; min-width: 0; }
.sva-label { font-family: var(--font-heading); font-weight: 600; font-size: 0.9rem; color: var(--sv-text); padding: 0; }
.sva-input {
  width: 100%; min-height: 46px; padding: 10px 12px; font: inherit; font-size: 1rem; color: var(--sv-text);
  background: var(--sv-surface-elev); border: 1px solid var(--sv-line-strong); border-radius: var(--sv-radius);
}
.sva-input::placeholder { color: var(--sv-text-muted); opacity: 0.8; }
.sva-input:focus { border-color: var(--sv-cyan); outline: 2px solid var(--sv-cyan); outline-offset: 0; }
.sva-select { appearance: auto; }
.sva-input-wrap { position: relative; display: flex; align-items: center; }
.sva-input-wrap .sva-input { padding-right: 4.6rem; }
.sva-unit { position: absolute; right: 12px; font-size: 0.8rem; color: var(--sv-text-muted); pointer-events: none; }
input[type="number"].sva-input { -moz-appearance: textfield; }
input[type="number"].sva-input::-webkit-outer-spin-button,
input[type="number"].sva-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.sva-choice { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 8px; }
.sva-choice-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
@media (min-width: 720px) { .sva-choice-grid[style*="--cols"] { grid-template-columns: repeat(var(--cols), 1fr); } }
.sva-choice-compact .sva-choice-grid { grid-template-columns: repeat(auto-fit, minmax(96px, max-content)); }
.sva-choice-item { position: relative; display: block; cursor: pointer; }
.sva-choice-item input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; margin: 0; }
.sva-choice-body {
  display: flex; flex-direction: column; justify-content: center; gap: 4px; min-height: 48px; height: 100%;
  padding: 10px 14px; border-radius: var(--sv-radius); border: 1px solid var(--sv-line-strong);
  background: var(--sv-surface-elev); transition: border-color var(--sv-transition), background var(--sv-transition);
}
.sva-choice-label { font-weight: 600; font-size: 0.93rem; }
.sva-choice-hint { font-size: 0.8rem; color: var(--sv-text-muted); line-height: 1.4; }
.sva-choice-item:hover .sva-choice-body { border-color: var(--sv-cyan); }
.sva-choice-item input:checked + .sva-choice-body {
  border-color: var(--sv-cyan); background: rgba(63, 210, 242, 0.12); box-shadow: inset 0 0 0 1px var(--sv-cyan);
}
.sva-choice-item input:checked + .sva-choice-body .sva-choice-label::before { content: '\2713\00a0'; color: var(--sv-cyan); }
.sva-choice-item input:focus-visible + .sva-choice-body { outline: 2px solid var(--sv-cyan); outline-offset: 2px; }

.sva-switch { display: flex; align-items: center; gap: 12px; cursor: pointer; min-height: 44px; }
.sva-switch-input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sva-switch-track {
  flex: none; width: 46px; height: 26px; border-radius: 999px; background: var(--sv-surface-high);
  border: 1px solid var(--sv-line-strong); position: relative; transition: background var(--sv-transition);
}
.sva-switch-track::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%;
  background: var(--sv-text-muted); transition: transform var(--sv-transition), background var(--sv-transition);
}
.sva-switch-input:checked + .sva-switch-track { background: rgba(63, 210, 242, 0.28); border-color: var(--sv-cyan); }
.sva-switch-input:checked + .sva-switch-track::after { transform: translateX(20px); background: var(--sv-cyan); }
.sva-switch-input:focus-visible + .sva-switch-track { outline: 2px solid var(--sv-cyan); outline-offset: 2px; }
.sva-switch-label { font-size: 0.95rem; }

.sva-range { width: 100%; height: 44px; accent-color: var(--sv-cyan); background: transparent; }
.sva-range-out { font-weight: 600; color: var(--sv-cyan); margin-left: 6px; font-family: var(--font-body); }

.sva-explain { border: 1px solid var(--sv-line); border-radius: var(--sv-radius); }
.sva-explain summary { cursor: pointer; padding: 12px 14px; font-size: 0.9rem; font-weight: 600; color: var(--sv-text-sub); min-height: 44px; }
.sva-explain[open] summary { border-bottom: 1px solid var(--sv-line); }
.sva-explain-body { padding: 14px; font-size: 0.92rem; color: var(--sv-text-sub); }
.sva-explain-body > * + * { margin-top: 10px; }

/* ─── Provenance tags ───────────────────────────────────────────────────── */
.sva-src {
  display: inline-block; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.03em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 4px; border: 1px solid var(--sv-line-strong); color: var(--sv-text-sub); white-space: nowrap;
}
.sva-src-user { border-color: rgba(165, 224, 74, 0.5); color: var(--sv-volt); }
.sva-src-calculated { border-color: rgba(63, 210, 242, 0.5); color: var(--sv-cyan); }
.sva-src-estimated { border-style: dashed; }
.sva-legend { font-size: 0.82rem; color: var(--sv-text-muted); }

/* ─── Stats ─────────────────────────────────────────────────────────────── */
.sva-stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.sva-stat {
  padding: 16px; border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line);
  background: var(--sv-surface); display: grid; gap: 4px; align-content: start;
}
.sva-panel .sva-stat { background: var(--sv-surface-elev); }
.sva-stat-label { font-size: 0.8rem; color: var(--sv-text-muted); }
.sva-stat-value { font-family: var(--font-heading); font-weight: 700; font-size: 1.25rem; line-height: 1.25; font-variant-numeric: tabular-nums; }
.sva-stat-sub { font-size: 0.83rem; color: var(--sv-text-sub); line-height: 1.4; }
.sva-stat-foot { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin-top: 6px; }
.sva-stat-note { font-size: 0.75rem; color: var(--sv-text-muted); }
.sva-stat-warn { border-color: rgba(255, 181, 71, 0.45); }

.sva-answer { padding-bottom: 16px; border-bottom: 1px solid var(--sv-line); }
.sva-answer-label { font-size: 0.82rem; color: var(--sv-text-muted); text-transform: uppercase; letter-spacing: 0.08em; }
.sva-answer-value { font-family: var(--font-heading); font-weight: 700; font-size: clamp(1.9rem, 6vw, 2.6rem); line-height: 1.15; color: var(--sv-cyan); font-variant-numeric: tabular-nums; }
.sva-answer-value-sm { font-size: clamp(1.4rem, 4.5vw, 1.9rem); }
.sva-answer-sub { color: var(--sv-text-sub); margin-top: 6px; }
.sva-answer .sva-list { margin-top: 10px; }
.sva-results > * + * { margin-top: 16px; }

.sva-verdict { display: flex; gap: 10px; padding: 12px 14px; border-radius: var(--sv-radius); border: 1px solid; font-size: 0.92rem; line-height: 1.5; }
.sva-verdict.is-ok { border-color: rgba(165, 224, 74, 0.4); background: rgba(165, 224, 74, 0.07); }
.sva-verdict.is-ok .sva-verdict-icon { color: var(--sv-volt); }
.sva-verdict.is-warn { border-color: rgba(255, 181, 71, 0.45); background: rgba(255, 181, 71, 0.07); }
.sva-verdict.is-warn .sva-verdict-icon { color: var(--sv-warn); }
.sva-verdict-icon { flex: none; margin-top: 2px; }
.sva-verdict-detail { color: var(--sv-text-sub); }
.sva-verdict + .sva-verdict { margin-top: 8px; }

.sva-bar { height: 10px; border-radius: 999px; background: var(--sv-surface-high); overflow: hidden; }
.sva-bar-fill { height: 100%; border-radius: 999px; background: var(--sv-cyan); transition: width 0.45s cubic-bezier(0.2, 0.8, 0.2, 1); }
.sva-bar-warn .sva-bar-fill { background: var(--sv-warn); }
.sva-bar-scale { display: flex; justify-content: space-between; font-size: 0.7rem; color: var(--sv-text-muted); margin-top: 4px; }

/* ─── Outage simulator ──────────────────────────────────────────────────── */
.sva-sim { display: grid; gap: var(--sv-md); align-items: start; }
.sva-sim > .sva-disclaimer { grid-column: 1 / -1; }
.sva-sim-main, .sva-sim-side { display: grid; gap: var(--sv-md); min-width: 0; }
@media (min-width: 960px) {
  .sva-sim { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }
  .sva-sim-side { position: sticky; top: calc(var(--sv-nav-height) + 16px); }
}
@media (max-width: 959px) {
  .sva-sim-side { order: -1; }
  .sva-sticky { position: sticky; top: calc(var(--sv-nav-height) + 8px); z-index: 5; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45); }
  .sva-sticky .sva-power, .sva-sticky .sva-tally, .sva-sticky .sva-readout-sub, .sva-sticky .sva-bar-scale { display: none; }
  .sva-sticky.sva-panel { padding: 14px 16px; }
  .sva-sticky .sva-readout-value { font-size: 1.6rem; }
}
.sva-sim-compact { grid-template-columns: 1fr; }
.sva-sim-compact .sva-panel > * + * { margin-top: 14px; }
.sva-sim-compact .sva-readout-value { font-size: clamp(1.6rem, 4vw, 2.1rem); }
.sva-sim-compact .sva-loads { grid-template-columns: 1fr 1fr; }
@media (max-width: 520px) { .sva-sim-compact .sva-loads { grid-template-columns: 1fr; } }
.sva-sim-compact .sva-load { grid-template-columns: minmax(0, 1fr); padding: 2px 10px; }
.sva-sim-compact .sva-load-meta { display: none; }
.sva-sim-compact .sva-switch-label { font-size: 0.88rem; }
.sva-demo-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.sva-readout-label { font-size: 0.8rem; color: var(--sv-text-muted); text-transform: uppercase; letter-spacing: 0.08em; }
.sva-readout-value { font-family: var(--font-heading); font-weight: 700; font-size: clamp(1.7rem, 5.5vw, 2.4rem); line-height: 1.15; color: var(--sv-cyan); font-variant-numeric: tabular-nums; }
.sva-readout-delta { min-height: 1.4em; font-size: 0.88rem; color: var(--sv-volt); opacity: 0; transition: opacity 0.25s; margin-bottom: 8px; }
.sva-readout-delta.is-shown { opacity: 1; }
.sva-readout-sub { font-size: 0.85rem; color: var(--sv-text-sub); margin-top: 10px; }
.sva-tally { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding-block: 14px; border-block: 1px solid var(--sv-line); }
.sva-tally > div { display: grid; }
.sva-tally-num { font-family: var(--font-heading); font-weight: 700; font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.sva-tally-unit { font-size: 0.75rem; color: var(--sv-text-muted); }

.sva-loads { display: grid; gap: 6px; }
.sva-load {
  display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 12px;
  padding: 4px 12px; border-radius: var(--sv-radius); border: 1px solid var(--sv-line); background: var(--sv-surface-elev);
}
.sva-load.is-on { border-color: rgba(63, 210, 242, 0.45); }
.sva-load:not(.is-on) .sva-load-meta { opacity: 0.55; }
.sva-load-meta { display: flex; align-items: center; gap: 8px; font-size: 0.82rem; color: var(--sv-text-sub); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sva-pill { font-size: 0.66rem; padding: 2px 6px; border-radius: 4px; border: 1px solid var(--sv-line-strong); color: var(--sv-text-muted); }
.sva-load-edit { grid-column: 1 / -1; }
.sva-load-edit[hidden] { display: none; }
.sva-load-editbtn { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--sv-radius); color: var(--sv-text-muted); margin-right: -8px; }
.sva-load-editbtn:hover, .sva-load-editbtn[aria-expanded="true"] { color: var(--sv-cyan); background: rgba(63, 210, 242, 0.08); }
.sva-load-edit-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); padding: 8px 0 12px; align-items: end; }
.sva-add { margin-top: 4px; }

.sva-size-list { display: grid; gap: 6px; }
.sva-size {
  display: grid; grid-template-columns: 5.2rem 1fr 5rem; align-items: center; gap: 12px; width: 100%; min-height: 44px;
  padding: 6px 12px; border-radius: var(--sv-radius); border: 1px solid var(--sv-line); text-align: left; font-size: 0.9rem;
}
.sva-size:hover { border-color: var(--sv-cyan); }
.sva-size.is-active { border-color: var(--sv-cyan); background: rgba(63, 210, 242, 0.1); }
.sva-size-kwh { font-weight: 600; }
.sva-size-time { text-align: right; font-variant-numeric: tabular-nums; color: var(--sv-text-sub); }

.sva-presets { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.sva-preset { display: grid; gap: 2px; text-align: left; padding: 10px 14px; min-height: 48px; border-radius: var(--sv-radius); border: 1px solid var(--sv-line-strong); background: var(--sv-surface-elev); }
.sva-preset:hover { border-color: var(--sv-cyan); }
.sva-preset span { font-size: 0.8rem; color: var(--sv-text-muted); }

/* ─── kW vs kWh explainer ───────────────────────────────────────────────── */
.sva-kwkwh-out { display: grid; gap: 16px; grid-template-columns: auto 1fr; align-items: center; }
.sva-kwkwh-out > div:last-child > * + * { margin-top: 10px; }
.sva-kwkwh-viz { display: flex; align-items: flex-end; gap: 14px; height: 170px; }
.sva-tank, .sva-pipe { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 6px; height: 100%; font-size: 0.75rem; color: var(--sv-text-sub); position: relative; }
.sva-tank { width: 76px; }
.sva-tank::before { content: ''; position: absolute; inset: 0 0 22px 0; border: 2px solid var(--sv-line-strong); border-radius: 10px; }
.sva-tank-fill { width: calc(100% - 8px); margin-bottom: 4px; background: rgba(63, 210, 242, 0.55); border-radius: 6px; transition: height 0.3s; max-height: calc(100% - 30px); }
.sva-pipe { width: 46px; }
.sva-pipe-cap { width: 100%; border: 2px solid var(--sv-line-strong); border-radius: 6px; display: flex; align-items: flex-end; overflow: hidden; transition: height 0.3s; }
.sva-pipe-flow { width: 100%; background: var(--sv-volt); transition: height 0.3s; }
.sva-pipe-flow.is-over { background: var(--sv-warn); }
.sva-kwkwh-line { font-size: 0.95rem; color: var(--sv-text-sub); }

/* ─── Solar months ──────────────────────────────────────────────────────── */
.sva-months { display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; height: 170px; align-items: end; }
.sva-month { display: grid; grid-template-rows: 1fr auto auto; height: 100%; align-items: end; justify-items: center; gap: 2px; }
.sva-month-bar { width: 100%; background: var(--sv-cyan); border-radius: 3px 3px 0 0; min-height: 2px; opacity: 0.85; transition: height 0.4s; }
.sva-month-val { font-size: 0.6rem; color: var(--sv-text-sub); font-variant-numeric: tabular-nums; }
.sva-month-name { font-size: 0.65rem; color: var(--sv-text-muted); }
@media (max-width: 520px) { .sva-month-val { display: none; } }
.sva-seasons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.sva-seasons > div { display: grid; font-size: 0.9rem; }

/* ─── Tables ────────────────────────────────────────────────────────────── */
.sva-table-wrap { overflow-x: auto; border: 1px solid var(--sv-line); border-radius: var(--sv-radius-card); }
.sva-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; min-width: 620px; }
.sva-table th, .sva-table td { padding: 11px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--sv-line); line-height: 1.45; }
.sva-table thead th { font-family: var(--font-heading); font-size: 0.8rem; color: var(--sv-cyan); background: var(--sv-surface-elev); white-space: nowrap; }
.sva-table tbody th { font-weight: 600; color: var(--sv-text); width: 22%; background: var(--sv-surface); }
.sva-table td { color: var(--sv-text-sub); }
.sva-table tr:last-child > * { border-bottom: 0; }
.sva-table-num td { font-variant-numeric: tabular-nums; white-space: nowrap; }
.sva-table-num tbody th { width: 34%; }
.sva-table tr.is-chosen > * { background: rgba(63, 210, 242, 0.08); color: var(--sv-text); }
.sva-th-sub { display: block; font-weight: 400; font-size: 0.78rem; color: var(--sv-text-muted); margin-bottom: 6px; }

/* ─── Wizard ────────────────────────────────────────────────────────────── */
.sva-wizard { max-width: 860px; margin-inline: auto; }
.sva-wizard > * + * { margin-top: 16px; }
.sva-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; list-style: none; padding: 0; }
.sva-steps li { min-width: 0; }
.sva-steps button { width: 100%; display: grid; gap: 6px; justify-items: start; padding: 8px 0 0; border-top: 3px solid var(--sv-surface-high); color: var(--sv-text-muted); font-size: 0.78rem; text-align: left; min-height: 44px; }
.sva-steps button:disabled { cursor: default; }
.sva-steps .is-done button { border-top-color: var(--sv-volt); color: var(--sv-text-sub); }
.sva-steps .is-current button { border-top-color: var(--sv-cyan); color: var(--sv-text); font-weight: 600; }
.sva-step-num { display: none; }
.sva-step-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
@media (max-width: 560px) { .sva-step-name { font-size: 0.68rem; } }
.sva-step-count { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sv-text-muted); }
.sva-wizard-body > .sva-h2 { margin-top: 4px; font-size: 1.5rem; }
.sva-wizard-body > .sva-h2:focus { outline: none; }
.sva-wizard-nav { display: flex; justify-content: space-between; gap: 12px; padding-top: 20px; margin-top: 28px; border-top: 1px solid var(--sv-line); }

/* ─── Plan results ──────────────────────────────────────────────────────── */
.sva-plan > * + * { margin-top: var(--sv-md); }
.sva-plan .sva-section { margin-top: var(--sv-lg); }
.sva-plan-head > * + * { margin-top: 12px; }
.sva-best { display: grid; gap: var(--sv-md); }
@media (min-width: 960px) { .sva-best { grid-template-columns: 1.4fr 1fr; } }
.sva-best-main { padding: var(--sv-md); border-radius: var(--sv-radius-card); border: 1px solid var(--sv-cyan); background: linear-gradient(160deg, rgba(63, 210, 242, 0.1), var(--sv-surface) 60%); }
.sva-best-main > * + * { margin-top: 10px; }
.sva-rec-label { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: var(--sv-cyan); color: #0b1220; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.sva-best-kicker { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sv-text-muted); }
.sva-best-title { font-size: clamp(1.6rem, 5vw, 2.3rem); line-height: 1.15; }
.sva-best-title:focus { outline: none; }
.sva-best-why { color: var(--sv-text-sub); line-height: 1.65; }
.sva-best-why strong { color: var(--sv-text); }
.sva-best-cost { font-size: 0.95rem; color: var(--sv-text-sub); }
.sva-conf { padding: var(--sv-md); border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line); background: var(--sv-surface); }
.sva-conf > * + * { margin-top: 10px; }
.sva-conf-kicker { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sv-text-muted); }
.sva-conf-label { font-family: var(--font-heading); font-weight: 700; font-size: 1.3rem; }
.sva-conf-text { font-size: 0.9rem; color: var(--sv-text-sub); }
.sva-conf-high .sva-bar-fill { background: var(--sv-volt); }
.sva-conf-low .sva-bar-fill { background: var(--sv-warn); }
.sva-compare2 { display: grid; gap: 16px; grid-template-columns: 1fr 1fr; }
.sva-compare2 > div > * + * { margin-top: 6px; }
.sva-big { font-family: var(--font-heading); font-weight: 700; font-size: 1.4rem; font-variant-numeric: tabular-nums; }

.sva-strategies { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .sva-strategies { grid-template-columns: 1fr 1fr; } }
.sva-strategy { padding: 16px; border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line); background: var(--sv-surface); display: grid; gap: 8px; align-content: start; }
.sva-strategy.is-best { border-color: var(--sv-cyan); }
.sva-strategy-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.sva-strategy h4 { font-size: 1rem; }
.sva-strategy-cost { font-size: 0.9rem; color: var(--sv-text-sub); font-variant-numeric: tabular-nums; }
.sva-fit { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--sv-line-strong); color: var(--sv-text-sub); white-space: nowrap; }
.sva-fit-best .sva-fit { background: var(--sv-cyan); border-color: var(--sv-cyan); color: #0b1220; }
.sva-fit-strong .sva-fit { border-color: var(--sv-volt); color: var(--sv-volt); }
.sva-fit-weak, .sva-fit-not_applicable { opacity: 0.72; }
.sva-pros, .sva-cons { display: grid; gap: 4px; font-size: 0.85rem; color: var(--sv-text-sub); }
.sva-pros li, .sva-cons li { display: flex; gap: 8px; line-height: 1.45; }
.sva-pros svg, .sva-cons svg { flex: none; margin-top: 2px; }
.sva-pros svg { color: var(--sv-volt); }
.sva-cons svg { color: var(--sv-warn); }

.sva-checklist { display: grid; gap: 8px; }
.sva-checklist label { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; min-height: 44px; border: 1px solid var(--sv-line); border-radius: var(--sv-radius); cursor: pointer; font-size: 0.92rem; line-height: 1.45; }
.sva-checklist input { width: 20px; height: 20px; flex: none; margin-top: 1px; accent-color: var(--sv-volt); }
.sva-checklist input:checked + span { color: var(--sv-text-muted); text-decoration: line-through; }

/* ─── Tool page content ─────────────────────────────────────────────────── */
.sv-tool-content { max-width: 800px; }
.sv-tool-content h2 { margin-top: var(--sv-lg); }
.sv-related { display: grid; gap: 10px; margin-top: var(--sv-md); }
.sv-related a { display: flex; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--sv-line); border-radius: var(--sv-radius); color: var(--sv-text); min-height: 44px; }
.sv-related a:hover { border-color: var(--sv-cyan); }
.sv-inline-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; margin-block: var(--sv-md); border: 1px solid var(--sv-cyan-border); border-radius: var(--sv-radius-card); background: rgba(63, 210, 242, 0.06); }
.sv-inline-cta p { margin: 0 !important; color: var(--sv-text) !important; font-weight: 600; }
.sv-note-updated { font-size: 0.85rem; color: var(--sv-text-muted); }

/* ─── Print: the plan and the installer questions, nothing else ─────────── */
@media print {
  :root { --sv-bg: #fff; --sv-surface: #fff; --sv-surface-elev: #fff; --sv-surface-high: #ddd; --sv-text: #000; --sv-text-sub: #222; --sv-text-muted: #444; --sv-line: #bbb; --sv-line-strong: #888; --sv-cyan: #005f7a; --sv-volt: #3d6b00; --sv-warn: #8a5200; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .sv-nav, .sv-footer, .sv-ad, .sv-app-hero .sv-breadcrumb, .sva-plan-actions, .sva-actions, .sva-privacy, .sv-tool-content, .sv-hero-bg, .sva-wizard-nav, .sv-skip, .sva-questions .sv-btn-ghost { display: none !important; }
  #sv-main { padding-top: 0; }
  .sva-explain { border: 0; }
  .sva-explain > summary { display: none; }
  details.sva-explain > .sva-explain-body { display: block; }
  .sva-strategy, .sva-stat, .sva-panel { break-inside: avoid; }
  .sva-best-main { background: #fff; }
  .sva-rec-label, .sva-fit-best .sva-fit { background: #fff; color: #000; border: 1px solid #000; }
}

/* ─── Mobile fixes ──────────────────────────────────────────────────────── */
.sv-hamburger { flex-shrink: 0; }
@media (max-width: 767px) { .sv-nav .sv-nav-cta { display: none; } }
.sva-load { grid-template-columns: minmax(0, 1fr) auto; }
.sva-load .sva-switch { min-width: 0; }
.sva-panel, .sva-sim-main, .sva-sim-side, .sva-two > * { min-width: 0; }
@media (max-width: 959px) {
  /* Runtime readout stays pinned first; the other side panels follow the loads. */
  .sva-sim { grid-template-columns: minmax(0, 1fr); }
  .sva-sim-side { display: contents; }
  .sva-sim-side > .sva-sticky { order: -1; }
  .sva-sim-side > :not(.sva-sticky) { order: 2; }
  .sva-sim > .sva-disclaimer { order: 3; }
}
@media (max-width: 520px) {
  .sva-compare2 { grid-template-columns: 1fr; }
  .sva-kwkwh-out { grid-template-columns: 1fr; }
  .sva-wizard-nav .sv-btn-primary, .sva-wizard-nav .sv-btn-ghost { padding-inline: 16px; }
}
.sva-root .sv-btn-primary, .sva-root .sv-btn-ghost, .sv-inline-cta .sv-btn-primary { white-space: normal; text-align: center; line-height: 1.25; max-width: 100%; }
/* Legacy article layout: let wide tables scroll inside their own box. */
.sv-prose-layout > *, .sv-prose { min-width: 0; }
.sv-prose { overflow-wrap: break-word; }

/* ─── Spacing and polish pass ───────────────────────────────────────────── */
.sva-panel > .sva-choice + *, .sva-panel > * + .sva-choice,
.sva-wizard-body > * + * { margin-top: 26px; }
.sva-wizard-body > .sva-step-count + .sva-h2 { margin-top: 6px; }
.sva-wizard-body > .sva-h2 + .sva-lead { margin-top: 8px; }
.sva-choice > legend { margin-bottom: 8px; }
.sva-inline > .sva-choice { margin-top: 0; }
.sv-section-light .sv-btn-primary { color: #fff; }
.sv-section-light .sv-btn-primary:hover { background: #096a88; color: #fff; }
.sv-bluf-list li { display: block; position: relative; padding-left: 16px; }
.sv-bluf-list li::before { position: absolute; left: 0; top: 2px; }

/* ============================================================
   v2.1 additions
   ============================================================ */
.sva-stack { display: grid; gap: var(--sv-md); min-width: 0; align-content: start; }
.sva-stack > .sva-field + .sva-field { margin-top: 0; }
@media (min-width: 960px) {
  .sva-two-wide-right { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); }
  .sva-sticky-desktop { position: sticky; top: calc(var(--sv-nav-height) + 16px); max-height: calc(100vh - var(--sv-nav-height) - 32px); overflow-y: auto; }
}
.sva-range-row { display: flex; align-items: center; gap: 12px; }
.sva-range-row .sva-range { flex: 1; min-width: 0; }
.sva-range-row .sva-input-wrap { flex: none; }
.sva-stat-key { border-color: var(--sv-cyan); box-shadow: inset 0 0 0 1px var(--sv-cyan); }
.sva-table-tight th, .sva-table-tight td { padding: 9px 12px; }
.sva-table-tight { min-width: 480px; font-size: 0.85rem; }
.sva-table tr.is-warn > * { background: rgba(255, 181, 71, 0.07); }
.sva-table td .sva-th-sub, .sva-table th .sva-th-sub { margin-bottom: 0; margin-top: 2px; }
.sva-pill-critical { border-color: rgba(255, 181, 71, 0.5); color: var(--sv-warn); }

/* Simulator presets and footer */
.sva-presets-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.sva-chip-btn { min-height: 38px; padding: 6px 14px; border-radius: 999px; border: 1px solid var(--sv-line-strong); font-size: 0.85rem; color: var(--sv-text-sub); background: var(--sv-surface-elev); }
.sva-chip-btn:hover { border-color: var(--sv-cyan); color: var(--sv-cyan); }
.sva-sim-foot { grid-column: 1 / -1; display: grid; gap: 14px; }
@media (max-width: 959px) { .sva-sim-foot { order: 3; } }

/* Result footer: share, print, feedback */
.sva-result-footer { display: grid; gap: 14px; padding-top: 18px; margin-top: 8px; border-top: 1px solid var(--sv-line); }
.sva-footer-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.sva-footer-status { font-size: 0.85rem; color: var(--sv-volt); }
.sva-feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.sva-feedback-q { font-size: 0.92rem; font-weight: 600; }
.sva-feedback-btns { display: flex; gap: 8px; }
.sva-feedback-btn { min-height: 40px; min-width: 64px; padding: 6px 14px; border-radius: var(--sv-radius); border: 1px solid var(--sv-line-strong); font-size: 0.88rem; color: var(--sv-text-sub); }
.sva-feedback-btn:hover { border-color: var(--sv-cyan); color: var(--sv-cyan); }
.sva-print-only { display: none; }

/* Quote checker */
.sva-audit { display: grid; gap: 10px; }
.sva-audit-row { padding: 14px 16px; border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line); background: var(--sv-surface-elev); }
.sva-audit-row > * + * { margin-top: 8px; }
.sva-audit-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.sva-audit-head .sva-h3 { margin: 0; }
.sva-audit-status { display: inline-flex; align-items: center; gap: 6px; font-size: 0.74rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--sv-line-strong); color: var(--sv-text-sub); white-space: nowrap; }
.sva-tone-ok { border-color: rgba(165, 224, 74, 0.35); }
.sva-tone-ok .sva-audit-status { border-color: var(--sv-volt); color: var(--sv-volt); }
.sva-tone-warn { border-color: rgba(255, 181, 71, 0.45); }
.sva-tone-warn .sva-audit-status { border-color: var(--sv-warn); color: var(--sv-warn); }
.sva-audit-finding { font-size: 0.92rem; color: var(--sv-text-sub); line-height: 1.55; }
.sva-finance-fields:empty { display: none; }

/* Homepage example plan */
.sva-example { display: grid; gap: var(--sv-md); align-items: start; }
@media (min-width: 860px) { .sva-example { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); } }
.sva-ex-home, .sva-ex-result { padding: var(--sv-md); border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line); background: var(--sv-surface); }
.sva-ex-result { border-color: var(--sv-cyan); }
.sva-ex-result > * + *, .sva-ex-home > * + * { margin-top: 12px; }
.sva-ex-facts { display: grid; gap: 8px; color: var(--sv-text-sub); font-size: 0.95rem; }
.sva-ex-facts li { padding-left: 16px; position: relative; }
.sva-ex-facts li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 6px; height: 6px; border-radius: 50%; background: var(--sv-cyan); }
.sva-ex-title { font-family: var(--font-heading); font-weight: 700; font-size: clamp(1.4rem, 4vw, 1.9rem); line-height: 1.2; }
.sva-ex-list { display: grid; gap: 0; }
.sva-ex-row { display: grid; grid-template-columns: minmax(120px, 0.7fr) 1.3fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--sv-line); }
.sva-ex-row dt { font-size: 0.85rem; color: var(--sv-text-muted); }
.sva-ex-row dd { display: grid; gap: 2px; }
.sva-ex-row dd span { font-size: 0.82rem; color: var(--sv-text-sub); }
[data-sv-tool="example-plan"] { min-height: 380px; }
[data-sv-tool="methodology"] { min-height: 900px; }
.sv-region { align-items: center; }

/* Tool directory: interest buttons */
.sv-interest-btn { margin-top: auto; align-self: flex-start; min-height: 40px; padding: 8px 14px; border-radius: var(--sv-radius); border: 1px solid var(--sv-cyan-border); color: var(--sv-cyan); font-family: var(--font-heading); font-weight: 600; font-size: 0.85rem; }
.sv-interest-btn:hover:not(:disabled) { background: rgba(63, 210, 242, 0.08); border-color: var(--sv-cyan); }
.sv-interest-btn:disabled { color: var(--sv-volt); border-color: rgba(165, 224, 74, 0.4); cursor: default; }
.sv-tile-soon { opacity: 1; }
.sv-tile-soon h3, .sv-tile-soon p { opacity: 0.8; }

/* Forms, sidebar headings, honeypot */
.sv-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sv-sidebar-title { font-size: 0.95rem; font-family: var(--font-heading); margin-bottom: 8px; }
.sv-sidebar-links .sv-sidebar-title { font-size: 0.85rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--sv-text-muted); margin-bottom: var(--sv-sm); }
.sv-prose .sv-ad { padding-inline: 0; }
.sv-form-input.sv-input-error, .sv-form-textarea.sv-input-error { border-color: #ff6b6b; }

/* Installed-app safe areas (notches, gesture bars) */
@supports (padding: env(safe-area-inset-top)) {
  .sv-nav { padding-top: env(safe-area-inset-top); height: calc(var(--sv-nav-height) + env(safe-area-inset-top)); }
  #sv-main { padding-top: calc(var(--sv-nav-height) + env(safe-area-inset-top)); }
  .sv-footer-inner { padding-bottom: calc(var(--sv-lg) + env(safe-area-inset-bottom)); }
}

/* Print: inputs as entered, results, assumptions, date and disclaimer */
@media print {
  .sva-print-only { display: block; font-size: 9pt; color: #333; border-top: 1px solid #999; padding-top: 8px; }
  .sva-footer-actions, .sva-feedback, .sva-presets-row, .sva-add, .sva-load-editbtn, .sva-chip-btn, .sv-interest-btn, .sva-next, .sv-related, .sva-kwkwh, .sv-inline-cta, .sva-steps, .sv-filter { display: none !important; }
  .sva-sticky, .sva-sticky-desktop, .sva-sim-side { position: static !important; max-height: none !important; overflow: visible !important; box-shadow: none !important; }
  .sva-sim, .sva-two, .sva-best, .sva-example { display: block !important; }
  .sva-sim > *, .sva-two > *, .sva-stack > * { margin-bottom: 12pt; }
  .sva-load:not(.is-on) { display: none; }
  .sva-input { border: 1px solid #888; background: #fff; color: #000; }
  .sva-table-wrap { overflow: visible; border-color: #999; }
  .sva-table { min-width: 0; }
  .sva-audit-row, .sva-stat, .sva-strategy { background: #fff; border-color: #999; }
  a { color: #000; text-decoration: none; }
}

/* ============================================================
   v2.2 Power Plan: goal-first flow, live profile, decision result
   ============================================================ */
.sv-plan-hero { padding-block: 28px 8px; border: 0; background: none; }
.sv-plan-hero h1 { font-size: clamp(1.1rem, 2.4vw, 1.35rem); font-weight: 600; color: var(--sv-text-sub); letter-spacing: 0; }
.sva-root[data-sv-tool="power-plan"] { min-height: 640px; }

.sva-flow { display: grid; gap: var(--sv-md); align-items: start; }
@media (min-width: 1000px) {
  .sva-flow { grid-template-columns: minmax(0, 1fr) 340px; }
  .sva-flow.is-goals { grid-template-columns: minmax(0, 1fr); }
  .sva-flow-side { position: sticky; top: calc(var(--sv-nav-height) + 16px); }
}
.sva-flow.is-goals .sva-flow-side { display: none; }
.sva-flow-main { min-width: 0; }
.sva-flow-main > * > * + * { margin-top: 18px; }

/* Goal picker */
.sva-goals { max-width: 1040px; margin-inline: auto; }
.sva-goals-title { font-size: clamp(1.8rem, 5vw, 2.6rem); line-height: 1.15; }
.sva-goals-title:focus, .sva-step-q:focus { outline: none; }
.sva-goal-grid { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 560px) { .sva-goal-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .sva-goal-grid { grid-template-columns: repeat(4, 1fr); } }
.sva-goal {
  display: grid; gap: 6px; align-content: start; text-align: left; padding: 20px 18px; min-height: 148px;
  border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line-strong); background: var(--sv-surface);
  transition: border-color var(--sv-transition), transform var(--sv-transition), background var(--sv-transition);
}
.sva-goal:hover, .sva-goal:focus-visible { border-color: var(--sv-cyan); background: var(--sv-surface-elev); transform: translateY(-2px); }
.sva-goal-emoji { font-size: 1.7rem; line-height: 1; margin-bottom: 4px; }
.sva-goal-title { font-family: var(--font-heading); font-weight: 600; font-size: 1.02rem; line-height: 1.3; color: var(--sv-text); }
.sva-goal-desc { font-size: 0.86rem; color: var(--sv-text-sub); line-height: 1.45; }
@media (max-width: 559px) {
  .sva-goal { grid-template-columns: auto 1fr; column-gap: 14px; min-height: 0; padding: 16px; align-items: center; }
  .sva-goal-emoji { grid-row: span 2; margin: 0; font-size: 1.9rem; }
}
.sva-goals-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }

/* Progress */
.sva-progress { display: flex; gap: 6px; list-style: none; padding: 0; }
.sva-progress li { flex: 1; min-width: 0; }
.sva-progress button, .sva-progress-skip { width: 100%; display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 0 0; border-top: 3px solid var(--sv-surface-high); color: var(--sv-text-muted); font-size: 0.8rem; }
.sva-progress-dot { width: 9px; height: 9px; border-radius: 50%; border: 2px solid currentColor; flex: none; }
.sva-progress .is-done button, .sva-progress .is-done .sva-progress-skip { border-top-color: var(--sv-volt); color: var(--sv-text-sub); }
.sva-progress .is-done .sva-progress-dot { background: var(--sv-volt); border-color: var(--sv-volt); }
.sva-progress .is-current button { border-top-color: var(--sv-cyan); color: var(--sv-text); font-weight: 600; }
.sva-progress .is-current .sva-progress-dot { background: var(--sv-cyan); border-color: var(--sv-cyan); }

/* A question */
.sva-step-body > * + * { margin-top: 20px; }
.sva-step-q { font-size: clamp(1.35rem, 4vw, 1.75rem); line-height: 1.2; }
.sva-step-hint { color: var(--sv-text-sub); margin-top: 8px !important; }
.sva-step-body .sva-choice > legend { margin-bottom: 8px; }
.sva-reassure { display: flex; gap: 8px; align-items: flex-start; font-size: 0.9rem; color: var(--sv-text-sub); padding: 10px 12px; border-radius: var(--sv-radius); background: rgba(165, 224, 74, 0.07); border: 1px solid rgba(165, 224, 74, 0.25); }
.sva-reassure svg { color: var(--sv-volt); flex: none; margin-top: 2px; }
.sva-flow-nav { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; }
.sva-flow-nav > :nth-child(2) { justify-self: center; }
@media (max-width: 999px) {
  .sva-flow-nav { position: sticky; bottom: 0; z-index: 6; margin-inline: calc(-1 * var(--sv-margin-mobile)); padding: 10px var(--sv-margin-mobile) calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(11, 18, 32, 0.97); border-top: 1px solid var(--sv-line-strong); }
  .sva-flow-nav .sv-btn-primary { min-width: 46vw; }
  .sva-flow-nav .sva-btn-text { display: none; }
}
.sva-chip-btn.is-active { background: var(--sv-cyan); border-color: var(--sv-cyan); color: #0b1220; font-weight: 600; }

/* Load cards */
.sva-loadcards { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); }
.sva-loadcard {
  display: grid; gap: 4px; justify-items: start; align-content: start; text-align: left; padding: 12px; min-height: 96px;
  border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line-strong); background: var(--sv-surface-elev);
  transition: border-color var(--sv-transition), background var(--sv-transition);
}
.sva-loadcard:hover:not(:disabled) { border-color: var(--sv-cyan); }
.sva-loadcard.is-on { border-color: var(--sv-cyan); background: rgba(63, 210, 242, 0.13); box-shadow: inset 0 0 0 1px var(--sv-cyan); }
.sva-loadcard.is-on .sva-loadcard-label::after { content: " \2713"; color: var(--sv-cyan); }
.sva-loadcard:disabled { cursor: default; opacity: 0.85; }
.sva-loadcard-emoji { font-size: 1.45rem; line-height: 1; }
.sva-loadcard-label { font-weight: 600; font-size: 0.9rem; line-height: 1.25; }
.sva-loadcard-kwh { font-size: 0.76rem; color: var(--sv-text-muted); font-variant-numeric: tabular-nums; }
.sva-loadcard.is-big:not(.is-on) { border-style: dashed; }
.sva-loadcard-add { border-style: dashed; color: var(--sv-text-sub); }

.sva-impact { padding: 16px; border-radius: var(--sv-radius-card); border: 1px solid rgba(255, 181, 71, 0.5); background: rgba(255, 181, 71, 0.07); }
.sva-impact > * + * { margin-top: 10px; }
.sva-impact-title { font-family: var(--font-heading); font-weight: 700; color: var(--sv-warn); }
.sva-impact-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.sva-impact-grid > div { display: grid; gap: 2px; }
.sva-impact-grid strong { font-family: var(--font-heading); font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.sva-assume { display: grid; gap: 8px; margin-top: 8px; }
.sva-assume-row { display: grid; gap: 8px; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.sva-assume-name { font-size: 0.9rem; }
@media (max-width: 520px) { .sva-assume-row { grid-template-columns: 1fr 1fr; } .sva-assume-row > :first-child { grid-column: 1 / -1; } }

/* Live profile */
.sva-prof { border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line-strong); background: var(--sv-surface); }
.sva-prof-summary { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; cursor: pointer; list-style: none; }
.sva-prof-summary::-webkit-details-marker { display: none; }
.sva-prof-title { font-family: var(--font-heading); font-weight: 700; font-size: 1rem; }
.sva-prof-brief { font-size: 0.82rem; color: var(--sv-text-sub); font-variant-numeric: tabular-nums; }
.sva-prof[open] .sva-prof-brief { display: none; }
.sva-prof-body { padding: 0 16px 16px; display: grid; gap: 14px; }
.sva-prof-list { display: grid; gap: 0; }
.sva-prof-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--sv-line); font-size: 0.9rem; }
.sva-prof-row dt { color: var(--sv-text-muted); }
.sva-prof-val { font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; border-radius: 4px; }
.sva-prof-val.is-changed { animation: sva-flash 0.9s ease-out; }
@keyframes sva-flash { 0% { background: rgba(63, 210, 242, 0.35); color: #fff; } 100% { background: transparent; } }
.sva-diff { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.sva-diff span { height: 6px; border-radius: 3px; background: var(--sv-surface-high); }
.sva-diff span.is-on { background: var(--sv-cyan); }
.sva-diff span.is-on:nth-child(3), .sva-diff span.is-on:nth-child(4) { background: var(--sv-warn); }
.sva-prof-kicker { display: block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sv-text-muted); margin-bottom: 4px; }
.sva-prof-direction strong { font-family: var(--font-heading); font-size: 1.05rem; color: var(--sv-cyan); }
.sva-prof-read ul { display: grid; gap: 8px; font-size: 0.86rem; color: var(--sv-text-sub); line-height: 1.5; }
.sva-prof-read li { padding-left: 12px; border-left: 2px solid var(--sv-cyan); }
.sva-prof-read:empty { display: none; }
.sva-prof-conf { display: grid; gap: 6px; }
@media (max-width: 999px) {
  .sva-flow-side { order: -1; position: sticky; top: calc(var(--sv-nav-height) + env(safe-area-inset-top, 0px) + 6px); z-index: 5; }
  .sva-prof { box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45); }
  .sva-prof-summary { flex-direction: row; justify-content: space-between; align-items: center; padding: 10px 14px; }
  .sva-prof-summary::after { content: "\25BE"; color: var(--sv-text-muted); }
  .sva-prof[open] .sva-prof-summary::after { content: "\25B4"; }
  .sva-prof[open] .sva-prof-body { max-height: 60vh; overflow-y: auto; }
}
@media (min-width: 1000px) { .sva-prof-summary { cursor: default; pointer-events: none; } }

/* Result */
.sva-example-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-radius: var(--sv-radius-card); border: 1px dashed var(--sv-cyan); background: rgba(63, 210, 242, 0.06); }
.sva-plan > .sva-best-main > .sva-eyebrow { margin-bottom: 4px; }
.sva-range-list { display: grid; gap: 0; }
.sva-range-list > div { display: grid; grid-template-columns: minmax(110px, 0.8fr) 1.4fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--sv-line); }
.sva-range-list > div:first-child { border-top: 0; }
.sva-range-list dt { color: var(--sv-text-muted); font-size: 0.88rem; }
.sva-range-list dd { font-weight: 600; font-size: 0.95rem; }
.sva-viz { display: grid; gap: 18px; padding-top: 16px; border-top: 1px solid var(--sv-line); }
.sva-viz-battery { display: flex; align-items: center; gap: 14px; }
.sva-viz-battery > div:last-child { display: grid; }
.sva-batt { width: 34px; height: 60px; border: 2px solid var(--sv-line-strong); border-radius: 6px; position: relative; display: flex; align-items: flex-end; padding: 2px; flex: none; }
.sva-batt::before { content: ""; position: absolute; top: -7px; left: 9px; width: 12px; height: 5px; border-radius: 2px 2px 0 0; background: var(--sv-line-strong); }
.sva-batt-fill { width: 100%; border-radius: 3px; background: var(--sv-cyan); transition: height 0.4s; }
.sva-viz-time { display: grid; gap: 6px; }
.sva-timeline { position: relative; height: 14px; border-radius: 999px; background: var(--sv-surface-high); margin-top: 22px; }
.sva-timeline-run { height: 100%; border-radius: 999px; background: var(--sv-volt); transition: width 0.4s; }
.sva-timeline-goal { position: absolute; top: -6px; bottom: -6px; width: 2px; background: var(--sv-text); }
.sva-timeline-goal span { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: 0.72rem; color: var(--sv-text-sub); padding-bottom: 2px; }
.sva-why { display: grid; gap: 10px; }
.sva-why li, .sva-know li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; font-size: 0.94rem; }
.sva-why svg, .sva-know svg { color: var(--sv-volt); flex: none; margin-top: 3px; }
.sva-know { display: grid; gap: 6px; }
.sva-know li { font-size: 0.88rem; color: var(--sv-text-sub); }
.sva-know-est li > span:first-child { color: var(--sv-warn); font-weight: 700; width: 15px; text-align: center; flex: none; }
.sva-circuits { display: flex; flex-wrap: wrap; gap: 8px; }
.sva-circuit { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--sv-line-strong); font-size: 0.86rem; color: var(--sv-text-muted); }
.sva-circuit-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--sv-surface-high); flex: none; }
.sva-circuit.is-on { border-color: var(--sv-cyan); color: var(--sv-text); background: rgba(63, 210, 242, 0.1); }
.sva-circuit.is-on .sva-circuit-dot { background: var(--sv-volt); box-shadow: 0 0 0 3px rgba(165, 224, 74, 0.2); }
.sva-circuit:hover { border-color: var(--sv-cyan); }
.sva-hogs { display: grid; gap: 14px; list-style: none; padding: 0; counter-reset: hog; }
.sva-hogs li { display: grid; gap: 6px; }
.sva-hog-head { display: flex; justify-content: space-between; gap: 12px; font-size: 0.95rem; }
.sva-hog-head strong::before { counter-increment: hog; content: counter(hog) ". "; color: var(--sv-text-muted); }
.sva-hog-head span { color: var(--sv-text-sub); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sva-hogs .sva-btn-text { justify-self: start; min-height: 36px; padding-left: 0; color: var(--sv-cyan); }
.sva-whatifs { display: flex; flex-wrap: wrap; gap: 8px; }
.sva-whatifs .sva-chip-btn { min-height: 44px; font-size: 0.9rem; text-align: left; }
.sva-whatif-result { padding: 16px; border-radius: var(--sv-radius-card); border: 1px solid var(--sv-cyan); background: var(--sv-surface); }
.sva-whatif-result > * + * { margin-top: 12px; }
.sva-table td.is-diff { color: var(--sv-text); font-weight: 600; background: rgba(63, 210, 242, 0.08); }
.sva-alts { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 760px) { .sva-alts { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }
.sva-alt { padding: 18px; border-radius: var(--sv-radius-card); border: 1px solid var(--sv-line); background: var(--sv-surface); display: grid; gap: 10px; align-content: start; }
.sva-alt.is-best { border-color: var(--sv-cyan); }
.sva-alt .sva-fit { justify-self: start; }
.sva-alt.is-best .sva-fit { background: var(--sv-cyan); border-color: var(--sv-cyan); color: #0b1220; }
.sva-alt h4 { font-size: 1.1rem; }
.sva-alt-list { display: grid; }
.sva-alt-list > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid var(--sv-line); font-size: 0.88rem; }
.sva-alt-list dt { color: var(--sv-text-muted); }
.sva-alt-list dd { text-align: right; }
.sva-alt-list dd strong { color: var(--sv-cyan); letter-spacing: 0.05em; }
.sva-explain .sva-strategies { margin-bottom: 10px; }

/* Saved-home strip on the standalone tools */
.sva-homebar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 10px 14px; border-radius: var(--sv-radius); border: 1px solid var(--sv-line-strong); background: var(--sv-surface); font-size: 0.86rem; color: var(--sv-text-sub); }
.sva-homebar strong { color: var(--sv-text); }
.sva-homebar-actions { display: inline-flex; align-items: center; gap: 14px; }
.sva-homebar .sva-btn-text { min-height: 32px; padding: 0; font-size: 0.86rem; }

@media print {
  .sva-flow { display: block !important; }
  .sva-flow-side, .sva-progress, .sva-whatifs, .sva-example-bar, .sva-homebar, .sva-circuits + .sva-hint { display: none !important; }
  .sva-circuit:not(.is-on) { display: none; }
  .sva-alt, .sva-whatif-result { background: #fff; border-color: #999; }
}
@media (prefers-reduced-motion: reduce) { .sva-prof-val.is-changed { animation: none; } }