:root{color-scheme:light;--bg:#f5faff;--surface:#fff;--surface-soft:#f7fbff;--text:#0c1838;--text-secondary:#617493;--border:#dfeaf5;--primary:#086cff;--primary-soft:#e5f1ff;--solar:#29b56f;--solar-soft:#eafbf2;--house:#7ea6d6;--grid-import:#8a69df;--grid-export:#ee933e;--danger:#e34c54;--danger-soft:#fff0f1;--font:'Segoe UI Variable Text','Segoe UI',system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#fff 0,#f5faff 75%);color:var(--text);font:14px/1.45 var(--font);-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,a{color:inherit}button{cursor:pointer;transition:background .18s,border-color .18s}button:disabled,input:disabled{cursor:not-allowed;opacity:.55}a{text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #086cff66;outline-offset:3px}h1,h2,h3,p{margin:0}h1{font-size:32px;font-weight:700;letter-spacing:-1.1px;line-height:1.2}h2{font-size:18px;font-weight:650;letter-spacing:-.3px;line-height:1.3}h3{font-size:15px;font-weight:600}small{font-size:12px;color:var(--text-secondary)}strong{font-weight:650;font-variant-numeric:tabular-nums}.icon{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}[hidden]{display:none!important}.skip-link{position:fixed;z-index:100;top:12px;left:260px;padding:12px 20px;background:var(--primary);color:#fff;border-radius:8px}.skip-link:not(:focus){clip-path:inset(50%);height:1px;width:1px;overflow:hidden;padding:0}
.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#f7fbffdb;border-right:1px solid #e4eef7;z-index:30;padding-top:24px;display:flex;flex-direction:column}.wordmark{display:flex;align-items:center;gap:6px;font-size:30px;font-weight:700;letter-spacing:-1.2px;color:var(--primary);padding:0 24px;white-space:nowrap}.wordmark .icon{width:29px;height:42px;fill:var(--primary);stroke-width:.7}.wordmark b{color:var(--text)}.sidebar nav{display:flex;flex-direction:column;gap:2px;margin:30px 16px 0}.sidebar nav a{display:flex;gap:20px;align-items:center;height:56px;padding:0 18px;border-radius:12px;color:#4f6385;font-size:16px;font-weight:500}.sidebar nav a .icon{width:25px;height:25px;stroke-width:2.2}.sidebar nav a:hover{background:#eaf3ff}.sidebar nav a[aria-current=page]{color:var(--primary);background:#dfedff;font-weight:650}.sidebar-foot{margin:auto 24px 24px;display:flex;align-items:center;gap:7px;color:var(--text-secondary);font-size:12px}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--solar)}.sidebar-foot.offline .status-dot{background:var(--danger)}.workspace{margin-left:248px;padding:24px;max-width:1648px}.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;min-height:68px;margin-bottom:20px}.page-header>div>p{font-size:18px;color:#587095;margin-top:5px;line-height:1.45}.header-tools{display:flex;align-items:center;gap:24px;padding-top:4px}.demo-indicator{font-size:12px;padding:5px 8px;border:1px solid #e0d1aa;border-radius:6px;background:#fff9e8;color:#795d28;white-space:nowrap}.profile{position:relative}.profile summary{display:flex;align-items:center;gap:12px;cursor:pointer;list-style:none;font-size:16px;font-weight:500;white-space:nowrap;min-height:44px}.profile summary::-webkit-details-marker{display:none}.profile-avatar{width:42px;height:42px;border-radius:50%;background:#e6eff8;display:grid;place-items:center;color:#526883}.profile-menu{position:absolute;right:0;top:50px;min-width:180px;z-index:40;padding:12px;background:#fff;border:1px solid var(--border);box-shadow:0 10px 30px #213e6114;border-radius:10px}.profile-menu>span{display:block;color:var(--text-secondary);font-size:12px;padding:5px 8px}.profile-menu a{display:flex;align-items:center;gap:8px;padding:10px 8px;border-radius:7px}.profile-menu a:hover{background:var(--primary-soft)}
.card{border:1px solid var(--border);background:#ffffffed;border-radius:14px;box-shadow:0 5px 22px #214b7b0e;min-width:0;overflow:hidden}.section-title{display:flex;align-items:center;gap:12px;min-height:38px}.section-title h2{flex:1}.section-title h2 small{font-weight:400;font-size:12px;letter-spacing:0}.small-icon{width:36px;height:36px;display:grid;place-items:center;flex-shrink:0;color:var(--primary);background:var(--primary-soft);border-radius:10px}.small-icon .icon{width:22px;height:22px}.icon-tile{width:64px;height:64px;display:grid;place-items:center;flex-shrink:0;background:var(--primary-soft);color:#4f79b2;border-radius:14px}.icon-tile .icon{width:35px;height:35px}.green .icon-tile,.icon-tile.green{background:var(--solar-soft);color:#159755}.orange .icon-tile{background:#fff0dd;color:#df7b22}.purple .icon-tile{background:#f1eafe;color:#8a69df}.blue .icon-tile,.icon-tile.blue{background:var(--primary-soft);color:var(--primary)}.kpi{display:flex;align-items:center;gap:18px;min-height:130px;padding:18px 16px;background:linear-gradient(135deg,#fff,#fafdff)}.kpi.green{background:linear-gradient(135deg,#fff,#f8fffb)}.kpi.orange{background:linear-gradient(135deg,#fff,#fffaf5)}.kpi-label{font-size:14px;display:block;margin-bottom:5px;white-space:nowrap}.kpi strong{font-size:30px;line-height:1.2;letter-spacing:-.7px;display:block;white-space:nowrap}.kpi small{display:block;margin-top:8px;font-size:12px;line-height:1.4}.overview-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.overview-main{display:grid;grid-template-columns:minmax(0,69fr) minmax(0,31fr);gap:16px;margin-bottom:16px}.overview-charge{height:350px;padding:10px;position:relative}.overview-charge>.section-title{position:absolute;top:14px;left:20px;width:calc(44% - 25px);z-index:2;gap:10px}.overview-charge>.section-title h2{font-size:18px;white-space:nowrap}.badge{display:inline-flex;align-items:center;gap:6px;background:#eafbf2;color:#168747;border:1px solid #cbefdc;min-height:27px;padding:4px 10px;border-radius:100px;font-size:12px;font-weight:600;white-space:nowrap}.badge:before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}.badge.neutral{background:#f1f5fa;border-color:#dce5ef;color:#617493}.badge.error{background:var(--danger-soft);border-color:#f2cdd0;color:#b73240}.overview-vehicle{height:328px;display:grid;grid-template-columns:40% 60%;position:relative;border-radius:10px;overflow:hidden}.overview-stats{position:relative;z-index:1;padding:55px 14px 8px 10px;background:linear-gradient(110deg,#f9fcff,#fff)}.stat-row{display:flex;align-items:flex-start;gap:12px;margin:9px 0 15px;color:#249b66}.stat-row>.icon{width:20px;height:20px;margin-top:2px}.stat-row>span{display:block;color:#526b8c;font-size:13px;flex:1;min-width:0}.stat-row strong,.stat-pair strong{display:block;color:var(--text);font-size:21px;line-height:1.3;margin-top:2px}.stat-row small{font-size:11px;display:block;margin-top:3px}.stat-pair{display:flex;justify-content:space-between;gap:15px;color:#526b8c;font-size:13px;margin-top:12px}.soc-track{height:8px;display:block;width:100%;max-width:180px;background:#dbe7f3;border-radius:10px;margin-top:7px;overflow:hidden}.soc-track i{height:100%;display:block;width:0;background:var(--solar);border-radius:10px;transition:width .6s}.vehicle-photo{position:relative;background:#f5f9fd;min-width:0;overflow:hidden}.vehicle-photo img{width:100%;height:100%;object-fit:cover;object-position:58% 55%;display:block}.overview-photo:after{content:'';position:absolute;inset:0 auto 0 0;width:65px;background:linear-gradient(90deg,#fff,transparent)}.awaiting-image{background:linear-gradient(135deg,#edf4fb,#f9fcff)}.asset-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:8px;color:#6d86a4;padding:16px;border:1px dashed #cbdceb;border-radius:10px}.asset-placeholder>.icon{width:45px;height:45px;stroke-width:1}.asset-placeholder strong{font-size:15px;font-weight:500}.asset-placeholder small{font-size:12px}.vehicle-caption{position:absolute;right:18px;bottom:13px;font-size:13px;font-weight:600;background:#ffffffbd;padding:3px 7px;border-radius:5px}.overview-mode{padding:16px 14px}.overview-mode .section-title{gap:8px;margin-bottom:10px}.overview-mode h2{font-size:17px}.overview-mode .small-icon{width:32px;height:32px}.summary-row{display:flex;align-items:center;gap:12px;background:#f9fcff;border:1px solid var(--border);padding:12px;border-radius:12px;margin-top:9px;min-height:70px}.summary-row>.icon-tile{width:42px;height:42px;border-radius:10px}.summary-row>.icon-tile .icon{width:28px;height:28px}.summary-row>span:nth-child(2){font-size:12px;color:#536a8b;flex:1;min-width:0}.summary-row strong{display:block;color:var(--text);font-size:14px;margin-top:2px}.summary-row small{font-size:11px;display:block;margin-top:2px}.summary-row>.icon{width:16px;height:16px;color:#516c94}.summary-row:hover{border-color:#b8d5ff;background:#f3f8ff}
.overview-bottom{display:grid;grid-template-columns:minmax(0,39fr) minmax(0,36fr) minmax(0,25fr);gap:12px;margin-bottom:12px}.overview-bottom>.card{height:220px;padding:12px 16px}.overview-bottom .section-title{gap:10px;min-height:32px}.overview-bottom h2{font-size:15px}.overview-bottom .small-icon{width:28px;height:28px;border-radius:7px}.overview-bottom .small-icon .icon{width:18px;height:18px}.right-value{font-size:14px;margin-left:auto;white-space:nowrap}.chart{min-height:140px;width:100%;position:relative;color:var(--text-secondary);display:grid;place-items:center;overflow:hidden}.chart svg{display:block;width:100%;height:100%;position:absolute;inset:0}.empty-message{font-size:13px;text-align:center;max-width:240px;line-height:1.6;padding:15px}.mini-chart .chart{height:155px}.chart-legend{display:flex;align-items:center;gap:7px;margin-left:auto;font-size:12px;color:var(--text-secondary);white-space:nowrap}.dot{display:inline-block;width:9px;height:9px;border-radius:50%}.dot.blue{background:var(--primary)}.config-strip{display:flex;align-items:center;gap:16px;padding:12px 16px;min-height:82px}.config-strip>.section-title{flex:1.7}.config-strip .icon-tile{width:40px;height:40px;border-radius:10px}.config-strip .icon-tile .icon{width:26px;height:26px}.config-strip h2{font-size:16px}.config-strip small{display:block;font-size:11px;margin-top:4px}.config-strip>div:not(.section-title){border-left:1px solid var(--border);padding-left:16px;flex:1;min-width:0}.config-strip>div>span{font-size:11px;color:var(--text-secondary);display:block}.config-strip>div>strong{font-size:14px;display:block;margin-top:3px}.outline-button,.primary-button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;border:1px solid #cbdff6;border-radius:10px;padding:9px 17px;background:#f8fbff;color:#3c649a;font-size:14px}.outline-button:hover{background:#eaf3ff;border-color:#b0d0fb}.primary-button{background:var(--primary);border-color:var(--primary);color:#fff}.primary-button:hover{background:#005ae4}.primary-button>.icon{width:19px;height:19px}.icon-button{width:44px;padding:9px;flex-shrink:0}.config-strip>.outline-button{min-height:36px;font-size:12px;border-radius:20px;white-space:nowrap;padding:6px 16px}.config-strip>.outline-button .icon{width:16px;height:16px}
.energy-flow{height:230px;position:relative}.energy-flow>svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke-width:2}.flow-track{stroke:#d5e0ec}.flow-line{stroke-dasharray:6 16;stroke-width:2.5;opacity:0;animation:flow 3s linear infinite}.flow-line.active{opacity:1}.flow-line.reverse{animation-direction:reverse}.solar-flow{stroke:var(--solar)}.home-flow{stroke:var(--house)}.grid-flow{stroke:var(--grid-import)}.charge-flow{stroke:var(--primary)}.flow-node{position:absolute;width:140px;transform:translate(-50%,-50%);background:#f9fcff;border:1px solid var(--border);border-radius:12px;padding:11px;display:flex;align-items:center;justify-content:center;gap:9px;color:#557094;z-index:1;font-size:12px;flex-wrap:wrap;line-height:1.25}.flow-node .icon{width:29px;height:29px}.flow-node strong{font-size:18px;display:block;color:var(--text);margin-top:3px}.flow-pv{left:17%;top:24%;background:#f2fcf6;color:#159555}.flow-grid{left:83%;top:24%}.flow-home{left:17%;top:80%}.flow-charge{left:83%;top:80%;color:var(--primary)}.flow-hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#009c9f;color:#fff;border:5px solid #e0f6f8;border-radius:13px;padding:10px;box-shadow:0 3px 12px #0a7c9312}.compact{height:160px;margin-top:2px}.compact .flow-node{width:112px;padding:7px;font-size:10px;gap:5px}.compact .flow-node strong{font-size:15px}.compact .flow-node .icon{width:23px;height:23px}.compact .flow-hub{padding:7px}.compact .flow-hub .icon{width:18px;height:18px}
.live-page{display:grid;grid-template-columns:minmax(0,71fr) minmax(0,29fr);gap:16px}.live-main{min-width:0}.live-vehicle-card{height:456px;padding:12px}.live-state{height:72px;padding:0 5px 12px}.live-state h2{font-size:24px;margin-bottom:3px}.live-state p{font-size:15px;color:#617493}.live-state .icon-tile{width:60px;height:60px}.live-state>.badge{margin-left:auto}.live-vehicle-content{display:grid;grid-template-columns:57% 43%;height:350px;border-radius:10px;overflow:hidden;gap:0}.live-photo{height:350px}.live-telemetry{padding:16px 16px 0 23px}.soc-and-range{display:flex;align-items:flex-start;gap:18px;min-height:214px}.soc-gauge{width:168px;height:168px;position:relative;flex-shrink:0}.soc-gauge svg{width:100%;height:100%;transform:rotate(-90deg);fill:none;stroke:#dfe9f4;stroke-width:13}.soc-gauge svg circle{stroke-linecap:round}.soc-progress{stroke:var(--solar);stroke-dasharray:465;stroke-dashoffset:465;transition:stroke-dashoffset .6s}.soc-gauge>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.soc-gauge strong{font-size:34px;line-height:1.2}.soc-gauge>div>span{font-size:16px;color:#536d94}.soc-gauge small{font-size:10px;margin-top:4px}.range-stats{flex:1;min-width:0}.range-stats>span{display:block;padding:7px 0 14px;color:#536d94;font-size:12px}.range-stats>span+span{border-top:1px solid var(--border);padding-top:14px}.range-stats strong{display:block;font-size:24px;color:var(--text);margin-top:3px;white-space:nowrap}.range-stats small{font-size:10px;display:block;margin-top:4px}.live-power-row{border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:8px;padding-top:21px}.live-power-row>span{font-size:12px;color:#536d94;flex:1;white-space:nowrap}.live-power-row>span>.icon{width:17px;height:17px;vertical-align:middle;color:var(--primary)}.live-power-row strong{display:block;color:var(--text);font-size:23px;margin-top:7px}.live-chart{padding:14px 18px;margin-top:14px;height:228px}.live-chart .chart{height:154px;min-height:0}.live-chart .section-title{min-height:30px}.live-chart h2{font-size:16px}.chart-caption{font-size:10px;display:block;margin-top:0}.live-bottom{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px;margin-top:12px}.live-bottom>.card{padding:14px 16px;min-height:96px}.live-bottom h3{font-size:14px}.live-bottom h3 small{font-size:11px}.live-bottom .stat-pair{font-size:11px;margin-top:10px}.live-bottom .stat-pair strong{font-size:17px}.live-controls{min-width:0;display:flex;flex-direction:column;gap:12px}.action-card{padding:12px}.stop-button{display:flex;align-items:center;justify-content:center;min-height:60px;width:100%;border:1px solid #ffd2d6;background:var(--danger-soft);color:#c82031;font-size:18px;font-weight:650;border-radius:12px}.stop-button.start{background:var(--primary-soft);border-color:#c3dcff;color:var(--primary)}.control-card{padding:16px}.control-card h2{font-size:16px}.control-card .section-title{gap:12px}.control-card .section-title .icon-tile{width:46px;height:46px;border-radius:12px}.control-card .icon-tile .icon{width:29px;height:29px}.control-card .section-title p{font-size:13px;color:#617493;margin-top:5px;line-height:1.5}.control-note{font-size:12px;line-height:1.6;color:#617493;margin-top:8px}.control-note:empty{display:none}.toggle-row{display:flex;align-items:center;gap:12px;position:relative;min-height:44px;cursor:pointer}.toggle-row>span:not(.icon-tile){flex:1;min-width:0}.toggle-row strong{font-size:16px;display:block}.toggle-row small{display:block;margin-top:5px;font-size:13px;line-height:1.45}.toggle-row>.icon-tile{width:46px;height:46px;border-radius:12px}.toggle-row input{position:absolute;right:0;width:45px;height:28px;opacity:0;cursor:pointer}.switch-ui{display:block;flex-shrink:0;width:45px;height:26px;background:#c7d7ea;border-radius:20px;position:relative;transition:background .2s;margin-left:auto;pointer-events:none}.switch-ui:after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #274a6b20;transition:transform .2s}.toggle-row input:checked+.switch-ui{background:var(--primary)}.toggle-row input:checked+.switch-ui:after{transform:translateX(19px)}.toggle-row input:focus-visible+.switch-ui{outline:3px solid #086cff66;outline-offset:3px}.summary-link{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--border);border-radius:10px;background:#f7fbff;padding:13px 12px;margin-top:14px;font-size:13px;color:#536d94}.summary-link strong{color:var(--text);margin-left:auto;white-space:nowrap}.summary-link .icon{width:16px;height:16px}.quick-inputs{display:grid;grid-template-columns:1fr 74px;gap:16px;align-items:center;margin-top:12px}.quick-inputs input[type=number]{width:100%;height:38px;border:1px solid #d5e1ed;border-radius:8px;text-align:center;color:var(--text);background:#fff}.control-card>.outline-button{width:100%;font-size:13px;min-height:38px;margin-top:9px}.instant-button{display:flex;align-items:center;gap:12px;width:100%;margin-top:18px;padding:13px;border:1px solid #ffe1c2;background:#fff7ee;color:#d2782c;border-radius:11px;text-align:left}.instant-button strong{display:block;font-size:17px}.instant-button small{display:block;font-size:11px;margin-top:2px;color:#b76c2b}.instant-button>.icon:last-child{width:17px;height:17px;margin-left:auto}
.energy-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:16px}.energy-kpis .kpi{min-height:133px;padding:16px 13px;gap:11px;align-items:flex-start}.energy-kpis .icon-tile{width:48px;height:48px;border-radius:12px}.energy-kpis .icon-tile .icon{width:28px;height:28px}.energy-kpis .kpi-label{font-size:12px;white-space:normal}.energy-kpis .kpi strong{font-size:26px}.energy-main{display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);gap:16px;margin-bottom:14px}.large-flow,.energy-history{height:325px;padding:14px 16px}.large-flow .section-title{gap:10px}.large-flow .badge{margin-left:auto}.large-flow .energy-flow{height:220px}.card-note{display:block;font-size:10px;line-height:1.4}.history-controls{display:flex;align-items:center;gap:8px;margin-top:8px}.history-controls .icon-button{width:32px;min-height:32px;border-radius:7px;font-size:20px;padding:0}.history-controls input,.history-controls select,.energy-bottom select{min-height:34px;background:#fff;border:1px solid var(--border);border-radius:8px;color:#405a82;padding:4px 8px;font-size:12px;min-width:0}.history-controls input{max-width:150px}.history-controls select{margin-left:auto;max-width:170px}.energy-history .chart{height:170px;min-height:0}.data-table{font-size:12px;color:#617493;max-height:160px;overflow:auto}.data-table summary{cursor:pointer;min-height:24px}.data-table table{width:100%;border-collapse:collapse;font-size:12px}.data-table th,.data-table td{padding:5px;border-bottom:1px solid var(--border);text-align:left}.energy-bottom{display:grid;grid-template-columns:1.15fr 1.1fr 1fr;gap:12px}.energy-bottom>.card{padding:16px;min-height:225px}.energy-bottom h2{font-size:16px}.energy-bottom .chart{height:156px;min-height:0}.energy-bottom select{margin-left:auto;max-width:125px}.share-content{display:flex;align-items:center;gap:22px;margin-top:18px}.share-ring{width:138px;height:138px;border:16px solid #e5edf6;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-shrink:0}.share-ring strong{font-size:20px;white-space:nowrap}.share-ring>span{font-size:11px;color:#617493;margin-top:3px}.share-content p{font-size:13px;line-height:1.6;color:#536d94}.share-content small{display:block;font-size:11px;margin-top:7px}.coverage-card dl{margin:15px 0 0}.coverage-card dl>div{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:7px 0;border-bottom:1px solid #edf3f9}.coverage-card dt{color:#617493}.coverage-card dd{margin:0;text-align:right;font-size:11px;color:#405a82}
.configuration-banner{display:grid;grid-template-columns:62fr 38fr;gap:16px;height:185px;padding:8px;margin-bottom:16px}.banner-vehicle{position:relative;min-width:0;border-radius:10px;overflow:hidden}.banner-photo{height:169px}.banner-photo img{object-position:75% 55%}.banner-photo:not(.awaiting-image):after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff 0,#ffffffed 20%,transparent 55%)}.banner-caption{position:absolute;top:0;bottom:0;left:24px;display:flex;align-items:center;gap:23px;pointer-events:none}.banner-caption strong{display:block;font-size:23px;letter-spacing:-.5px}.banner-caption span{display:block;font-size:16px;color:#617493;margin-top:6px}.mazda-logo{width:70px;height:54px;object-fit:contain}.banner-photo.awaiting-image .asset-placeholder{align-items:flex-end;padding-right:25px;text-align:right;padding-left:42%}.banner-info{display:flex;align-items:flex-start;gap:18px;padding:26px 22px;background:linear-gradient(110deg,#f9fcff,#f1f7ff);border-radius:10px}.banner-info>.icon-tile{width:52px;height:52px;border-radius:12px}.banner-info>.icon-tile .icon{width:32px;height:32px}.banner-info h2{font-size:20px;margin-bottom:9px}.banner-info p{font-size:14px;line-height:1.7;color:#617493}.configuration-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.configuration-grid>.card,.configuration-right>.card{padding:16px}.configuration-grid .section-title{margin-bottom:12px}.configuration-right{display:flex;flex-direction:column;gap:12px}.parameter{border:1px solid #d5e4f3;border-radius:12px;padding:13px 15px;background:#f7fbff;margin-top:12px;scroll-margin-top:20px}.parameter-heading{display:flex;align-items:center;gap:10px;justify-content:space-between}.parameter-heading label{font-size:16px;font-weight:600;line-height:1.3}.parameter-heading output{display:inline-flex;align-items:center;justify-content:center;min-width:80px;min-height:26px;padding:3px 10px;background:#e2f3ff;border:1px solid #acd7ff;border-radius:20px;color:#12629b;font-size:13px;white-space:nowrap}.parameter>p{font-size:12px;color:#617493;line-height:1.55;margin-top:5px}.original-name{font-size:11px;display:inline;color:#617493}.original-name:before{content:' · '}.parameter-inputs{display:grid;grid-template-columns:1fr 92px;gap:18px;align-items:center;margin-top:6px}.parameter-inputs input[type=number]{width:100%;height:38px;border:1px solid #cbd9e8;border-radius:8px;background:#fff;color:#0c1838;text-align:center;font-size:15px;padding:5px}.range-limits{position:relative;display:flex;justify-content:space-between;padding-right:110px;font-size:12px;color:#617493;margin-top:4px}.zero-marker{position:absolute;left:calc((100% - 110px)/2);transform:translateX(-50%)}.parameter .field-info{background:#ecf5ff;border:1px solid #cee3fa;border-radius:7px;padding:7px 10px;color:#365a87;font-size:12px}.field-error{color:#b12b3a!important}.parameter.invalid{border-color:#e7a4ad;background:#fff9fa}input[type=range]{appearance:none;width:100%;height:8px;border-radius:20px;background:linear-gradient(90deg,#29b56f var(--progress,0%),#dae7f2 var(--progress,0%));cursor:pointer;margin:10px 0}input[type=range]::-webkit-slider-thumb{appearance:none;width:21px;height:21px;border:2px solid #169d73;background:#fff;border-radius:50%;box-shadow:0 2px 5px #073d3320}input[type=range]::-moz-range-thumb{width:17px;height:17px;border:2px solid #169d73;background:#fff;border-radius:50%}.system-card>.toggle-row{padding:5px 0 8px;scroll-margin-top:20px}.system-card .toggle-row strong{font-size:14px}.system-card .toggle-row small{font-size:12px}.save-bar{display:flex;align-items:center;gap:12px;position:sticky;bottom:0;padding:14px 0;background:#f5fafff2;backdrop-filter:blur(8px);z-index:5;min-height:74px}.save-bar>div{flex:1;min-width:0}.save-bar>div>strong{display:block;font-size:14px;color:#466383}.save-bar>div>span{display:block;font-size:12px;color:#617493;margin-top:3px}.save-bar .primary-button{min-width:250px}.save-bar .outline-button{font-size:13px}.inline-error{color:#b52f3f;padding:12px 16px;border:1px solid #edbdc3;border-radius:9px;background:#fff4f5;font-size:14px;margin-top:8px}.text-button{background:transparent;border:0;color:var(--primary);font-size:13px;padding:9px 0}
.app-footer{display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#617493;padding:16px 2px 0}.toast{position:fixed;bottom:22px;left:calc(50% + 124px);transform:translate(-50%,15px);opacity:0;pointer-events:none;border:1px solid #c9dcf2;border-radius:11px;background:#fff;color:#345d89;font-size:14px;padding:14px 22px;box-shadow:0 7px 30px #214b7b18;max-width:calc(100vw - 36px);width:max-content;z-index:80;transition:transform .2s,opacity .2s}.toast.visible{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:#edbdc3;color:#ae3341;background:#fff7f8}dialog{padding:26px;border:1px solid var(--border);border-radius:15px;color:var(--text);max-width:520px;background:#fff;box-shadow:0 18px 70px #112a4930}dialog::backdrop{background:#15325355}dialog>p{margin-top:12px;color:#617493;line-height:1.7}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:23px}.mobile-menu,.drawer-backdrop{display:none}.pulse{animation:value-pulse .5s ease}@keyframes flow{to{stroke-dashoffset:-44}}@keyframes value-pulse{40%{color:var(--primary)}}
@media(max-width:1439px) and (min-width:1100px){.sidebar{width:216px}.wordmark{font-size:26px;padding-left:20px;gap:4px}.wordmark .icon{width:25px}.workspace{margin-left:216px;padding:22px}.overview-main{grid-template-columns:minmax(0,1.8fr) minmax(330px,1fr)}.overview-charge>.section-title{width:calc(48% - 20px)}.overview-charge>.section-title h2{font-size:16px}.overview-vehicle{grid-template-columns:44% 56%}.overview-stats{padding-left:5px;padding-right:5px}.stat-row strong,.stat-pair strong{font-size:19px}.stat-pair{font-size:12px;gap:8px}.config-strip{gap:12px}.config-strip h2{font-size:14px}.config-strip>div:not(.section-title){padding-left:12px}.energy-kpis{grid-template-columns:repeat(3,1fr)}.energy-kpis .kpi{min-height:105px}.live-page{grid-template-columns:minmax(0,1fr) 360px}.live-vehicle-card{height:auto}.live-vehicle-content{height:auto;grid-template-columns:1fr}.live-photo{height:290px}.live-telemetry{padding:18px}.soc-and-range{min-height:180px}.live-power-row{padding-top:15px}.live-chart{height:250px}.live-chart .chart{height:176px}.overview-bottom{grid-template-columns:1.2fr 1fr 1fr}.overview-bottom>.card{padding:12px}.overview-bottom .right-value{display:none}.compact .flow-node{width:95px}.overview-bottom h2{font-size:14px}.configuration-banner{height:auto;grid-template-columns:60fr 40fr}.banner-info{padding:20px 15px;gap:12px}.banner-info p{font-size:13px}.energy-bottom{grid-template-columns:1fr 1fr}.coverage-card{grid-column:1/-1}.share-content{gap:13px}.share-ring{width:120px;height:120px;border-width:13px}.large-flow .flow-node{width:114px;font-size:11px}}
@media(max-width:1099px){.sidebar{width:248px;transform:translateX(-100%);transition:transform .2s;background:#f7fbff}.sidebar.open{transform:translateX(0)}.mobile-menu{display:flex;position:fixed;z-index:45;left:14px;top:18px;background:#fff;font-size:22px}.sidebar.open .wordmark{margin-left:30px;font-size:24px;gap:2px;padding-left:28px}.sidebar.open .wordmark .icon{width:22px}.drawer-backdrop:not([hidden]){display:block;position:fixed;inset:0;background:#12345644;z-index:25}.workspace{margin-left:0;padding:24px;max-width:none}.page-header{padding-left:50px}.header-tools{gap:12px}.page-header>div>p{font-size:16px}.overview-main{grid-template-columns:1fr}.overview-mode{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.overview-mode>.section-title{grid-column:1/-1;margin-bottom:0}.summary-row{margin-top:0;padding:12px;gap:10px}.summary-row>.icon-tile{width:36px;height:36px}.summary-row>.icon{display:none}.overview-charge>.section-title{width:calc(44% - 25px)}.overview-bottom{grid-template-columns:1fr 1fr}.overview-bottom>.mini-flow{grid-column:1/-1;height:225px}.compact{height:165px}.compact .flow-node{width:140px;padding:9px;font-size:12px}.compact .flow-node strong{font-size:17px}.config-strip{flex-wrap:wrap}.config-strip>.section-title{flex-basis:100%;flex-grow:1}.config-strip>.outline-button{margin-left:auto}.live-page{grid-template-columns:1fr}.live-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px}.live-controls>.action-card{grid-column:1/-1;order:-2}.live-controls>.control-card:last-child{grid-column:1/-1}.live-controls .quick-inputs{max-width:500px}.live-vehicle-card{height:auto}.live-vehicle-content{height:350px}.live-state h2{font-size:21px}.soc-gauge{width:145px;height:145px}.live-telemetry{padding:14px}.range-stats strong{font-size:21px}.soc-and-range{gap:12px}.live-power-row strong{font-size:20px}.live-chart{height:250px}.live-chart .chart{height:178px}.energy-kpis{grid-template-columns:repeat(3,1fr)}.energy-kpis .kpi{min-height:105px}.energy-main{grid-template-columns:1fr}.energy-main>.card{height:335px}.energy-bottom{grid-template-columns:1fr 1fr}.coverage-card{grid-column:1/-1}.configuration-banner{grid-template-columns:1fr;height:auto}.banner-vehicle{height:169px}.banner-info{padding:20px}.configuration-grid{grid-template-columns:1fr}.live-main{display:contents}.live-state{min-height:72px;height:auto}.live-vehicle-card{order:-1}.live-controls{order:0}.live-chart{order:2}.live-bottom{order:3}.toast{left:50%}}
@media(max-width:767px){h1{font-size:27px;letter-spacing:-.7px}h2{font-size:18px}.workspace{padding:20px 16px}.page-header{padding-left:48px;min-height:91px;gap:10px;flex-wrap:wrap;margin-bottom:18px}.page-header>div:first-child{width:100%}.page-header>div>p{font-size:15px;margin-top:7px}.header-tools{padding-top:0;width:100%;justify-content:space-between}.profile summary{font-size:14px;gap:7px}.profile-avatar{width:32px;height:32px}.profile-avatar .icon{width:19px;height:19px}.demo-indicator{font-size:10px;padding:4px 6px}.overview-kpis{grid-template-columns:1fr;gap:10px}.kpi{min-height:103px;padding:16px;gap:18px}.kpi-label{font-size:15px}.kpi strong{font-size:30px}.kpi small{font-size:13px}.kpi .icon-tile{width:60px;height:60px}.overview-charge{height:auto;padding:10px}.overview-charge>.section-title{position:static;width:100%;padding:0 4px 10px;gap:8px;flex-wrap:wrap}.overview-charge>.section-title h2{font-size:17px}.overview-charge>.section-title .badge{margin-left:auto;font-size:11px}.overview-charge>.section-title .small-icon{width:30px;height:30px}.overview-vehicle{height:auto;display:flex;flex-direction:column}.overview-stats{padding:10px 8px 15px;background:#fff}.stat-row{margin:5px 0 14px}.stat-row>span,.stat-pair{font-size:14px}.stat-row strong,.stat-pair strong{font-size:22px}.stat-row small{font-size:12px}.stat-pair{margin:16px 0;justify-content:flex-start;gap:35px}.overview-photo{height:200px;order:1}.overview-photo:after{display:none}.vehicle-caption{bottom:10px;font-size:12px}.overview-mode{display:block;padding:15px}.overview-mode>.section-title{margin-bottom:12px}.summary-row{margin-top:10px;padding:14px;min-height:75px}.summary-row>span:nth-child(2){font-size:13px}.summary-row strong{font-size:15px}.summary-row small{font-size:12px}.summary-row>.icon{display:block}.overview-bottom{grid-template-columns:1fr;gap:12px}.overview-bottom>.card{height:240px;padding:16px}.overview-bottom>.mini-flow{grid-column:auto;height:250px}.compact{height:185px}.compact .flow-node{width:108px;font-size:11px;padding:7px}.compact .flow-node strong{font-size:15px}.config-strip{display:none}.mini-chart .chart{height:175px}.overview-bottom h2{font-size:17px}.right-value{font-size:14px}.live-page{gap:12px}.live-controls{display:flex;order:0}.live-main{display:contents}.live-controls>.action-card{order:-2}.live-vehicle-card{order:-1;padding:10px}.live-state{gap:10px;flex-wrap:wrap;padding:3px 2px 12px}.live-state h2{font-size:21px}.live-state p{font-size:14px;line-height:1.6}.live-state .icon-tile{width:45px;height:45px}.live-state>.badge{margin-left:57px}.live-vehicle-content{display:flex;flex-direction:column;height:auto}.live-photo{height:200px;order:1;margin-top:18px}.live-telemetry{padding:10px 4px}.soc-and-range{gap:15px;min-height:178px;align-items:center}.soc-gauge{width:143px;height:143px}.soc-gauge strong{font-size:28px}.soc-gauge small{font-size:10px}.range-stats>span{font-size:12px;padding:5px 0 12px}.range-stats strong{font-size:22px}.range-stats small{font-size:11px}.live-power-row{gap:7px;padding-top:18px}.live-power-row>span{font-size:11px;white-space:normal;line-height:1.5}.live-power-row>span>.icon{width:15px;height:15px}.live-power-row strong{font-size:20px;white-space:nowrap}.control-card{padding:16px}.control-card h2{font-size:18px}.control-note{font-size:13px}.stop-button{min-height:58px;font-size:18px}.summary-link{font-size:14px}.quick-inputs{grid-template-columns:1fr 80px}.quick-inputs input[type=number]{font-size:16px;height:42px}.control-card>.outline-button{font-size:14px;min-height:44px}.live-controls>.card{margin:0}.live-chart{order:2;height:275px;padding:15px}.live-chart .section-title{flex-wrap:wrap;gap:8px}.live-chart h2{font-size:17px}.live-chart .chart-legend{margin-left:0;font-size:12px}.live-chart .chart{height:170px}.chart-caption{font-size:11px;line-height:1.5}.live-bottom{order:3;grid-template-columns:1fr;margin-top:0}.live-bottom>.card{padding:16px;min-height:100px}.live-bottom h3{font-size:16px}.live-bottom .stat-pair{font-size:13px;margin-bottom:0;gap:28px}.live-bottom .stat-pair strong{font-size:20px}.energy-kpis{grid-template-columns:1fr;gap:10px}.energy-kpis .kpi{min-height:100px;align-items:center;padding:16px;gap:18px}.energy-kpis .kpi-label{font-size:14px}.energy-kpis .kpi strong{font-size:29px}.energy-main{gap:12px}.energy-main>.large-flow{height:345px;padding:15px 12px}.large-flow .section-title{gap:7px;flex-wrap:wrap}.large-flow .section-title h2{font-size:17px}.large-flow .badge{font-size:11px;padding:4px 7px}.large-flow .energy-flow{height:225px}.energy-flow .flow-node{width:108px;padding:9px 5px;font-size:11px;gap:5px}.energy-flow .flow-node strong{font-size:16px}.energy-flow .flow-node .icon{width:23px;height:23px}.flow-hub{padding:7px;border-width:4px}.flow-hub .icon{width:20px;height:20px}.card-note{font-size:11px;line-height:1.5}.energy-main>.energy-history{height:auto;min-height:335px;padding:16px}.energy-history .section-title h2{font-size:18px}.history-controls{flex-wrap:wrap;gap:5px;margin-top:12px}.history-controls input{max-width:165px;flex:1;font-size:14px;min-height:38px}.history-controls select{margin-left:0;max-width:100%;width:100%;font-size:14px;min-height:40px;margin-top:5px}.history-controls .icon-button{min-height:38px;width:34px}.energy-history .chart{height:180px}.data-table{font-size:13px;max-height:200px;margin-top:5px}.energy-bottom{grid-template-columns:1fr}.coverage-card{grid-column:auto}.energy-bottom>.card{padding:16px;min-height:235px}.share-content{gap:14px;align-items:center}.share-ring{width:115px;height:115px;border-width:13px}.share-ring strong{font-size:17px}.share-ring>span{font-size:10px}.share-content p{font-size:13px}.share-content small{font-size:11px}.coverage-card dl>div{font-size:13px;padding:10px 0}.coverage-card dd{font-size:12px}.configuration-banner{gap:10px;padding:8px}.banner-vehicle{height:200px}.banner-photo{height:200px}.banner-caption{left:16px;top:0;bottom:auto;height:65px;gap:12px}.banner-caption strong{font-size:20px}.banner-caption span{font-size:13px;margin-top:3px}.mazda-logo{width:50px;height:40px}.banner-photo.awaiting-image .asset-placeholder{padding:75px 15px 10px;align-items:center;text-align:center}.banner-photo:not(.awaiting-image):after{background:linear-gradient(180deg,#fffffff2,transparent 60%)}.banner-info{padding:16px;gap:12px}.banner-info>.icon-tile{width:42px;height:42px}.banner-info>.icon-tile .icon{width:26px;height:26px}.banner-info h2{font-size:19px}.banner-info p{font-size:13px;line-height:1.7}.configuration-grid>.card,.configuration-right>.card{padding:14px}.configuration-grid h2{font-size:18px}.configuration-grid .section-title{gap:10px}.parameter{padding:13px 12px;margin-top:13px}.parameter-heading{gap:8px;align-items:flex-start}.parameter-heading label{font-size:15px}.parameter-heading output{min-width:70px;font-size:13px;padding:3px 8px;min-height:25px}.parameter>p{font-size:12px;line-height:1.6;margin-top:7px}.original-name{font-size:11px}.parameter-inputs{grid-template-columns:1fr 76px;gap:12px;margin-top:10px}.parameter-inputs input[type=number]{font-size:16px;height:40px}.range-limits{font-size:12px;padding-right:88px}.zero-marker{left:calc((100% - 88px)/2)}.parameter .field-info{font-size:12px;padding:8px}.system-card .toggle-row{gap:10px}.save-bar{flex-wrap:wrap;gap:8px;padding:13px 0;background:#f5fafff5}.save-bar>div{flex-basis:100%}.save-bar .primary-button{min-width:0;flex:1;font-size:13px;min-height:46px;padding:9px 10px;gap:6px}.save-bar .outline-button{font-size:12px;padding:9px 10px;min-height:46px}.save-bar>div>strong{font-size:14px}.save-bar>div>span{font-size:12px}.save-bar .primary-button .icon{width:16px;height:16px}.app-footer{font-size:11px;padding-top:16px;flex-wrap:wrap;gap:6px}.toast{bottom:18px;font-size:13px;padding:12px 16px}dialog{max-width:calc(100vw - 28px);padding:20px}.dialog-actions{flex-wrap:wrap;gap:8px}.dialog-actions button{font-size:13px;padding:9px 12px;flex:1}.skip-link{left:16px}}
@media(max-width:380px){.page-header h1{font-size:25px}.overview-charge>.section-title h2{font-size:16px}.overview-charge>.section-title .badge{margin-left:0}.overview-mode h2{font-size:16px}.summary-row{padding:12px;gap:9px}.summary-row strong{font-size:14px}.summary-row>.icon-tile{width:34px;height:34px}.range-stats strong{font-size:20px}.soc-gauge{width:132px;height:132px}.soc-and-range{gap:10px}.live-power-row strong{font-size:18px}.share-content{gap:10px}.share-ring{width:102px;height:102px;border-width:11px}.share-ring strong{font-size:16px}.parameter-heading label{font-size:14px}.parameter-heading output{min-width:65px;font-size:12px}.save-bar .primary-button{font-size:12px}.save-bar .outline-button{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

.mobile-live-state{display:none}
@media(min-width:1100px){.page-header{margin-bottom:16px}.overview-main{margin-bottom:12px}.overview-bottom>.card{height:216px}.workspace{padding-bottom:12px}.workspace:has(.overview-page:not([hidden])) .app-footer{display:none}}
@media(max-width:767px){.mobile-live-state{display:block;order:-3}.mobile-live-state h2{font-size:22px}.mobile-live-state p{font-size:14px;color:var(--text-secondary);margin:5px 0 10px}.live-state{display:none}.live-controls{display:contents}.live-controls>.action-card{order:-2}.live-controls>.control-card{order:0}.live-vehicle-card{order:-1}}

.plot-legend{display:flex;justify-content:flex-end;gap:12px;position:absolute;right:5px;top:5px;left:32px;font-size:11px;color:#4f6385}.plot-legend span{display:flex;align-items:center;gap:5px;white-space:nowrap}.plot-legend i{width:9px;height:9px;display:block;border-radius:50%;flex-shrink:0}.profile-avatar .icon{fill:currentColor;stroke-width:1}.summary-row>span:nth-child(2){font-size:13px}.summary-row strong{font-size:15px}.summary-row small{font-size:12px}.stat-row>span,.stat-pair{font-size:14px}.config-strip>div>span,.config-strip small{font-size:12px}.overview-bottom h2{font-size:16px}
@media(max-width:767px){.plot-legend{font-size:10px;gap:8px}}

.kpi>div{min-width:0}.kpi-label{white-space:normal}.vehicle-photo picture{display:block;width:100%;height:100%}
@media(max-width:767px){.banner-photo img{object-position:58% 55%}}

.live-indicator{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:12px;color:#168747;background:#eafbf2;border:1px solid #cbefdc;border-radius:6px;padding:5px 8px}.live-indicator:before{content:"";height:7px;width:7px;background:currentColor;border-radius:50%}.share-content p strong{display:block;color:var(--text);font-size:17px}.coverage-card{overflow:auto}

/* Configuration follows the supplied compact, icon-led reference. */
.header-weather{display:flex;align-items:center;gap:12px;border:0;padding:0;background:transparent;text-align:left;min-width:170px;color:var(--text)}
.header-weather>span{display:block}.header-weather strong{display:block;font-size:22px;line-height:1.2}.header-weather small{display:block;font-size:12px;line-height:1.5;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.weather-symbol{width:44px;height:44px;flex-shrink:0;color:#9ab9d7;fill:currentColor;stroke-width:1.4}.weather-symbol[data-tone=sun]{color:#ffb516}.weather-symbol[data-tone=moon]{color:#6b84bd}.weather-symbol[data-tone=rain]{color:#6c9fd6}
.weather-card{min-width:0;padding:14px 16px!important}.weather-card .section-title{gap:8px}.weather-card .section-title h2{font-size:16px}.weather-card .section-title .small-icon{color:#f5a000;background:#fff8e9}.weather-card .section-title .text-button{margin-left:auto;padding:0;min-width:32px;min-height:32px;color:#6382a9}.weather-card .section-title .text-button .icon{width:20px;height:20px}
.weather-current{display:flex;align-items:center;gap:12px;margin:10px 0}.weather-current>div{min-width:0;flex:1}.weather-current>div>strong{display:block;font-size:24px;line-height:1.2}.weather-current>div>span{display:block;font-size:12px;color:#576d91;margin:3px 0}.weather-current>div>small{display:block;font-size:11px;line-height:1.3}.weather-current .weather-symbol{width:40px;height:40px}.weather-current dl{margin:0;padding-left:12px;border-left:1px solid var(--border);font-size:11px;color:#5a7196;max-width:150px}.weather-current dl>div+div{margin-top:6px}.weather-current dd{margin:2px 0 0;font-size:13px;font-weight:650;color:var(--text)}
.weather-days{display:flex;border-top:1px solid var(--border);padding-top:7px;gap:14px;min-height:0}.weather-days:empty{display:none}.weather-days>div{flex:1}.weather-days span{display:block;font-size:11px;color:#5e7394}.weather-days strong{display:block;font-size:12px;margin-top:2px}.weather-status{font-size:10px;color:#5c7192;line-height:1.4;margin-top:7px}.weather-source{font-size:10px;color:#4b6b98;text-decoration:underline}
.data-availability{margin-top:12px;color:#5c7192;font-size:12px}.data-availability summary{cursor:pointer;padding:7px 0}.data-availability dl{display:flex;flex-wrap:wrap;gap:12px 24px;margin:8px 0}.data-availability dt{font-size:11px}.data-availability dd{margin:2px 0;color:var(--text);font-weight:600}
#weather-form>p{font-size:14px;line-height:1.6;margin:12px 0;color:#5a7195}#weather-form>label{display:block;font-weight:600;font-size:13px;margin:14px 0 7px}#weather-query{width:100%;height:44px;padding:8px 12px;border:1px solid #c5d8ee;border-radius:8px;font-size:16px;background:white;color:var(--text)}
@media(max-width:1099px){.header-weather{min-width:0}.header-weather small{max-width:125px}.header-weather>span>small:first-of-type{display:none}.weather-card .section-title h2{font-size:17px}}
@media(max-width:767px){.header-weather{gap:6px;min-height:40px}.header-weather .weather-symbol{width:27px;height:27px}.header-weather strong{font-size:17px}.header-weather small{font-size:10px;max-width:110px}.weather-current{margin:14px 0}.weather-card .section-title h2{font-size:17px}.weather-current>div>strong{font-size:27px}.weather-current>div>span{font-size:13px}.weather-current>div>small{font-size:11px}.weather-current dl{font-size:11px}.weather-current dd{font-size:13px}.weather-status,.weather-source{font-size:11px}.weather-days span{font-size:12px}.weather-days strong{font-size:13px}.data-availability{font-size:13px}}
.configuration-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:14px;align-items:stretch}
.configuration-grid>.card,.configuration-right>.card{padding:14px}
.configuration-grid .section-title{gap:12px;margin-bottom:10px;min-height:46px}
.configuration-grid .section-title .small-icon{width:44px;height:44px;border-radius:10px;flex-shrink:0}
.configuration-grid .section-title h2{font-size:19px}
.configuration-grid .section-title p{color:#586e96;font-size:13px;margin-top:3px;line-height:1.4}
.charging-parameters{display:flex;flex-direction:column}
.parameter{display:grid;grid-template-columns:44px minmax(0,1.12fr) minmax(210px,1fr);align-items:center;gap:12px;padding:9px 12px;margin-top:10px;min-height:100px;background:linear-gradient(110deg,#fbfdff,#f7fbff);border-color:#dfebf8}
.charging-parameters>.parameter{flex:1}
.parameter-icon{width:44px;height:44px;display:grid;place-items:center;align-self:start;margin-top:3px;border-radius:50%;background:linear-gradient(135deg,#f3f9ff,#e7f2ff);color:#4e6995;flex-shrink:0}
.parameter-icon .icon{width:26px;height:26px;stroke-width:2.3}
.parameter-icon:has(use[href="#i-bolt"]) .icon,.parameter-icon:has(use[href="#i-home"]) .icon{fill:currentColor;stroke-width:.7}
.parameter-icon:has(use[href="#i-bars"]){color:var(--primary)}
.parameter-icon.sun-icon{color:#f5a000;background:#fff9ee}
.parameter-icon.sun-icon .icon{fill:#ffbc23;stroke-width:1.7}
.parameter-copy{align-self:center;min-width:0}
.parameter-copy label{display:block;font-size:14px;font-weight:650;line-height:1.35;cursor:pointer}
.parameter-copy p{color:#5b7095;font-size:11px;line-height:1.45;margin-top:5px}
.parameter-controls{display:grid;grid-template-columns:minmax(0,1fr) 80px;grid-template-rows:22px 28px 15px;column-gap:14px;row-gap:1px;align-items:center;min-width:0}
.parameter-controls output{grid-column:2;grid-row:1;display:flex;justify-content:center;align-items:center;border:1px solid #b7ddff;border-radius:20px;background:linear-gradient(#e9f6ff,#dff1ff);color:#115592;font-size:12px;white-space:nowrap;min-height:22px}
.parameter-controls input[type=range]{grid-column:1;grid-row:2;margin:0;height:8px;min-width:0}
.parameter-controls input[type=number]{grid-column:2;grid-row:2;width:100%;height:28px;border:1px solid #d0dce9;border-radius:7px;background:#fff;color:var(--text);font-size:14px;text-align:center;padding:4px;appearance:textfield}
.parameter-controls input[type=number]::-webkit-inner-spin-button{appearance:none}
.parameter-controls .range-limits{grid-column:1;grid-row:3;padding:0;margin:0;font-size:12px}
.parameter-controls input[type=range]::-webkit-slider-thumb{width:22px;height:22px;box-shadow:0 2px 5px #1737512b}
.parameter-controls .field-info{grid-column:1/-1;grid-row:4;line-height:1.35;font-size:11px;padding:5px 7px;margin:5px 0 0}
.parameter-controls .field-info:before{content:'i';font-weight:700;border:1.5px solid #0872ff;border-radius:50%;width:15px;height:15px;display:inline-grid;place-items:center;color:var(--primary);margin-right:6px;font-size:11px}
.parameter:has(.field-info){grid-template-columns:44px minmax(0,.9fr) minmax(250px,1.25fr)}
.parameter>.field-error{grid-column:2/-1;font-size:12px;margin:0}
.configuration-right{gap:12px;min-width:0}
.solar-parameters .parameter{min-height:86px;margin-top:8px}
.configuration-right>.system-card{padding-top:10px;padding-bottom:10px}.system-card .section-title{min-height:40px;margin-bottom:4px}
.system-card .section-title h2{font-size:18px}
.system-card .section-title .small-icon{height:38px;width:38px}
.system-card .toggle-row{padding:0 4px 5px;gap:12px;min-height:45px}
.system-card .toggle-row .parameter-icon{width:36px;height:36px;border-radius:9px;margin-top:0;color:var(--primary);align-self:center}
.system-card .telegram-copy{flex:1}
.system-card .toggle-row strong{font-size:13px}
.system-card .toggle-row small{font-size:10px;line-height:1.25;max-width:235px}
.system-card .toggle-row .switch-ui{width:50px;height:26px;margin-left:auto}
.system-card .toggle-row .switch-ui:after{width:20px;height:20px;top:2px;left:3px}
.system-card .toggle-row input:checked+.switch-ui:after{transform:translateX(23px)}
.system-card .toggle-row>.parameter-icon{flex:0 0 36px}.system-card .toggle-row>.telegram-state{flex:0 0 28px;font-size:11px;font-weight:650;min-width:28px}.system-card .toggle-row input{right:40px;width:50px}
.system-card>.parameter{grid-template-columns:38px minmax(0,1fr) minmax(290px,1.2fr);gap:12px;padding:7px 4px 0;border:0;border-top:1px solid #e5eef8;border-radius:0;background:transparent;margin-top:0;min-height:54px}
.system-card>.parameter .parameter-icon{width:36px;height:36px;margin-top:0;align-self:center}
.system-card>.parameter .parameter-copy label{font-size:12px}
.system-card>.parameter .parameter-copy p{font-size:10px;margin-top:1px;line-height:1.2}
.system-card>.parameter .parameter-controls{grid-template-columns:minmax(0,1fr) 66px 60px;grid-template-rows:30px 17px;gap:2px 10px}
.system-card>.parameter .parameter-controls input[type=range]{grid-column:1;grid-row:1}
.system-card>.parameter .parameter-controls output{grid-column:2;grid-row:1}
.system-card>.parameter .parameter-controls input[type=number]{grid-column:3;grid-row:1;height:30px;font-size:13px}
.system-card>.parameter .parameter-controls .range-limits{grid-row:2}
.configuration-page .save-bar{display:flex;flex-direction:column;align-items:stretch;gap:5px;min-height:0;padding:10px 0 0;background:#f5fafff2}
.save-bar>.save-feedback{display:none;align-items:center;gap:12px;font-size:12px;flex-wrap:wrap;padding:5px 2px}
.save-bar>.save-feedback.has-changes,.save-bar>.save-feedback:has(#config-feedback:not(:empty)){display:flex}
.save-bar>.save-feedback>strong,.save-bar>.save-feedback>span{display:inline;margin:0;font-size:12px}
.save-feedback .text-button{padding:0;margin-left:auto;font-size:12px}
.configuration-page .save-bar .primary-button{width:100%;min-height:44px;border-radius:10px;font-size:16px}
.configuration-page .save-bar .primary-button:disabled{opacity:.78}
.configuration-page .banner-info p{font-size:15px;line-height:1.65}
@media(min-width:768px) and (max-width:1450px){.configuration-grid{grid-template-columns:1fr}.configuration-right{display:grid;grid-template-columns:1fr 1fr;align-items:start}.parameter{grid-template-columns:44px minmax(0,1fr) minmax(300px,1fr)}.configuration-right .parameter,.configuration-right .parameter:has(.field-info){grid-template-columns:36px minmax(0,1fr)}.configuration-right .parameter-controls{grid-column:2;grid-row:2}.configuration-right .parameter-copy{grid-column:2}.system-card>.parameter{grid-template-columns:36px minmax(0,1fr)}.system-card .toggle-row{flex-wrap:wrap}.system-card .telegram-copy{min-width:150px}.configuration-page .banner-info p{font-size:13px}}
@media(max-width:767px){.configuration-grid{grid-template-columns:minmax(0,1fr);gap:12px}.configuration-right{display:flex}.configuration-grid>.card,.configuration-right>.card{padding:14px}.configuration-grid .section-title{align-items:flex-start;gap:10px}.configuration-grid .section-title h2{font-size:18px}.configuration-grid .section-title p{font-size:12px;line-height:1.5}.configuration-grid .section-title .small-icon{width:38px;height:38px}.parameter,.parameter:has(.field-info){grid-template-columns:36px minmax(0,1fr);align-items:start;gap:8px 10px;padding:12px;margin-top:12px;min-height:0}.parameter-icon{width:36px;height:36px}.parameter-icon .icon{width:23px;height:23px}.parameter-copy label{font-size:14px}.parameter-copy p{font-size:12px;line-height:1.5}.parameter-controls{grid-column:2;grid-row:2;grid-template-columns:minmax(0,1fr) 72px;column-gap:12px;grid-template-rows:25px 40px 18px;row-gap:4px}.parameter-controls input[type=number]{font-size:16px;height:40px}.parameter-controls output{font-size:13px}.parameter-controls .range-limits{font-size:12px}.parameter-controls .field-info{font-size:11px;line-height:1.5}.parameter>.field-error{grid-column:1/-1}.system-card .toggle-row{padding:6px 0 12px;gap:8px}.system-card .toggle-row small{font-size:11px}.system-card .toggle-row .parameter-icon{width:32px;height:32px}.telegram-state{font-size:11px}.system-card>.parameter{grid-template-columns:36px minmax(0,1fr);padding:12px 0 0;gap:6px 10px}.system-card>.parameter .parameter-copy label{font-size:14px}.system-card>.parameter .parameter-copy p{font-size:12px;line-height:1.5;margin-top:4px}.system-card>.parameter .parameter-controls{grid-column:2;grid-row:2;grid-template-columns:minmax(0,1fr) 64px 58px;column-gap:6px;grid-template-rows:40px 18px}.system-card>.parameter .parameter-controls input[type=number]{height:40px;font-size:16px}.configuration-page .save-bar{padding-top:12px}.configuration-page .save-bar .primary-button{font-size:15px;min-height:48px}.configuration-page .banner-info p{font-size:13px}}

@media(min-width:768px){.parameter-copy label{font-size:15px}.parameter-copy p{font-size:12px}.system-card>.parameter .parameter-copy label{font-size:13px}.system-card>.parameter .parameter-copy p{font-size:11px}}
@media(max-width:767px){.parameter-controls{grid-template-rows:25px 44px 18px}.parameter-controls input[type=number],.system-card>.parameter .parameter-controls input[type=number]{height:44px}.system-card>.parameter .parameter-controls{grid-template-rows:44px 18px}.parameter-controls input[type=range],.quick-inputs input[type=range]{height:40px;background-size:100% 8px;background-repeat:no-repeat;background-position:center;background-color:transparent}}

.sidebar nav a>.icon,.configuration-grid .section-title .small-icon:has(use[href="#i-bolt"])>.icon,.configuration-grid .section-title .small-icon:has(use[href="#i-home"])>.icon{fill:currentColor;fill-rule:evenodd;stroke-width:.8}

/* Supplied artwork: preserve transparency and keep navigation as vector controls. */
.art-icon{object-fit:contain;display:block;pointer-events:none;user-select:none}
.vehicle-connection{margin-top:20px;padding:20px}.vehicle-connection .section-title p{margin:5px 0 0;color:var(--muted,#52678b);font-size:14px}.vehicle-connection-body{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:14px 0}.vehicle-connection-body p{margin:0 0 6px}.vehicle-connection small,.vehicle-steps small{color:#52678b;line-height:1.5}.vehicle-pill{margin-left:auto;white-space:nowrap;background:#eef4fc;border:1px solid #dce8f6;border-radius:24px;padding:7px 12px;font-size:13px;font-weight:650;color:#415b80}.vehicle-pill.connected{background:#e9fbf1;color:#087b42;border-color:#c4f0da}.vehicle-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.vehicle-actions button,.vehicle-actions a{white-space:nowrap;min-height:44px}.vehicle-note{display:block;border-top:1px solid #e3edf7;padding-top:12px}#vehicle-select{margin:10px;padding:10px;border:1px solid #d3e2f2;border-radius:9px;max-width:100%}#vehicle-dialog{width:min(690px,calc(100vw - 32px));max-height:90dvh;overflow:auto;padding:28px}#vehicle-dialog h2{margin-top:0}#vehicle-dialog p{line-height:1.5;color:#415b80}#vehicle-dialog input{width:100%;min-height:44px;border:1px solid #c8daed;border-radius:9px;padding:10px;font:inherit;margin:8px 0}#vehicle-dialog .dialog-actions{margin-top:20px}.vehicle-steps{padding-left:23px}.vehicle-steps>li{padding:8px 0 14px 5px}.vehicle-steps details{margin-top:12px;font-size:14px}.vehicle-steps details summary{cursor:pointer;color:#0067ed}.vehicle-steps code{user-select:all}.soc-gauge small{line-height:1.3;max-width:116px} @media(max-width:767px){.vehicle-connection{padding:16px}.vehicle-connection .section-title{flex-wrap:wrap}.vehicle-connection .section-title>div{flex:1;min-width:180px}.vehicle-pill{margin-left:0}.vehicle-connection-body{align-items:stretch;flex-direction:column}.vehicle-actions>*{flex:1;justify-content:center}#vehicle-dialog{padding:20px}.vehicle-actions button,.vehicle-actions a{white-space:normal;text-align:center}.vehicle-steps{padding-left:19px}}
.icon-tile .icon.art-icon,.kpi .icon-tile .icon.art-icon{width:94%;height:94%}
.flow-node{display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:8px;row-gap:0;text-align:left}
.flow-node>.art-icon{grid-column:1;grid-row:1/span 2;width:32px;height:32px}
.flow-node>span{grid-column:2;grid-row:1;min-width:0}
.flow-node>strong{grid-column:2;grid-row:2;align-self:start}
.compact .flow-node{grid-template-columns:28px minmax(0,1fr);column-gap:5px}
.compact .flow-node>.art-icon{width:28px;height:28px}
.range-activation{min-height:44px;font-size:13px;padding:8px 12px;justify-self:start}
.parameter-controls .range-activation{grid-column:1/-1;grid-row:5;margin-top:6px}
.system-card>.parameter .parameter-controls .range-activation{grid-column:1/-1;grid-row:3}
.range-activation[aria-pressed="true"]{background:#e6f3ff;border-color:#0872ff;color:#075cb7}
.touch-range-locked{touch-action:pan-y pinch-zoom;pointer-events:none;opacity:.65}
.live-controls .range-activation{margin:10px 0 0}
@media(max-width:767px),(any-pointer:coarse){.charging-parameters>.parameter{flex:none}.parameter-controls{min-height:max-content}}
@media(max-width:767px){.header-tools{flex-wrap:wrap}.page-header:has(.header-weather:not([hidden])) .live-indicator{display:none}.energy-flow .flow-node{grid-template-columns:28px minmax(0,1fr);column-gap:5px}.energy-flow .flow-node>.art-icon{width:28px;height:28px}}
