@font-face{font-family:Manrope;src:url('manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{--bg:#0c1114;--surface:#171f24;--surface2:#1a242b;--line:#2b3943;--text:#f5f7fa;--muted:#a7b4c5;--blue:#538fff;--violet:#9a62ff;--green:#1deb86;--r:20px;font-family:Manrope,'Segoe UI',sans-serif;font-synthesis:none}
body{background:radial-gradient(ellipse at 50% 25%,#263139 0,#131b20 36%,#090e12 75%);padding:22px}
body:before{display:none}
button{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .2s,transform .18s,border-color .2s}
button:active{transform:scale(.975)}
button:focus-visible,input:focus-visible,.plot:focus-visible{outline:2px solid #94b5ff;outline-offset:3px}
.prototype{width:min(100%,420px);height:min(910px,calc(100dvh - 44px));min-height:0;border:1px solid #53606a;border-radius:38px;background:radial-gradient(ellipse at 0 38%,#14202166,transparent 50%),linear-gradient(145deg,#11191e,#0b1013 58%,#10171b);box-shadow:0 0 0 5px #070c10,0 0 0 6px #3e4950,0 30px 80px #000b;isolation:isolate}
.statusbar{height:42px;flex-shrink:0;align-items:center;padding:12px 25px 0;font-size:12px;font-weight:650;color:#f2f6fb}
.status-icons{display:flex;gap:5px;align-items:center;font-size:11px}.status-icons .ico{width:15px;height:15px}
.screen{padding:21px 19px 98px;transition:opacity .2s,transform .25s;visibility:hidden}.screen.active{visibility:visible}
.header{margin:0 3px 20px;min-height:39px}.header h1{font-size:29px;font-weight:750;letter-spacing:-1px;line-height:1.15}
.header .icon-btn{background:transparent;border:0;width:34px;height:34px;color:#e4e9f1}.header .ico{width:23px;height:23px}
.card{background:linear-gradient(130deg,#1b252c,#151e23);border:1px solid #2a353e;box-shadow:inset 0 1px #ffffff03,0 8px 18px #0001;border-radius:20px}
.system-ok{width:100%;height:47px;background:linear-gradient(110deg,#152646,#151d2a);border-color:#223047;border-radius:14px;gap:11px;font-size:13px;font-weight:550;margin-bottom:23px;color:#73b8ff;text-align:left}
.system-ok .dot{width:12px;height:12px;background:#4cd7ff;box-shadow:0 0 14px #41c8ffb0}.chev{display:flex;align-items:center}.chev .ico{width:18px;height:18px}
.battery{width:202px;height:202px;background:none;box-shadow:none;margin:0 auto 11px;overflow:visible}
.battery:before{inset:13px;background:radial-gradient(circle at 50% 50%,#11212133,#0e1519 72%);box-shadow:inset 0 0 30px #19e7810a}
.charge-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.charge-ring .ring-track{fill:none;stroke:#14563c;stroke-width:12;opacity:.7}
.charge-ring .ring-progress{fill:none;stroke:#1deb86;stroke-width:12;stroke-linecap:round;stroke-dasharray:452 580;filter:drop-shadow(0 0 10px #10e98070)}
.battery-content{width:100%;display:flex;align-items:center;flex-direction:column;gap:0}.battery .battery-icon{color:var(--green);display:flex;margin-bottom:5px;width:24px;height:24px}.battery strong{font-size:46px;font-weight:750;letter-spacing:-2px;margin:2px 0 7px}.battery span{font-size:13px;line-height:1.5;color:#d6dee8}.battery .duration{color:white;font-weight:650}
.flow{display:block;position:relative;height:286px;margin:0 0 14px;z-index:0}.flow:before,.flow:after,.charge-line{display:none}
.energy-paths{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:visible}.energy-paths path{fill:none;stroke-width:2;stroke-linecap:round;filter:drop-shadow(0 0 5px currentColor)}
.energy-paths .grid-path{stroke:#42bfff;color:#42bfff}.energy-paths .sun-path{stroke:#ffd447;color:#ffd447}.energy-paths .battery-path{stroke:#1deb86;color:#1deb86}
.flow .node{position:absolute;z-index:1;display:grid;grid-template-columns:33px 1fr;gap:0 9px;align-content:center;padding:13px 11px;border-radius:16px;min-height:0;height:78px;width:132px;background:linear-gradient(125deg,#1b2831,#172127);border:1px solid #3a4b5a;box-shadow:inset 0 1px #ffffff04}
.node .node-icon{grid-row:1/3;display:flex;align-items:center}.node .node-icon .ico{width:30px;height:30px;filter:drop-shadow(0 0 6px currentColor)}
.node small{display:block;font-size:13px;font-weight:600;color:#e4e9f0;line-height:1.5}.node b{font-size:22px;font-weight:750;letter-spacing:-.8px;white-space:nowrap;margin:0}.node b em{font-size:12px;font-weight:600;font-style:normal;letter-spacing:0}
.flow .grid{top:0;left:0;color:#57b7ff}.flow .sun{top:0;right:0;color:#ffd447;background:linear-gradient(125deg,#292920,#192021)}
.flow .home{top:110px;left:50%;transform:translateX(-50%);width:139px;text-align:left;color:#eaf0ff;background:linear-gradient(125deg,#202c3c,#19222a)}
.node.home .node-icon{color:#9cb6ff}.flow .batt{top:208px;left:50%;transform:translateX(-50%);width:168px;color:#1deb86}
.insight{width:100%;text-align:left;min-height:70px;padding:12px 13px;font-size:13px;font-weight:550;gap:12px;border:0;background:linear-gradient(130deg,#1a252a,#151d22);line-height:1.55}.round-icon{width:45px;height:45px;flex-basis:45px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#30488a,#172953);color:#91b7ff}.round-icon .ico{width:24px;height:24px}
.seg{padding:3px;background:linear-gradient(135deg,#182329,#131b20);border:1px solid #2b3740;border-radius:15px;margin-bottom:19px}.seg button{border-radius:12px;font-size:14px;padding:10px;font-weight:500}.seg .selected{background:linear-gradient(110deg,#375b99,#434574);box-shadow:0 2px 7px #0003;color:white}
.date-row{margin:0 0 19px;color:#dce2eb}.date-row button{width:33px;height:33px;background:#192228;color:#d6dfea;display:grid;place-items:center}.date-row b{font-size:13px;font-weight:550}.date-row .ico{width:19px;height:19px}
.energy-summary{gap:8px;margin-bottom:16px}.energy-summary .card{background:linear-gradient(130deg,#1d282f,#172027);border-color:#2e3c45;border-radius:16px;box-shadow:none;padding:13px 10px}.energy-metric span{font-size:11px;color:#b5c1d0}.energy-metric b{font-size:24px;font-weight:700;letter-spacing:-1px}.energy-metric small{font-size:11px;color:#8293a7}
.chart-card{padding:18px 15px;margin-bottom:16px;background:linear-gradient(145deg,#192329,#121b20);border:1px solid #2b3a44;border-radius:21px;box-shadow:inset 0 1px #ffffff03}.chart-card:before{display:none}.chart-card.battery-chart,.chart-card.voltage-chart{border-color:#2b3a44}
.chart-head{gap:7px;margin-bottom:21px}.chart-head h2{font-size:17px;font-weight:700;letter-spacing:-.4px}.chart-head p{font-size:11px;margin:0;color:#96a7bb;line-height:1.6}.chart-value{background:#111b20;border:1px solid #30434e;border-radius:12px;padding:8px 10px;flex-shrink:0}.chart-value b{font-size:17px;font-weight:700}.chart-value small{font-size:10px;color:#91a2b5}
.plot{background:repeating-linear-gradient(to top,transparent 0 44px,#3445504a 45px);height:180px;border-radius:0;margin-left:33px}.plot:after{border:0;border-bottom:1px solid #344550;border-radius:0}.plot svg{inset:8px 3px;width:calc(100% - 6px);height:calc(100% - 16px)}.line{filter:none;stroke-width:2.1}.area{opacity:.17}.plot-labels span{font-size:10px;font-weight:450;color:#93a3b5}.x-labels{font-size:11px;font-weight:450;color:#a4b1c0}.chart-legend{border:0;background:transparent;padding:0;margin-top:17px;gap:17px}.chart-legend i{box-shadow:none;width:9px;height:9px}.chart-legend span{font-size:12px;color:#c4cdd9}.chart-tooltip{background:#152229f5;border-color:#4c6170;box-shadow:0 5px 16px #0004}.chart-tooltip span{font-size:11px}.chart-point{width:13px;height:13px}
.phase-pills{border-color:#2c3c46;border-radius:14px;background:#0f181e;padding:4px;gap:4px}.phase-pills button{background:#19262d;font-size:11px}.phase-pills .active{background:linear-gradient(115deg,#4168ad,#58459f)}
.filters{gap:10px;margin-bottom:24px}.chip{padding:11px 19px;font-size:13px;border-color:#2b3740;background:linear-gradient(145deg,#19242a,#131b20)}.chip.selected{background:linear-gradient(110deg,#193a62,#272d53);border-color:#699cff;box-shadow:inset 0 0 15px #4169d420}.section-label{font-size:14px;font-weight:550;color:#c7d0dd;margin:20px 7px 13px}
.events{gap:12px}.event{padding:17px 15px;gap:13px;grid-template-columns:45px 1fr;border-left:2px solid #7587ff;min-height:122px;background:linear-gradient(130deg,#1b252c,#141e23);border-radius:16px}.event.warning{background:linear-gradient(125deg,#322d18,#232317 65%,#1b2220);border-color:#8c7626;border-left:2px solid #ffd447}.event.warning b{color:#ffd447}.event.warning .round-icon{color:#ffd447;background:#423815}.event b{font-size:15px;font-weight:700;letter-spacing:-.2px}.event p{font-size:13px;line-height:1.5;margin:5px 0 7px;color:#b8c5d7}.event time{font-size:12px;color:#a6b6c9}.event[hidden]{display:none}
.assistant-hero{gap:12px;margin-top:4px;margin-bottom:17px}.bot{background:linear-gradient(135deg,#4ea8ff,#795eff);border-radius:50%;width:47px;height:47px;box-shadow:0 0 20px #5869ff26;color:#081722}.bot .ico{width:29px;height:29px}.bot .ico svg{stroke-width:2.4}
.message{padding:18px 16px;border:0;border-radius:20px}.message b{font-size:17px;font-weight:700;letter-spacing:-.3px}.message span{font-size:14px;color:#becbdb;line-height:1.6}.assistant-note{display:flex;gap:12px;padding:16px;align-items:center;border-radius:16px}.assistant-note .round-icon{border-radius:7px;width:36px;height:40px;flex-basis:36px;background:#18303b;color:#a29cff}.assistant-note span{font-size:13px}
.recommend{padding:22px 17px 17px;margin:19px 0;border:0;border-radius:22px}.recommend h2{font-size:17px;font-weight:700;letter-spacing:-.4px;line-height:1.5;margin:0 0 12px;display:flex;align-items:flex-start;gap:13px}.recommend .round-icon{color:#dbd1ff;background:linear-gradient(135deg,#778aff,#9562eb);width:45px;height:45px;flex-basis:45px}.recommend p{font-size:13px;color:#c3cfdf;line-height:1.7;padding-left:58px;margin-bottom:20px}.primary{background:linear-gradient(105deg,#4b9bff,#a162f8);color:#081326;font-weight:750;padding:14px;border-radius:13px;box-shadow:0 5px 14px #7277ff16}.secondary{border-color:#8293a4;background:linear-gradient(140deg,#222d32,#182329);border-radius:13px;padding:12px;font-size:14px;margin-top:11px}
.quick{gap:7px;margin:19px 0 13px}.quick button{border-radius:16px;border-color:#2a3b46;background:#17242b;font-size:12px;color:#b9c7d7}.composer{gap:10px}.composer input{border-radius:25px;background:linear-gradient(130deg,#202b32,#172228);border-color:#34434d;font-size:13px;padding:14px 17px}.composer button{border:1px solid #384954;background:#1b2a34;color:#9eb3cc;border-radius:50%;width:49px;display:grid;place-items:center}.composer .ico{width:21px;height:21px}
.nav{height:85px;background:linear-gradient(180deg,#0e171beF,#0c1519);border-color:#203038;padding:11px 10px 20px}.nav button{gap:7px;font-size:11px;color:#a4b4c9;font-weight:500}.nav-icon{height:25px;width:25px}.nav-icon svg{stroke-width:1.65}.nav button.active{color:#84b3ff}.nav button.active .ico{filter:drop-shadow(0 0 6px #6c87ff55)}.nav button.active .nav-icon svg{fill:#718eff;stroke:#87a7ff}.nav button[data-target=assistant].active{color:#a697ff}
.prototype:after{content:'';position:absolute;z-index:30;bottom:7px;left:50%;transform:translateX(-50%);width:116px;height:4px;border-radius:4px;background:#e8edf2;pointer-events:none}
.battery span.battery-icon,.battery .battery-icon .ico{color:var(--green)}
.nav button{font-size:12px}
[data-screen=home]{padding-top:15px}
[data-screen=home] .header{margin-bottom:16px}
[data-screen=home] .system-ok{margin-bottom:17px}
[data-screen=home] .battery{width:194px;height:194px;margin-bottom:9px}
[data-screen=home] .insight{margin-top:0}
.event p{font-size:14px}
[data-screen=events]>.events:last-child .round-icon{color:#ffd447;background:#3b3423}
@media(min-height:771px) and (max-height:880px){[data-screen=home] .flow{height:269px}[data-screen=home] .flow .home{top:102px}[data-screen=home] .flow .batt{top:191px}}
@media(max-width:520px){body{padding:0;background:#0c1114}.prototype{width:100%;height:100dvh;min-height:0;border:0;border-radius:0;box-shadow:none}.screen{padding-left:18px;padding-right:18px}.statusbar{height:40px}.nav{padding-bottom:max(20px,env(safe-area-inset-bottom))}.flow .node{width:128px}}
@media(max-height:770px){.screen{padding-top:14px}.header{margin-bottom:14px}.system-ok{margin-bottom:12px}.battery{width:172px;height:172px}.battery strong{font-size:39px}.flow{height:267px}.flow .batt{top:190px}.flow .home{top:99px}.energy-paths{height:267px}.flow .node{height:73px}.insight{min-height:63px}}
@media(max-height:770px){[data-screen=home] .header{margin-bottom:12px}[data-screen=home] .system-ok{margin-bottom:12px}[data-screen=home] .battery{width:168px;height:168px}[data-screen=home] .flow{height:237px}[data-screen=home] .energy-paths{height:237px}[data-screen=home] .flow .home{top:87px}[data-screen=home] .flow .batt{top:164px}[data-screen=home] .insight{font-size:12px;padding:10px;min-height:60px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Config-aware offline product behavior, preserving the approved visual theme. */
[hidden],.solar-unavailable{display:none!important}
.overview .chart-point,.overview .chart-cursor,.overview .chart-tooltip{display:none}
.plot.overview{cursor:default;touch-action:pan-y}
.phase-pills{display:flex;gap:4px}.phase-pills button{flex:1;min-height:42px;color:#becbdc;font-size:12px}
.phase-pills button.active{color:#fff}.source-pills button:first-child{flex:1.8;line-height:1.2}.phase-pills{margin-top:17px}
.chart-help{font-size:12px;color:#a7b4c5;line-height:1.5;margin:11px 3px 0}
.no-solar .flow .sun,.no-solar #sun-flow,.no-solar .energy-paths circle:nth-of-type(2){display:none}
.no-solar .flow .grid{left:50%;transform:translateX(-50%)}
.no-solar .energy-summary{grid-template-columns:repeat(2,1fr)}
.flow .batt{width:164px}.flow .batt small{font-size:12px}.flow .batt b{font-size:17px;letter-spacing:-.4px}
.insight>span:not(.chev){text-align:left;font-size:12px;line-height:1.6}
.system-dialog{color:var(--text);background:linear-gradient(140deg,#1b282f,#101a20);border:1px solid #41515e;border-radius:24px;width:362px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 38px);overflow:auto;padding:23px;box-shadow:0 25px 70px #0009;font-family:inherit}
.system-dialog::backdrop{background:#03080cbb;backdrop-filter:blur(7px)}
.system-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px}.system-dialog header small{font-size:12px;color:#9db7dc}.system-dialog h2{font-size:24px;margin:5px 0 0;letter-spacing:-.7px}.close-dialog{border:1px solid #3e4c59;background:#21303a;color:#eaf0fa;border-radius:50%;height:36px;width:36px;font-size:24px}
.config-note{font-size:14px;line-height:1.6;color:#b5c4d4;margin:17px 0 21px}
.solar-setting{display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:16px;font-weight:650;padding:16px 0;border-top:1px solid #34434c;border-bottom:1px solid #34434c}.solar-setting small{display:block;font-size:12px;color:#a7b4c5;font-weight:400;margin-top:5px}.solar-setting input{appearance:none;width:44px;height:26px;border-radius:20px;background:#4d5a64;position:relative;flex-shrink:0;cursor:pointer}.solar-setting input:checked{background:#7288ff}.solar-setting input:before{content:'';position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:white;transition:transform .2s}.solar-setting input:checked:before{transform:translateX(18px)}
.battery-setting{display:block;font-size:16px;margin:20px 0}.battery-setting select{display:block;width:100%;font:inherit;color:#eef3fa;background:#1e2d37;border:1px solid #425461;border-radius:12px;padding:12px;margin-top:10px;color-scheme:dark}
.system-specs{margin:0 0 22px}.system-specs div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-size:12px}.system-specs span{color:#a7b4c5}.system-specs b{font-weight:600;text-align:right}
.system-dialog input:focus-visible,.system-dialog select:focus-visible{outline:2px solid #94b5ff;outline-offset:3px}
.assistant-demo-note{font-size:12px;line-height:1.5;color:#9badc1;margin:10px 2px 0}
.chat-history{display:flex;flex-direction:column;gap:12px;margin:17px 0}.chat-history:empty{display:none}
.chat-bubble{border:1px solid #30414f;border-radius:19px;padding:15px;font-size:14px;line-height:1.65;overflow-wrap:anywhere}.chat-bubble.user{align-self:flex-end;max-width:90%;background:linear-gradient(125deg,#293c71,#45335e);border-color:#5f65a7;border-bottom-right-radius:6px}.chat-bubble.bot-reply{background:linear-gradient(140deg,#1c2b34,#152128);border-bottom-left-radius:6px}.bot-reply small{color:#9ab8ed;font-size:12px}.bot-reply p{margin:6px 0 0}
.chat-bubble,.composer{scroll-margin-bottom:110px}

/* Account entry: separate from actual authorization, awaiting the existing customer API. */
.account-gate{display:none;position:absolute;inset:42px 0 0;overflow-y:auto;scrollbar-width:none;padding:25px 23px 34px;background:radial-gradient(ellipse at 100% 30%,#344b7b20,transparent 55%),radial-gradient(ellipse at 0 55%,#6857a61c,transparent 65%),#0d151a;z-index:25}
.account-entry .account-gate{display:block}.account-entry .app,.account-entry .nav,.account-entry .toast{display:none}
.entry-panel{min-height:100%;display:flex;flex-direction:column}.entry-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.entry-brand{font-size:24px;font-weight:800;letter-spacing:5px;color:#f1f5ff}.entry-chip{padding:7px 10px;border:1px solid #344357;border-radius:20px;font-size:12px;color:#afbad0}
.entry-hero{flex:1;display:flex;flex-direction:column;justify-content:center;padding:35px 0 45px}.entry-emblem{height:85px;width:85px;display:grid;place-items:center;border-radius:25px;background:linear-gradient(135deg,#264b76,#382951);border:1px solid #7488c050;box-shadow:0 0 65px #6874ff20,inset 0 1px #ffffff1a;margin-bottom:28px}.entry-emblem svg{height:43px;width:43px;fill:#a2bbff;stroke:#b6c7ff;stroke-width:1.2;filter:drop-shadow(0 0 10px #93a7ff70)}
.entry-panel h1{font-size:36px;line-height:1.23;letter-spacing:-1.2px;margin:0 0 18px;font-weight:750}.entry-hero h1 span{color:#9aacff}.entry-hero p,.entry-copy p{font-size:14px;line-height:1.8;color:#aebdd0;margin:0}.entry-actions{display:grid;gap:12px}.entry-actions .primary,.entry-form .primary{min-height:53px;border-radius:15px;font-size:16px}.entry-secondary{border:1px solid #344450;background:#17242d;border-radius:15px;padding:15px;font-size:14px;min-height:50px}.entry-demo{background:transparent;border:0;color:#b3bdde;padding:15px;font-size:14px}.entry-footnote{font-size:12px;line-height:1.6;color:#8093ab;text-align:center;margin:0}
.entry-copy{margin:54px 0 30px}.entry-copy h1{font-size:31px;margin-top:12px}.entry-eyebrow{color:#99affc;font-size:12px;letter-spacing:.5px}.entry-close{width:36px;height:36px;border:1px solid #354650;border-radius:50%;background:#17242c;color:#cdd8e5;font-size:25px}.entry-form{display:grid;gap:20px}.entry-form label{font-size:14px;color:#dde5f0}.entry-form input{margin-top:9px;display:block;width:100%;border:1px solid #384a58;background:#18252e;color:#f5f7fa;border-radius:14px;padding:15px;font-size:16px;outline-offset:3px}.entry-form input:disabled{opacity:.6;cursor:not-allowed}.entry-api-note{font-size:12px;line-height:1.7;color:#99abc1;margin:0}.entry-login-status{font-size:14px;color:#bed0f0;background:#23314a;border-radius:12px;padding:12px;margin:0;line-height:1.6}.entry-text{border:0;background:transparent;color:#9fb5eb;font-size:14px;padding:13px}.entry-actions.compact{margin-top:9px;gap:0}.entry-info{padding:19px;background:linear-gradient(135deg,#1c2a36,#202334);border:1px solid #334253;border-radius:18px;margin:0 0 35px}.entry-info b{font-size:16px}.entry-info p{font-size:14px;line-height:1.8;color:#b0bed0;margin-bottom:0}.return-to-entry{width:100%;margin-top:12px}
@media(max-height:770px){.entry-hero{padding:25px 0}.entry-emblem{height:65px;width:65px;border-radius:21px;margin-bottom:20px}.entry-panel h1{font-size:32px}.entry-copy{margin-top:27px}.entry-form{gap:15px}}