:root{--blue:#1769e0;--blue-strong:#0d54bd;--blue-soft:#edf5ff;--ink:#17202c;--body:#475467;--muted:#667085;--canvas:#fff;--surface:#f7f9fc;--line:#e4e8ef;--line-strong:#cbd2dc;--success:#17785b;--warning:#9a5b08;--danger:#c9364f;--shadow:0 1px 2px rgba(16,24,40,.04);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--canvas);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;line-height:1.55;color:var(--body);overflow-wrap:anywhere}a{color:var(--blue);text-underline-offset:3px}a:hover{color:var(--blue-strong)}:focus-visible{outline:3px solid rgba(23,105,224,.35);outline-offset:3px;border-radius:4px}.skip-link{position:fixed;top:8px;left:8px;z-index:10;background:#fff;padding:10px;transform:translateY(-150%)}.skip-link:focus{transform:none}.site-header,main,footer{width:min(1120px,calc(100% - 40px));margin-inline:auto}.site-header{height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:9px;color:var(--ink);font-weight:760;text-decoration:none;letter-spacing:-.02em}.mark{width:24px;height:24px;fill:var(--blue)}.site-header nav,footer nav{display:flex;align-items:center;gap:24px}.site-header nav a,footer nav a{color:var(--body);font-size:.9rem;text-decoration:none}.site-header nav a:hover,footer nav a:hover{color:var(--ink)}main{padding:72px 0 96px;min-height:70vh}h1,h2,h3{color:var(--ink);letter-spacing:-.035em;margin:0}h1{font-size:clamp(2.55rem,6vw,4.6rem);line-height:1.03;max-width:900px}h2{font-size:clamp(1.65rem,3vw,2.35rem);line-height:1.16}h3{font-size:1.15rem}p,li{max-width:760px}.kicker{font-size:.75rem;font-weight:780;letter-spacing:.12em;color:var(--blue);margin:0 0 14px}.lede,.page-intro>p:last-child{font-size:clamp(1.05rem,2vw,1.25rem);color:var(--muted);max-width:700px}.hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.65fr);gap:72px;align-items:end;padding:20px 0 64px}.hero .lede{margin:24px 0}.actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.button{border:0;background:var(--blue);color:#fff;border-radius:8px;min-height:46px;padding:12px 18px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}.button:hover{background:var(--blue-strong);color:#fff}.text-link{font-weight:650;text-decoration:none}.hero-readout{border-top:2px solid var(--ink);border-bottom:1px solid var(--line);padding:22px 0}.hero-readout span,.hero-readout strong,.hero-readout small{display:block}.hero-readout span{font-weight:650;color:var(--ink)}.hero-readout strong{font-size:clamp(2.4rem,5vw,4rem);line-height:1.2;letter-spacing:-.05em;font-variant-numeric:tabular-nums}.hero-readout small{color:var(--muted)}.source-note{display:flex;align-items:center;gap:14px;border:1px solid var(--line);background:var(--surface);padding:10px 14px;font-size:.83rem}.source-note strong{color:var(--success)}.source-note span{flex:1}.section-block{padding:72px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-head p{margin:0}.appliance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.appliance-card{padding:22px;min-height:145px;display:flex;flex-direction:column;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none}.appliance-card span{font-weight:670}.appliance-card strong{margin:auto 0 8px;font-size:1.45rem;font-variant-numeric:tabular-nums}.appliance-card small{color:var(--muted)}.appliance-card:hover{background:var(--surface)}.trust-band,.summary-band{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line)}.trust-band>div{padding:24px 24px 24px 0}.trust-band strong,.trust-band span,.summary-band span,.summary-band strong,.summary-band small{display:block}.trust-band span{font-size:.9rem;color:var(--muted)}.page-intro{padding-bottom:44px;max-width:920px}.page-intro h1{margin-bottom:20px}.calculator{border:1px solid var(--line-strong);padding:clamp(22px,4vw,38px);box-shadow:var(--shadow);margin-bottom:22px}.input-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.input-grid label,.table-tools label{font-size:.85rem;font-weight:680;color:var(--ink)}label span{font-weight:450;color:var(--muted)}input,select{display:block;width:100%;min-height:46px;margin-top:7px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:7px;background:#fff;color:var(--ink);font:inherit;font-variant-numeric:tabular-nums}input:hover,select:hover{border-color:#98a2b3}input:focus,select:focus{border-color:var(--blue);outline:3px solid rgba(23,105,224,.13)}.calculate{margin-top:16px}.answer{margin-top:26px;border-top:1px solid var(--line);padding-top:26px;display:grid;grid-template-columns:1.05fr 2fr;gap:32px}.primary-result{padding-right:32px;border-right:1px solid var(--line)}.primary-result span,.primary-result strong,.primary-result small{display:block}.primary-result strong{color:var(--ink);font-size:clamp(2.8rem,6vw,4.4rem);line-height:1.08;letter-spacing:-.055em;font-variant-numeric:tabular-nums}.result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.result-grid span{display:block;font-size:.8rem;color:var(--muted)}.result-grid strong{font-size:1.25rem;color:var(--ink);font-variant-numeric:tabular-nums}.formula{font-size:.82rem;color:var(--muted);margin:24px 0 0}.chart-section{border-top:1px solid var(--line);margin-top:28px;padding-top:28px}.chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:18px}.chart-grid figure{margin:0}.chart-grid figcaption strong,.chart-grid figcaption span{display:block}.chart-grid figcaption span{font-size:.82rem;color:var(--muted)}.bars{margin-top:18px}.bar-row{margin:12px 0}.bar-label{display:flex;justify-content:space-between;gap:16px;font-size:.82rem}.bar-label strong{font-variant-numeric:tabular-nums;color:var(--ink)}.bar-track{height:8px;background:var(--surface);margin-top:5px}.bar-track i{display:block;height:100%;background:#9bb9df}.bar-row.current .bar-track i{background:var(--blue)}.bar-row.current .bar-label span{font-weight:700;color:var(--blue)}.content-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:72px;margin-top:72px}.content-grid h2,.rate-compare h2{margin-bottom:16px}.note{border-left:3px solid var(--blue);padding-left:20px}.note strong{color:var(--ink)}.compact .chart-section{display:none}.rate-compare{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;margin-top:64px;padding:32px 0;border-block:1px solid var(--line)}.mini-bars{align-self:center}.related a{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}.related a span{color:var(--blue);font-size:.82rem}.summary-band{grid-template-columns:repeat(4,1fr);margin-bottom:20px}.summary-band>div{padding:22px;border-right:1px solid var(--line)}.summary-band>div:last-child{border-right:0}.summary-band span{font-size:.78rem;color:var(--muted)}.summary-band strong{font-size:1.5rem;color:var(--ink);font-variant-numeric:tabular-nums}.summary-band small{font-size:.76rem}.rates-tool{margin-top:44px}.table-tools{display:grid;grid-template-columns:minmax(240px,1fr) 220px;gap:16px;align-items:end}.table-status{font-size:.82rem;color:var(--muted)}.table-wrap{overflow-x:auto;border:1px solid var(--line)}table{width:100%;border-collapse:collapse;min-width:760px;font-size:.9rem}th,td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}thead th{position:sticky;top:0;background:var(--surface);font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}tbody th{color:var(--ink)}tbody th small{display:block;color:var(--muted);font-weight:450}tbody tr:hover,tbody tr.selected{background:var(--blue-soft)}td[data-label="Rate"] strong,td[data-label="Rate"] span{display:inline}.delta{color:var(--muted)}.relative-bar{display:block;width:130px;height:8px;background:#edf0f4}.relative-bar i{display:block;width:var(--bar);height:100%;background:var(--blue)}.use-rate{font-weight:650;white-space:nowrap}.empty-state{text-align:center;padding:48px;border:1px solid var(--line);border-top:0}.empty-state strong{color:var(--ink)}.data-context,.prose{max-width:800px;margin-top:64px}.data-context h2,.prose h2{margin-top:42px}.data-context p,.prose p,.prose li{color:var(--body)}footer{border-top:1px solid var(--line);padding:36px 0 48px;display:grid;grid-template-columns:1fr auto;gap:22px 44px;font-size:.86rem}footer p{margin:8px 0;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
@media(max-width:820px){.site-header{height:auto;padding:16px 0;align-items:flex-start;gap:14px}.site-header nav{gap:12px 18px;justify-content:flex-end;flex-wrap:wrap}.hero{grid-template-columns:1fr;gap:38px}.appliance-grid{grid-template-columns:repeat(2,1fr)}.input-grid{grid-template-columns:1fr 1fr}.answer{grid-template-columns:1fr}.primary-result{border-right:0;border-bottom:1px solid var(--line);padding:0 0 24px}.chart-grid,.content-grid,.rate-compare{grid-template-columns:1fr;gap:28px}.summary-band{grid-template-columns:1fr 1fr}.summary-band>div:nth-child(2){border-right:0}.summary-band>div:nth-child(-n+2){border-bottom:1px solid var(--line)}footer{grid-template-columns:1fr}footer nav{flex-wrap:wrap}}
@media(max-width:560px){.site-header,main,footer{width:min(100% - 28px,1120px)}main{padding:46px 0 72px}.site-header{display:block}.site-header nav{margin-top:14px;justify-content:flex-start;font-size:.84rem}.hero{padding-top:0}.hero h1{font-size:2.7rem}.section-head{display:block}.appliance-grid,.input-grid,.result-grid{grid-template-columns:1fr}.appliance-card{min-height:120px}.trust-band{grid-template-columns:1fr}.trust-band>div{padding:18px 0;border-bottom:1px solid var(--line)}.calculator{padding:20px 16px}.chart-grid{grid-template-columns:1fr}.summary-band{grid-template-columns:1fr 1fr}.summary-band>div{padding:15px 12px}.summary-band strong{font-size:1.2rem}.source-note{align-items:flex-start;flex-wrap:wrap}.source-note span{flex-basis:60%}.table-tools{grid-template-columns:1fr}.table-wrap{overflow-x:visible;border:0}table{min-width:0}thead,.bar-cell,.delta{display:none}tbody,tbody tr,tbody th,tbody td{display:block}tbody tr{position:relative;border:1px solid var(--line);margin-bottom:10px;padding:12px 104px 12px 48px}tbody td,tbody th{border:0;padding:2px 0}tbody td:first-child{position:absolute;left:14px;top:14px}tbody td[data-label="Rate"]{font-size:1.05rem}tbody td:last-child{position:absolute;right:12px;top:50%;transform:translateY(-50%)}.rate-compare{margin-top:44px}.page-intro{padding-bottom:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Color modes use semantic aliases so every existing component follows one contract. */
:root{--page:var(--canvas);--surface-raised:#fff;--text-strong:var(--ink);--text:var(--body);--text-muted:var(--muted);--border:var(--line);--border-strong:var(--line-strong);--accent:var(--blue);--accent-strong:var(--blue-strong);--accent-soft:var(--blue-soft);--focus:rgba(23,105,224,.38);--bar-neutral:#8aa9cf;color-scheme:light}
:root[data-theme="dark"]{--blue:#7eb6ff;--blue-strong:#a7ccff;--blue-soft:#172b43;--ink:#f2f5f8;--body:#c4ced9;--muted:#9eacba;--canvas:#101820;--surface:#17222d;--surface-raised:#131e28;--line:#334352;--line-strong:#506274;--success:#67d6b0;--warning:#f1bd6b;--danger:#ff8fa2;--focus:rgba(126,182,255,.55);--bar-neutral:#7597bd;--shadow:0 1px 2px rgba(0,0,0,.32);color-scheme:dark}
html,body{background:var(--canvas)}body,.site-header,main,footer,.calculator,.appliance-card,.summary-band,.table-wrap,.empty-state{transition:background-color 120ms ease,border-color 120ms ease,color 120ms ease}
.skip-link{background:var(--surface-raised);color:var(--ink)}
.header-actions{display:flex;align-items:center;gap:22px}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:76px;min-height:44px;padding:7px 10px;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface-raised);color:var(--ink);font:inherit;font-size:.78rem;font-weight:680;cursor:pointer}.theme-toggle:hover{border-color:var(--blue);background:var(--surface)}.theme-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.theme-icon .sun{display:none}:root[data-theme="dark"] .theme-icon .sun{display:block}:root[data-theme="dark"] .theme-icon .moon{display:none}
input,select{background:var(--surface-raised);color:var(--ink)}input:hover,select:hover{border-color:var(--line-strong)}input:focus,select:focus{outline-color:color-mix(in srgb,var(--blue) 28%,transparent)}
.button{color:#fff}:root[data-theme="dark"] .button{background:#3f8ff0;color:#071421}:root[data-theme="dark"] .button:hover{background:#65a9f7;color:#071421}
.bar-track,.relative-bar{background:var(--surface)}.bar-track i{background:var(--bar-neutral)}.bar-row.current .bar-track i,.relative-bar i{background:var(--blue)}
@media(max-width:820px){.header-actions{align-items:flex-start;gap:14px}.theme-toggle{flex:0 0 auto}}
@media(max-width:560px){.site-header{display:grid;grid-template-columns:1fr auto;align-items:center}.header-actions{display:contents}.site-header nav{grid-column:1/-1;grid-row:2}.theme-toggle{grid-column:2;grid-row:1;min-width:72px}.theme-label{display:inline}}
@media(prefers-reduced-motion:reduce){body,.site-header,main,footer,.calculator,.appliance-card,.summary-band,.table-wrap,.empty-state{transition:none}}

/* v2.2 utility conveniences and savings board */
.global-state{width:min(1120px,calc(100% - 40px));margin:0 auto;display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.8rem}.global-state label{font-weight:720;color:var(--ink)}.global-state select{width:auto;min-width:190px;min-height:36px;margin:0;padding:5px 30px 5px 9px}.global-state span{color:var(--muted);flex:1}.recent{position:fixed;z-index:5;right:16px;bottom:16px;width:min(300px,calc(100% - 32px));padding:13px 15px;border:1px solid var(--line-strong);background:var(--surface-raised);box-shadow:var(--shadow);font-size:.8rem}.recent strong{display:block;color:var(--ink);margin-bottom:6px}.recent div{display:grid;gap:4px}.recent a{text-decoration:none}.rate-context{display:block;margin-top:6px;color:var(--muted);font-weight:450;line-height:1.35}.form-error{margin:12px 0 0;color:var(--danger);font-weight:650}.lower-cost{border-top:1px solid var(--line);margin-top:24px;padding-top:22px}.lower-cost h3{margin-bottom:10px}.lower-cost [data-context-tips]{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:10px}.lower-cost [data-context-tips] a{padding:12px;background:var(--surface-raised);text-decoration:none;font-size:.86rem;font-weight:650}.feedback{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:.8rem}.feedback>span{font-weight:680;color:var(--ink)}.feedback button{min-height:36px;padding:5px 10px;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface-raised);color:var(--ink);font:inherit;cursor:pointer}.feedback button:hover,.feedback button[aria-pressed="true"]{border-color:var(--blue);background:var(--blue-soft)}.feedback small{color:var(--success)}.tip-filters{display:flex;gap:10px 18px;flex-wrap:wrap;padding:14px 0;border-block:1px solid var(--line);margin-bottom:34px}.tip-filters a{font-size:.85rem;font-weight:650;text-decoration:none}.savings-board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:start}.tip-lane{min-width:0}.tip-lane>header{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding-bottom:10px;border-bottom:2px solid var(--ink);margin-bottom:12px}.tip-lane>header h2{font-size:1rem;letter-spacing:-.02em}.tip-lane>header span{font-size:.72rem;color:var(--muted);white-space:nowrap}.tip-card{border-bottom:1px solid var(--line);padding:14px 0 18px;scroll-margin-top:20px}.tip-card h2{font-size:1.03rem;line-height:1.25;margin-bottom:12px}.tip-category{display:none}.tip-card dl{margin:0}.tip-card dl div{margin:10px 0}.tip-card dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:760}.tip-card dd{margin:2px 0 0;font-size:.82rem;line-height:1.45}.tip-actions{display:grid;gap:6px;margin:13px 0 8px}.tip-actions a{font-size:.78rem;font-weight:680;text-decoration:none}.tip-actions .tip-source{font-weight:500;color:var(--muted);text-decoration:underline}.tip-card>small{font-size:.68rem;color:var(--muted)}.tip-card .feedback{display:grid;grid-template-columns:auto auto 1fr;gap:5px;margin-top:12px}.tip-card .feedback>span{grid-column:1/-1}.tip-card .feedback small{grid-column:1/-1}.tip-trust{margin-top:48px;padding:22px 0;border-block:1px solid var(--line)}.tip-trust strong{color:var(--ink)}.tip-trust p{margin:6px 0 10px}
@media(max-width:1000px){.savings-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.tip-lane:last-child{grid-column:1/-1}.site-header nav,.site-header nav a{gap:12px;font-size:.79rem}.header-actions{gap:12px}}
.tip-card h3{font-size:1.03rem;line-height:1.25;margin-bottom:12px}
@media(max-width:820px){.global-state{width:min(100% - 28px,1120px);flex-wrap:wrap}.global-state span{order:3;flex-basis:100%}.lower-cost [data-context-tips]{grid-template-columns:1fr}}
@media(max-width:560px){.global-state{align-items:flex-end}.global-state label{flex-basis:100%}.global-state select{min-width:0;flex:1}.recent{position:static;margin:12px 14px 0;width:auto}.savings-board{grid-template-columns:1fr;gap:34px}.tip-lane:last-child{grid-column:auto}.feedback{flex-wrap:wrap}.feedback small{flex-basis:100%}}
