:root{--bg:#06111f;--panel:#0a192a;--panel2:#0d1d30;--line:rgba(255,255,255,.11);--text:#f3f7fb;--muted:#9fb0c3;--accent:#7ee7b7;--accent2:#72b8ff;--warn:#ffd280;--danger:#ff9f9f;--shadow:0 24px 70px rgba(0,0,0,.28)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 82% 4%,rgba(71,132,196,.14),transparent 27rem),radial-gradient(circle at 12% 18%,rgba(71,196,147,.08),transparent 25rem),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}.site-header{width:min(1440px,calc(100% - 40px));height:82px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand img{display:block;width:228px;height:auto}.site-header nav{display:flex;gap:28px}.site-header nav a{text-decoration:none;color:var(--muted);font-size:.92rem}.site-header nav a:hover{color:var(--text)}main{width:min(1440px,calc(100% - 40px));margin:auto}.breadcrumbs{display:flex;gap:8px;padding-top:20px;color:#7f92a7;font-size:.72rem}.breadcrumbs a{text-decoration:none;color:var(--muted)}.hero{padding:72px 0 42px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(330px,.7fr);gap:55px;align-items:center}.eyebrow,.step{color:var(--accent);font-size:.72rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.8rem,6vw,5.6rem);letter-spacing:-.055em;line-height:.95;margin-bottom:24px;max-width:900px}.lede{color:#c4d1de;font-size:clamp(1.05rem,2vw,1.35rem);max-width:880px}.hero-trust{display:flex;flex-wrap:wrap;gap:10px 20px;color:var(--muted);font-size:.83rem}.hero-card{padding:28px;border:1px solid rgba(126,231,183,.24);border-radius:20px;background:linear-gradient(145deg,rgba(126,231,183,.08),rgba(114,184,255,.04));box-shadow:var(--shadow)}.hero-card strong{font-size:1.25rem}.hero-card p{color:var(--muted);margin:10px 0 24px}.hero-card a{display:flex;justify-content:space-between;text-decoration:none;color:var(--accent);font-weight:800}.notice{padding:16px 18px;margin-bottom:26px;border:1px solid rgba(126,231,183,.25);background:rgba(126,231,183,.055);border-radius:12px;color:var(--muted);font-size:.88rem}.notice strong{color:var(--text)}.usage-panel,.table-card{border:1px solid var(--line);border-radius:20px;background:rgba(10,25,42,.84);box-shadow:var(--shadow)}.usage-panel{padding:26px}.section-heading{display:flex;justify-content:space-between;gap:30px;align-items:flex-start;margin-bottom:22px}.section-heading h2{font-size:clamp(1.8rem,3vw,2.7rem);letter-spacing:-.04em;line-height:1.05;margin-bottom:8px}.section-heading p:last-child{color:var(--muted);margin-bottom:0}.secondary-button{border:1px solid var(--line);border-radius:999px;color:var(--muted);background:transparent;padding:9px 14px;white-space:nowrap}.secondary-button:hover{color:var(--text);border-color:rgba(126,231,183,.5)}.usage-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.field{display:block;min-width:0}.field>span:first-child{display:block;color:var(--muted);font-size:.77rem;margin:0 0 7px 2px}.field small{display:block;color:#71859a;font-size:.66rem;line-height:1.35;margin-top:3px}.input-wrap{display:flex;align-items:center;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:10px;overflow:hidden}.input-wrap:focus-within{border-color:rgba(126,231,183,.65);box-shadow:0 0 0 3px rgba(126,231,183,.08)}.input-wrap input,.input-wrap select{width:100%;min-width:0;border:0;outline:0;color:var(--text);background:transparent;padding:11px 10px}.input-wrap select option{color:#08131f}.input-wrap i{color:#8194a9;font-style:normal;font-size:.68rem;white-space:nowrap;padding:0 10px}.batteries-section,.results-section{padding:76px 0 0}.battery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.battery-card{border:1px solid var(--line);border-radius:18px;background:rgba(10,25,42,.78);overflow:hidden}.battery-card.inactive{opacity:.58}.battery-card-header{padding:18px 18px 14px;display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line)}.battery-number{color:var(--accent);font-size:.68rem;font-weight:850;letter-spacing:.12em}.enable-toggle{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.7rem}.enable-toggle input{accent-color:var(--accent)}.battery-fields{padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:11px}.battery-fields .span2{grid-column:1/-1}.battery-fields .field>span:first-child{font-size:.7rem}.battery-fields input,.battery-fields select{padding:9px}.mini-summary{grid-column:1/-1;border-top:1px solid var(--line);padding-top:13px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-summary div{padding:9px;border-radius:9px;background:rgba(255,255,255,.025)}.mini-summary span{display:block;color:var(--muted);font-size:.6rem}.mini-summary strong{font-size:.86rem}.winner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:18px}.winner{padding:22px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025)}.winner.primary{border-color:rgba(126,231,183,.35);background:linear-gradient(145deg,rgba(126,231,183,.09),rgba(114,184,255,.035))}.winner-label{color:var(--accent);font-size:.67rem;font-weight:850;letter-spacing:.13em}.winner h3{font-size:1.5rem;margin:8px 0 6px;letter-spacing:-.03em}.winner p{color:var(--muted);font-size:.78rem;margin:0}.table-card{overflow:hidden}.table-heading{padding:22px 24px 14px}.table-heading h3{margin-bottom:4px}.table-heading p{color:var(--muted);font-size:.76rem}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:1080px}th,td{padding:14px 13px;text-align:left;border-top:1px solid var(--line);font-size:.76rem}th{color:var(--muted);font-size:.65rem;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;background:rgba(0,0,0,.09)}th:hover{color:var(--text)}td strong{display:block;font-size:.85rem}.sub{color:var(--muted);font-size:.65rem}.pill{display:inline-block;padding:4px 7px;border-radius:999px;font-size:.62rem;font-weight:800}.good{background:rgba(126,231,183,.11);color:var(--accent)}.warn{background:rgba(255,210,128,.11);color:var(--warn)}.bad{background:rgba(255,159,159,.1);color:var(--danger)}.score{font-size:1rem;font-weight:850}.explain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:18px}.explain-grid article{padding:20px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}.explain-grid h3{font-size:1rem}.explain-grid p{color:var(--muted);font-size:.75rem;margin:0}.methodology{padding:46px 0 90px;max-width:1000px}.methodology details{border-top:1px solid var(--line)}.methodology details:last-child{border-bottom:1px solid var(--line)}.methodology summary{list-style:none;padding:19px 30px 19px 0;font-weight:750;cursor:pointer;position:relative}.methodology summary::-webkit-details-marker{display:none}.methodology summary:after{content:"+";position:absolute;right:2px;color:var(--muted)}.methodology details[open] summary:after{content:"−"}.methodology details div{color:var(--muted);font-size:.85rem;max-width:900px;padding-bottom:16px}footer{width:min(1440px,calc(100% - 40px));margin:auto;padding:32px 0 44px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:.8rem}footer strong{color:var(--text)}footer p{margin:3px 0 0}footer a{text-decoration:none}
@media(max-width:1050px){.usage-grid{grid-template-columns:1fr 1fr}.battery-grid{grid-template-columns:1fr 1fr}.hero{grid-template-columns:1fr}.winner-grid,.explain-grid{grid-template-columns:1fr}}
@media(max-width:700px){.site-header{width:min(100% - 28px,1440px);height:70px}.site-header nav a:not(:last-child){display:none}.brand img{width:185px}main,footer{width:min(100% - 28px,1440px)}.breadcrumbs{padding-top:14px}.hero{padding:46px 0 28px;gap:24px}h1{font-size:2.85rem}.hero-trust{display:grid}.usage-panel{padding:18px}.section-heading{display:block}.secondary-button{margin-top:14px}.usage-grid,.battery-grid{grid-template-columns:1fr}.battery-fields{grid-template-columns:1fr 1fr}.batteries-section,.results-section{padding-top:58px}.winner-grid{grid-template-columns:1fr}.explain-grid{grid-template-columns:1fr}footer{display:block}footer a{display:inline-block;margin-top:18px}}
.preset-intro{display:flex;gap:14px;align-items:baseline;padding:14px 16px;margin-bottom:16px;border:1px solid rgba(114,184,255,.22);border-radius:12px;background:rgba(114,184,255,.05)}.preset-intro span{color:var(--muted);font-size:.78rem}.preset-meta{padding:10px 11px;border-radius:10px;background:rgba(114,184,255,.055);border:1px solid rgba(114,184,255,.14)}.preset-meta strong,.preset-meta span{display:block}.preset-meta strong{font-size:.7rem}.preset-meta span{color:var(--muted);font-size:.62rem;margin-top:3px}.preset-meta a{color:var(--accent2)}.recommendation{display:grid;grid-template-columns:.75fr 1.25fr;gap:24px;padding:24px;margin:0 0 18px;border-radius:18px;border:1px solid rgba(126,231,183,.28);background:linear-gradient(145deg,rgba(126,231,183,.08),rgba(114,184,255,.035))}.recommendation h3{font-size:1.45rem;margin-bottom:0}.recommendation ul{margin:0;padding-left:20px;color:#c8d5e2;font-size:.82rem}.recommendation li+li{margin-top:7px}.recommendation-note{grid-column:1/-1;margin:0;color:var(--muted);font-size:.7rem;border-top:1px solid var(--line);padding-top:12px}@media(max-width:700px){.preset-intro{display:block}.preset-intro span{display:block;margin-top:5px}.recommendation{grid-template-columns:1fr}}
.status-panel{padding:11px;border-radius:10px;background:rgba(255,255,255,.025);border:1px solid var(--line)}.status-panel p{margin:7px 0 0;color:var(--muted);font-size:.66rem}.status-badge{display:inline-block;padding:5px 8px;border-radius:999px;font-size:.62rem;font-weight:850;letter-spacing:.03em}.status-available{background:rgba(126,231,183,.13);color:var(--accent)}.status-upcoming{background:rgba(114,184,255,.13);color:var(--accent2)}.status-administration,.status-discontinued{background:rgba(255,159,159,.12);color:var(--danger)}.status-custom{background:rgba(255,255,255,.08);color:var(--muted)}.mini-summary{grid-template-columns:repeat(3,1fr)}.status-legend{padding:65px 0 0}.status-legend h2{font-size:clamp(1.7rem,3vw,2.5rem);letter-spacing:-.04em}.status-legend>div{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.status-legend article{padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}.status-legend p{margin:10px 0 0;color:var(--muted);font-size:.75rem}@media(max-width:800px){.status-legend>div{grid-template-columns:1fr}.mini-summary{grid-template-columns:1fr}}


/* v5: no-solar savings calculator and support cards */
.savings-calculator{padding:70px 0 0}.savings-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:18px}.savings-inputs,.savings-results{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025);padding:22px}.savings-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.savings-inputs .span2{grid-column:1/-1}.savings-inputs select{width:100%;min-height:46px;color:var(--text);background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:10px;padding:0 10px}.savings-inputs select option{color:#08131f}.savings-results{background:linear-gradient(145deg,rgba(114,184,255,.07),rgba(126,231,183,.035))}.savings-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:14px}.savings-result-grid article{padding:15px;border:1px solid var(--line);border-radius:13px;background:rgba(0,0,0,.13)}.savings-result-grid article.highlight{border-color:rgba(126,231,183,.32);background:rgba(126,231,183,.075)}.savings-result-grid span,.savings-result-grid small{display:block;color:var(--muted);font-size:.68rem}.savings-result-grid strong{display:block;font-size:1.35rem;margin:5px 0}.savings-verdict{margin-top:13px;padding:14px;border-radius:12px;border:1px solid var(--line);font-size:.78rem;color:#cbd8e5}.savings-verdict.good{border-color:rgba(126,231,183,.3);background:rgba(126,231,183,.07)}.savings-verdict.caution{border-color:rgba(255,198,110,.28);background:rgba(255,198,110,.06)}.calculator-caveat{color:var(--muted);font-size:.66rem;line-height:1.55;margin:13px 0 0}.support-considered{margin:70px 0 0;padding:24px;border:1px solid rgba(126,231,183,.22);border-radius:18px;background:radial-gradient(circle at 85% 0%,rgba(126,231,183,.09),transparent 22rem),rgba(255,255,255,.02)}.support-intro{max-width:820px;margin-bottom:18px}.support-intro h2{font-size:clamp(1.6rem,3vw,2.35rem);margin-bottom:8px}.support-intro>p:last-child{color:var(--muted);margin-bottom:0}.support-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.support-card{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;min-width:0;padding:15px;border:1px solid rgba(255,255,255,.10);border-radius:12px;color:var(--text);text-decoration:none;transition:transform .18s ease,border-color .18s ease,filter .18s ease}.support-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.24);filter:brightness(1.04)}.support-card>span:nth-child(2){display:flex;flex-direction:column;min-width:0}.support-card strong{font-size:.88rem}.support-card small{color:rgba(255,255,255,.72);font-size:.69rem;margin-top:3px}.support-card i{color:rgba(255,255,255,.75);font-style:normal}.support-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:rgba(0,0,0,.16);font-size:1.2rem}.support-kofi{background:linear-gradient(135deg,rgba(231,65,87,.85),rgba(190,42,75,.82))}.support-octopus{background:linear-gradient(135deg,rgba(143,56,216,.80),rgba(89,46,170,.80))}.support-youtube{background:linear-gradient(135deg,rgba(211,31,31,.82),rgba(128,15,15,.82))}.support-member{background:linear-gradient(135deg,rgba(28,105,177,.82),rgba(18,61,118,.82))}.support-disclosure{color:#8194a9;font-size:.69rem;margin:14px 0 0}@media(max-width:850px){.savings-layout{grid-template-columns:1fr}}@media(max-width:620px){.savings-inputs,.savings-result-grid,.support-grid{grid-template-columns:1fr}.savings-inputs .span2{grid-column:auto}.support-card{grid-template-columns:42px 1fr auto}}

/* v6 optional export and backup information */
.export-option{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px;background:rgba(255,255,255,.035)}
.export-option p{margin:7px 0 0;color:var(--muted);font-size:.88rem;line-height:1.45}
.export-toggle{justify-content:flex-start;gap:10px;font-weight:750}
.export-field{transition:opacity .2s ease}
.export-field.disabled{opacity:.42}
.pill.warn{background:rgba(245,181,66,.13);color:#f5c76d;border-color:rgba(245,181,66,.28)}

/* v9.4 export benefit breakdown card */
.savings-result-grid .export-result{grid-column:1/-1}

/* v8 restrained branded hero */
.hero-image{width:min(1080px,100%);margin:0 auto 30px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#07111d;box-shadow:0 16px 44px rgba(0,0,0,.2)}
.hero-image img{display:block;width:100%;height:clamp(190px,22vw,300px);object-fit:cover;object-position:center}
.hero{padding:58px 0 34px}
@media(max-width:700px){.hero{padding:40px 0 24px}.hero-image{margin-bottom:22px;border-radius:12px}.hero-image img{height:170px;object-position:center}}

/* v9 compact hero, aligned with the Home Energy Investment Calculator */
.hero{padding:52px 0 30px;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:34px;align-items:center}
.hero-image{width:100%;margin:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#07111d;box-shadow:0 10px 28px rgba(0,0,0,.18);aspect-ratio:16/9}
.hero-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:42% center}
@media(max-width:1050px){.hero{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:26px}}
@media(max-width:820px){.hero{grid-template-columns:1fr;padding:40px 0 26px}.hero-image{max-width:620px;aspect-ratio:16/8;margin-top:4px}}
@media(max-width:700px){.hero-image{max-width:none;aspect-ratio:16/8.5;border-radius:12px}.hero-image img{object-position:40% center}}
.version-badge{color:var(--muted);font-size:.78rem;margin-top:16px}
.version-badge a{color:var(--accent);text-decoration:none;font-weight:700}
.version-badge a:hover{text-decoration:underline}