:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--bg:#0b0b0c;--surface:#111112;--surface2:#151517;--border:rgba(255,255,255,.1);--borderSoft:rgba(255,255,255,.07);--text:#f5f5f7;--muted:rgba(245,245,247,.7);--accent:#e82127;--accentSoft:rgba(232,33,39,.18);--wire:rgba(255,255,255,.18);--wireOn:rgba(232,33,39,.95)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial}:root{--browser-top: 0px}@supports (-webkit-touch-callout: none){:root{--browser-top: 72px}}@media(min-width:900px){:root{--browser-top: 0px}}.app{min-height:100vh;padding-top:var(--browser-top);background:radial-gradient(1200px 800px at 50% -10%,rgba(255,255,255,.06),transparent 55%),var(--bg);display:flex;flex-direction:column}.appTop{position:relative;top:0;left:0;right:0;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 12px;background:#0b0b0ceb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--borderSoft)}.topRow{display:flex;align-items:center;justify-content:space-between;gap:12px}.title{font-weight:900;font-size:20px;letter-spacing:.2px}.subtitle{font-size:12px;color:var(--muted);margin-top:2px}.screenHeader{font-size:12px;color:var(--muted);margin:2px}.statusPill{font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid var(--borderSoft);background:linear-gradient(180deg,#ffffff0f,#0000002e);color:#f5f5f7eb}.appMain{flex:1;padding:14px 14px calc(92px + env(safe-area-inset-bottom,0px))}.screen{max-width:460px;margin:0 auto;display:flex;flex-direction:column;gap:14px}@media(min-width:900px){.screen{max-width:900px}}.card{background:linear-gradient(180deg,#ffffff0d,#ffffff05);border:1px solid var(--borderSoft);border-radius:18px;padding:16px}h2{margin:0 0 8px;font-size:15px;letter-spacing:.2px}.muted{color:var(--muted)}.row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.kpiRow{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.stat{flex:1;min-width:180px;padding:12px;background:#ffffff08;border:1px solid var(--borderSoft);border-radius:14px}.statLabel{font-size:12px;color:var(--muted)}.statValue{font-size:18px;font-weight:900;margin-top:3px;letter-spacing:.2px}.statHint{font-size:12px;color:#f5f5f78c;margin-top:2px}.tabbar{position:fixed;left:0;right:0;bottom:0;padding:10px 12px calc(16px + env(safe-area-inset-bottom,0px));background:#0b0b0ceb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--borderSoft);display:flex;justify-content:space-around;gap:10px}.tabBtn{appearance:none;border:0;background:transparent;color:#f5f5f7c7;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 12px;border-radius:14px;min-width:92px}.tabBtn span{font-size:11px;letter-spacing:.2px}.tabBtn.active{color:var(--text);background:#ffffff0d;border:1px solid rgba(255,255,255,.08)}.tabBtn:active{transform:translateY(1px)}.flowCard{background:linear-gradient(180deg,#ffffff0d,#ffffff05);border:1px solid var(--borderSoft);border-radius:20px;padding:16px}.flowHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.flowHeader .h{font-weight:950;font-size:18px;letter-spacing:.2px}.chip{border:1px solid var(--borderSoft);background:#ffffff08;border-radius:999px;padding:6px 10px;font-size:12px;color:#f5f5f7db}.flowCanvas{position:relative;height:520px;border-radius:20px;background:radial-gradient(900px 600px at 30% 0%,rgba(232,33,39,.1),transparent 55%),#00000038;border:1px solid rgba(255,255,255,.08);overflow:hidden}.node{position:absolute;width:150px;text-align:center}.node img{width:116px;height:116px;object-fit:cover;border-radius:18px;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 30px #0006}.nodeLabel{margin-top:8px;font-size:12px;color:#f5f5f7a6}.nodeValue{margin-top:2px;font-size:16px;font-weight:950}.nodeSolar{left:50%;transform:translate(-50%);top:18px}.nodeGrid{right:10px;top:220px;width:120px}.nodeHouse{left:12px;top:340px}.nodeBattery{right:12px;top:410px}.gridIcon{width:108px;height:108px;margin:0 auto;border-radius:18px;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-weight:950;letter-spacing:.6px;background:#ffffff08}@media(min-width:900px){.flowCanvas{height:360px}.node{width:190px;transform:none}.node img{width:120px;height:120px;border-radius:16px}.nodeSolar{left:36px;top:32px}.nodeHouse{left:405px;top:88px}.nodeBattery{left:405px;top:220px}.nodeGrid{right:24px;top:96px;width:150px}}.wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.wire{fill:none;stroke:var(--wire);stroke-width:6;stroke-linecap:round;stroke-dasharray:10 14;opacity:.28}.wire.on{stroke:var(--wireOn);opacity:1;filter:drop-shadow(0 0 10px rgba(232,33,39,.25))}.wire.off{opacity:.08}@keyframes dashFwd{0%{stroke-dashoffset:0}to{stroke-dashoffset:-52}}@keyframes dashRev{0%{stroke-dashoffset:0}to{stroke-dashoffset:52}}.wire.on.fwd{animation:dashFwd 1s linear infinite}.wire.on.rev{animation:dashRev 1s linear infinite}.mini{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}@media(min-width:900px){.mini{grid-template-columns:repeat(4,1fr)}}.miniItem{padding:12px;border:1px solid var(--borderSoft);background:#ffffff08;border-radius:14px;display:flex;justify-content:space-between;gap:10px}.miniItem .k{color:var(--muted);font-size:12px}.miniItem .v{font-weight:950;letter-spacing:.2px}.note{margin-top:10px;color:#f5f5f799;font-size:12px}.controlGrid{display:flex;flex-direction:column;gap:10px;margin-top:12px}.control{border:1px solid rgba(255,255,255,.1);background:#ffffff08;border-radius:16px;padding:12px}.control.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;cursor:pointer}.controlTop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.controlLabel{font-weight:900;letter-spacing:.2px}.controlDesc{margin-top:2px;color:#f5f5f799;font-size:12px;line-height:1.25}.controlValue{font-weight:950}.switch{width:48px;height:28px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;position:relative;flex:0 0 auto}.switch .knob{width:22px;height:22px;border-radius:999px;background:#f5f5f7db;position:absolute;top:2.5px;left:3px;transition:transform .18s ease,background .18s ease}.switch.on{background:#e821272e;border-color:#e8212759}.switch.on .knob{transform:translate(20px);background:#e82127f2}.range{width:100%;margin-top:10px}.seg{display:flex;gap:6px;padding:3px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:#00000026}.segBtn{border:0;background:transparent;color:#f5f5f7bf;padding:6px 10px;border-radius:999px;font-weight:800;cursor:pointer}.segBtn.on{background:#ffffff0f;color:#f5f5f7eb;border:1px solid rgba(255,255,255,.1)}.miniRow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}.miniK{color:#f5f5f799;font-size:12px}.miniV{font-weight:900}.insights{display:flex;flex-direction:column;gap:10px;margin-top:12px}.insight{border:1px solid rgba(255,255,255,.1);background:#ffffff08;border-radius:14px;padding:12px}.insight.good{border-color:#2ecc7147}.insight.warn{border-color:#f1c40f47}.insight.tip{border-color:#e8212738}.insightTitle{font-weight:900;letter-spacing:.2px}.insightBody{color:#f5f5f7b3;margin-top:4px;line-height:1.4;font-size:13px}.timeRow{display:flex;gap:10px;margin-top:10px}.time{flex:1;display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.1);background:#0000002e;border-radius:14px;padding:10px 12px}.time span{color:#f5f5f799;font-size:12px}.time input{background:transparent;border:0;color:#f5f5f7eb;font-weight:900}.forecastBox{margin-top:12px}.forecastSvg{width:100%;height:auto;display:block;border-radius:16px;background:#0003;border:1px solid rgba(255,255,255,.08)}.gridLine{stroke:#ffffff24;stroke-width:1}.pvArea{fill:#e8212724}.pvLine{fill:none;stroke:#e82127f2;stroke-width:2.2}.loadLine{fill:none;stroke:#f5f5f7a6;stroke-width:2;stroke-dasharray:4 4}.cursor{stroke:#f5f5f738;stroke-width:1}.forecastMeta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.metaItem{padding:10px 12px;border:1px solid rgba(255,255,255,.1);background:#ffffff08;border-radius:14px;display:flex;justify-content:space-between;gap:10px}.metaItem .k{color:#f5f5f799;font-size:12px}.metaItem .v{font-weight:950;letter-spacing:.2px}.legend{display:flex;gap:10px;margin-top:10px;color:#f5f5f7a6;font-size:12px}.leg{padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:#ffffff08}.leg.pv{border-color:#e8212759}.leg.load{border-color:#f5f5f738}a{color:#f5f5f7e6}ul{margin:0;padding-left:18px;line-height:1.55}