#main{--bg:#dceaf3;--panel:#f2f7fbc9;--text:#16344b;--muted:#496478;--line:#abc3d3;--green:#176952;--orange:#a54b17;--shadow:0 14px 45px #244a6a15}#main *{box-sizing:border-box}#main{max-width:1280px;margin:auto;padding:22px 32px}#main a{color:var(--green)}#main button,#main input,#main select{font:inherit}#main button{cursor:pointer;border:1px solid var(--line);padding:9px 16px;background:var(--panel);color:var(--text);border-radius:30px}#main button:hover{border-color:var(--green)}#main button[aria-pressed=true]{background:#176952;color:white;border-color:#176952}#main button:focus-visible,#main a:focus-visible,#main input:focus-visible,#main summary:focus-visible,#main [tabindex]:focus-visible{outline:3px solid #cb650f;outline-offset:3px}#main .hero{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;padding:55px 0}#main .eyebrow{text-transform:uppercase;letter-spacing:.15em;color:var(--orange);font-size:12px;font-weight:800}#main h1{font-size:clamp(42px,5.8vw,76px);line-height:1.04;letter-spacing:-.055em;margin:18px 0}#main h2{font-size:clamp(29px,3vw,43px);letter-spacing:-.035em;line-height:1.2;margin:12px 0 20px}#main h3{line-height:1.3}#main .lead{font-size:20px;max-width:650px}#main .scope,#main .caption{font-size:12px;color:var(--muted)}#main p{color:var(--muted)}#main .hero-art{position:relative;min-height:290px;background:linear-gradient(140deg,#09283e,#0b1724);border-radius:35px;overflow:hidden;box-shadow:var(--shadow);color:#d3f3ff}#main .sun{font-size:90px;color:#ffd17a;position:absolute;top:0;left:28px}#main .pv{position:absolute;bottom:50px;left:25px;font-size:45px;line-height:.9;transform:skew(-8deg);color:#6db4df}#main .bat{position:absolute;right:40px;top:45px;width:100px;height:180px;border:2px solid #8cdec0;border-radius:16px;padding:13px;display:flex;gap:6px;flex-direction:column}#main .bat i{display:block;flex:1;background:#49c596;border-radius:3px;opacity:.8}#main .art-note{position:absolute;bottom:15px;text-align:center;width:100%;font-size:10px;letter-spacing:.2em}#main .modebar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:20px 0;border-block:1px solid var(--line)}#main .modebar span{margin-right:auto;font-weight:700}#main nav{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 40px}#main nav a{padding:8px 14px;border:1px solid var(--line);border-radius:20px;text-decoration:none;font-size:13px}#main section[id]{margin:0 0 30px;padding:30px;background:var(--panel);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}#main .lab-grid,#main .compare-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:30px;margin:25px 0}#main .compare-grid{grid-template-columns:1fr 1fr}#main .controls{display:grid;gap:20px;align-content:start}#main label{display:block;font-weight:650;font-size:14px}#main input[type=range]{width:100%;accent-color:#218563}#main output{display:block;color:var(--green);font-weight:750}#main input[type=search]{width:100%;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:12px;color:var(--text)}#main .architecture{display:flex;align-items:stretch;gap:10px;justify-content:center}#main .architecture button{border-radius:15px;flex:1;padding:20px 8px;min-width:0;display:flex;flex-direction:column;align-items:center;font-size:14px}#main .architecture .symbol{font-size:32px}#main .architecture .connector{align-self:center;color:var(--green);font-size:23px}#main .explanation,#main .callout{border-left:4px solid var(--green);padding:15px 22px;background:color-mix(in srgb,var(--green) 8%,transparent);margin:20px 0}#main .chart{background:#0b1c2c;border-radius:15px;padding:12px;min-width:0;color:#c1d5e4}#main .chart svg{display:block;width:100%;height:auto}#main .metrics{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}#main .metric{padding:14px;border:1px solid var(--line);border-radius:12px;flex:1;min-width:115px}#main .metric b{font-size:24px;display:block;line-height:1.3}#main .metric span{font-size:12px;color:var(--muted)}#main .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;margin:10px 0}#main .solar{color:#8b5800}#main .load{color:#925db2}#main .discharge{color:#087758}#main .import{color:#17649b}#main .tank{height:145px;border:2px solid var(--line);border-radius:17px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800}#main .tank .fill{position:absolute;inset:0 auto 0 0;background:#249b7950}#main .tank .reserve{position:absolute;inset:0 auto 0 0;background:repeating-linear-gradient(45deg,#ca872d50,#ca872d50 5px,transparent 5px,transparent 10px)}#main .tank span{z-index:1}#main .chips{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}#main .mission-panel{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}#main .mission-art{background:#0b1c2c;border-radius:20px;padding:24px;color:#bcd4e5;min-height:200px}#main .mission-art svg{width:100%;height:auto}#main details{border-top:1px solid var(--line);padding:14px 0}#main summary{cursor:pointer;font-weight:650}#main .tablewrap{overflow:auto}#main table{width:100%;border-collapse:collapse;font-size:12px}#main td,#main th{padding:8px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}#main .source-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}#main .source-card{border:1px solid var(--line);padding:16px;border-radius:12px}#main .source-card p{font-size:13px;margin:6px 0}#main dt{font-weight:700}#main dd{margin:0 0 14px;color:var(--muted)}#main .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#main #glossary details p{max-width:800px}@media(max-width:700px){#main{padding:16px}#main .hero{grid-template-columns:1fr;padding:25px 0}#main .hero-art{min-height:200px}#main .bat{height:140px;top:20px}#main .lab-grid,#main .compare-grid,#main .mission-panel,#main .source-grid{grid-template-columns:1fr}#main section[id]{padding:19px}#main .architecture{flex-wrap:wrap}#main .architecture button{flex-basis:40%}#main .architecture .connector{display:none}#main .metric{min-width:100px}#main .modebar span{width:100%}#main nav a{font-size:11px;padding:6px 9px}#main .chart{padding:6px}#main h1{font-size:48px}}@media(prefers-reduced-motion:reduce){}#main [hidden]{display:none!important}#main .architecture{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding-bottom:60px}#main .architecture button{position:relative;display:flex}#main .architecture button:after{content:'↕';font-size:20px;position:absolute;top:100%;height:32px;left:calc(50% - 5px);color:var(--green)}#main .architecture button.supervisory:after{content:'';border-left:2px dashed var(--muted);height:30px;left:50%}#main .ac-bus{position:absolute;bottom:0;left:0;right:0;border-top:3px solid var(--green);text-align:center;font-size:12px;padding-top:8px}#main .architecture .supervisory{border-style:dashed}@media(max-width:700px){#main .architecture{grid-template-columns:1fr;gap:12px;padding:0 0 0 22px;border-left:3px solid var(--green);margin-left:4px}#main .architecture button{flex-direction:row;gap:10px;padding:12px}#main .architecture button:after{content:'↔';top:calc(50% - 15px);left:-24px;width:22px;height:20px}#main .architecture button.supervisory:after{top:50%;left:-23px;width:21px;height:0;border-top:2px dashed var(--muted);border-left:0}#main .ac-bus{position:static;border:0;text-align:left;padding:0}}#main .chart{overflow-x:auto}#main .chart svg{min-width:540px}#main .mission-art{overflow-x:auto}#main .mission-art svg{min-width:360px}#main .mission-art:focus-visible{outline:3px solid #cb650f}#main .lab-grid>*,#main .compare-grid>*,#main .mission-panel>*{min-width:0}#main .flow-chart{background:#0b1c2c;border-radius:15px;padding:12px;overflow-x:auto}#main .flow-chart svg{width:100%;min-width:580px;display:block}@media(min-width:701px){#main .modebar{position:sticky;top:0;z-index:10;background:var(--panel);backdrop-filter:blur(18px);padding:12px 16px;border-radius:14px}}#main select{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:12px;max-width:100%;margin:8px 0 16px}#main select:focus-visible{outline:3px solid #cb650f}#main .mini-bars{display:flex;align-items:flex-end;height:120px;gap:3px;border-bottom:1px solid var(--muted);padding-top:8px}#main .mini-bars span{flex:1;background:var(--green);min-width:0;border-radius:3px 3px 0 0}#main .compare-grid dl{font-size:14px}#main .compare-grid dt{font-weight:700;margin-top:14px}#main .compare-grid dd{margin-left:0}#main .architecture{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}@media(max-width:700px){#main .architecture{grid-template-columns:1fr}#main .modebar{gap:6px}#main .modebar button{font-size:12px;padding:8px}#main .compare-grid article{padding:10px}}#main .role-path{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:20px;background:var(--panel);border:1px solid var(--border);border-radius:16px}#main .role-path span{border:1px solid var(--green);padding:14px;border-radius:10px}#main .role-path b{color:var(--green)}#main .hero>*{min-width:0}#main .architecture button[data-component="0"]:after{content:'↓'}#main .architecture button[data-component="2"]:not(.supervisory):after{content:'↑'}@media(max-width:700px){#main .architecture button[data-component="0"]:after{content:'←'}#main .architecture button[data-component="2"]:not(.supervisory):after{content:'→'}}#main{--border:var(--line)}#main .legend{background:#0b1c2c;color:#dceaf3;padding:12px;border-radius:10px;display:flex;flex-wrap:wrap;gap:12px}#main .legend span{display:inline-flex;align-items:center;gap:5px;color:#dceaf3}#main .flow-chart{color:#e3eff7}#main .flow-chart h3{margin-top:2px}#main .flow-chart .caption{color:#afc7d8}#main .flow-rows{display:grid;grid-template-columns:1fr 1fr;gap:12px}#main .flow-row{position:relative;border:1px solid #49677e;border-radius:10px;padding:13px;overflow:hidden;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}#main .flow-row span,#main .flow-row b{position:relative;z-index:1}#main .flow-row i{position:absolute;left:0;bottom:0;height:4px;background:#8cdec0}#main .flow-row.inactive{border-style:dashed}#main .flow-row.inactive i{display:none}#main section[id]{scroll-margin-top:135px}#main button,#main summary,#main select{min-height:44px}#main .compare-grid article{overflow-wrap:anywhere}#main .flow-chart svg{min-width:0}#main #scenario-insight:empty{display:none}@media(max-width:700px){#main section[id]{scroll-margin-top:20px}#main .flow-rows{grid-template-columns:1fr}#main .hero-art .pv{left:10px;bottom:35px;font-size:32px}#main .hero-art .bat{right:12px;transform:scale(.8);transform-origin:right center}#main .hero-art .sun{left:16px}#main .modebar button{min-height:44px}#main .chart svg{min-width:600px}}#main{--bg:#c6d9ec;--panel:#eff6fcd9;--text:#0b1620;--muted:#42536a;--line:#8daac4;--green:#176952;--orange:#91420e}html[data-theme=dark] #main{--bg:#081c35;--panel:#102f4fe8;--text:#eaf2ff;--muted:#a8c1d9;--line:#466581;--green:#8cdec0;--orange:#ffc28c}@media(max-width:700px){#main .modebar span{margin-bottom:3px}}#main{max-width:1200px;padding-left:clamp(16px,3vw,30px);padding-right:clamp(16px,3vw,30px)}@media(max-width:700px){}html:not([data-theme=dark]) #main{--muted:#3b4d62;--orange:#7d350c}
#main{max-width:1200px;margin:auto;padding:30px clamp(16px,3vw,30px);font:16px/1.65 system-ui,sans-serif;color:var(--text)}
