/* Desktop fit matches the reference composition at 1920 × 1080. */
@media(min-width:1251px){
 .topbar{height:85px}.demo-notice{margin-bottom:12px}
 .top-grid{height:300px;grid-template-rows:minmax(0,1fr)}.top-grid>.card{min-height:0}.weather-picture{min-height:0}.weather-temp{margin:12px 0}
 .forecast .tabs{margin:10px 0}.forecast .hour{padding:8px 0}.forecast .days{margin-top:12px}.forecast .day img{width:30px;height:30px;margin:4px auto}
 .pv-bars{height:218px}.forecast-pv .card-title{margin-bottom:7px}
 .middle-grid{height:330px;grid-template-rows:minmax(0,1fr)}.middle-grid>.card{min-height:0}.chart-svg{height:210px}.chart-summary{gap:8px}.chart-stat strong{font-size:19px;margin-top:3px}.power-card .legend{margin-bottom:10px}
 .flow-scene{height:261px}.equipment-title{margin-top:17px;margin-bottom:12px}
 .equipment-top{min-height:140px;padding:12px 10px 8px}.equipment img{height:119px}
 .equipment strong{font-size:23px;margin-top:15px}.equipment-bottom{padding:12px}
 .page-foot{margin-top:12px}.card h2{font-size:20px}
}
.hour img,.day img{mix-blend-mode:multiply}

/* Symmetrical flow axes: all four icon centres align with the house centre. */
@media(min-width:1251px){
 .middle-grid{grid-template-columns:1.25fr 1fr}
 .chart-body{grid-template-columns:minmax(0,1fr) 165px;gap:14px}
 .chart-summary{padding-left:14px}
}
.flow-scene{max-width:600px}
.flow-house{left:29%;top:25%;width:42%;height:50%}
.node-pv,.node-battery{left:calc(50% - 28.5px)}
.node-grid,.node-home{top:calc(50% - 28.5px);width:80px}
.flow-card .card-title{margin-bottom:12px}
@media(max-width:760px){
 .node-pv,.node-battery{left:calc(50% - 24.5px)}
 .node-grid,.node-home{top:calc(50% - 24.5px);width:65px}
}