:root{--bg:#eaf5fb;--panel:rgba(248,253,255,.78);--panel2:rgba(255,255,255,.9);--line:rgba(75,151,184,.28);--cyan:#00a9c0;--blue:#287cf5;--green:#22a96a;--amber:#ef9b20;--red:#ec5362;--text:#17334a;--muted:#66879b}
html,body{background:#e8f4fa;color:var(--text)}
body{background:radial-gradient(circle at 18% -8%,#fff 0,#e8f7fc 27%,transparent 54%),radial-gradient(circle at 92% 6%,#cceeff 0,transparent 42%),linear-gradient(150deg,#edf8fb,#d9edf7)}
.topbar{position:relative;background:rgba(247,253,255,.78);border-bottom:1px solid rgba(45,137,178,.24);box-shadow:0 8px 26px rgba(38,102,133,.1);backdrop-filter:blur(22px) saturate(1.25)}
.topbar:after{content:'';position:absolute;left:18px;right:18px;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,#31c6d8 35%,#3b82f6 65%,transparent)}
.topbar p{color:#39859f}.topbar h1{color:#183b53}.topbar h1 b{color:#009db7}.top-actions{color:#426679}.top-actions a,.top-actions .live{border-color:rgba(37,128,169,.25);background:rgba(255,255,255,.62);color:#285870;box-shadow:0 4px 12px rgba(37,105,140,.07)}
main{position:relative}
main:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(33,126,166,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(33,126,166,.025) 1px,transparent 1px);background-size:34px 34px}
.kpis,.flow,.dashboard-grid{position:relative;z-index:1}
.kpis article{background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(238,249,253,.72));border-color:rgba(49,139,177,.28);box-shadow:0 7px 20px rgba(35,102,134,.08);backdrop-filter:blur(18px) saturate(1.2)}
.kpis article:nth-child(2){border-top-color:#3a82f6}.kpis article:nth-child(4){border-top-color:#20b983}.kpis article:nth-child(5){border-top-color:#9a72e7}.kpis article:nth-child(6){border-top-color:#45a9d5}
.kpis span,.kpis small{color:#66869a}.kpis strong{color:#173d57}.kpis small b{color:#008fac}
.flow{background:rgba(251,254,255,.76);border-color:rgba(54,143,182,.24);box-shadow:0 7px 22px rgba(38,105,137,.07);backdrop-filter:blur(18px)}
.flow div>span{background:linear-gradient(145deg,#daf5fb,#cce9ff);color:#047d9b;box-shadow:inset 0 0 0 1px rgba(37,139,179,.12)}.flow p,.flow>small{color:#6b8999}.flow b{color:#183c55}.flow>i{color:#62b9cc}
.panel{background:linear-gradient(155deg,rgba(255,255,255,.86),rgba(235,248,252,.73));border-color:rgba(47,135,173,.27);box-shadow:0 9px 28px rgba(34,99,130,.1);backdrop-filter:blur(19px) saturate(1.18)}
.panel-title{border-bottom-color:rgba(49,132,168,.17);background:linear-gradient(90deg,rgba(255,255,255,.4),rgba(219,244,250,.25))}.panel-title h2{color:#1b4059}.panel-title span,.panel-title small{color:#008aa8}.panel-title button,#refresh{border-color:rgba(35,135,178,.25);background:rgba(255,255,255,.7);color:#246179;box-shadow:0 3px 10px rgba(33,101,135,.08)}
.risk-item{border-bottom-color:rgba(52,132,166,.15)}.risk-item b{color:#c9780b}.risk-item p{color:#486c7f}.risk-item small{color:#7b98a7}
.top-label,.status-label{color:#31566b}.bar{background:#d7e8ef}.bar i{background:linear-gradient(90deg,#16c3cc,#438cff)}.status-row .bar i{background:linear-gradient(90deg,#27c684,#63d8a7)}
.map-panel{background:#dceef5;border-color:rgba(49,134,171,.34);box-shadow:0 12px 34px rgba(40,107,137,.14)}
.map-panel .overlay{background:rgba(248,253,255,.78);border-color:rgba(47,137,177,.28);box-shadow:0 8px 24px rgba(28,90,119,.13);backdrop-filter:blur(18px) saturate(1.25)}.map-panel .overlay h2{color:#193f58}.map-panel .overlay small{color:#0c91ae}
.map-panel #map{background:#dceef4}.leaflet-tile{filter:brightness(1.04) saturate(.86) contrast(.96)}.leaflet-control-zoom a{background:rgba(255,255,255,.9)!important;color:#275b72!important;border-color:#bfd7e2!important}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:rgba(255,255,255,.95);color:#21475e}.leaflet-popup-content button{background:#edf9fc;color:#17627b;border-color:#65bdd1}
.legend{background:rgba(250,254,255,.84);border-color:rgba(47,137,177,.25);color:#31596e;box-shadow:0 5px 18px rgba(31,95,125,.12);backdrop-filter:blur(14px)}
.camera-stage{border-color:rgba(46,144,180,.65);box-shadow:0 12px 32px rgba(15,63,85,.28)}
.camera-panel,.iot-panel,.weather-panel,.trend-panel,.status-panel,.latest-panel{background:linear-gradient(155deg,rgba(255,255,255,.88),rgba(235,248,252,.76))}
.camera-card{border-color:rgba(49,133,169,.28);background:rgba(236,248,252,.88);color:#183e56;box-shadow:0 3px 10px rgba(38,102,132,.07)}.camera-card.active{border-color:#15b6c9;box-shadow:0 0 0 1px rgba(21,182,201,.24),0 6px 16px rgba(25,128,155,.12)}.camera-card b{color:#173e57}.camera-card small{color:#638699}.camera-card .state{background:rgba(246,253,255,.88);color:#128d5d}.camera-card.demo .state{color:#c9780b}
.iot-icon{background:linear-gradient(145deg,#e8faff,#d8eff8);border-color:rgba(36,141,178,.3);color:#0498b3}.iot-device b{color:#244a60}.iot-device small{color:#6b8a9a}.iot-device strong{background:#dff5eb;color:#138b59}.iot-device.tilt strong{background:#ffe5e7;color:#d83d4b}.iot-device.tilt .iot-icon{background:#fff0f1}
.weather-now{color:#446b7f}.weather-now strong{color:#126b8b}.weather-now span{color:#6a8b9d}.forecast-day{border-color:rgba(43,132,169,.18);background:rgba(255,255,255,.65)}.forecast-day b{color:#577c90}.forecast-day small{color:#315c72}.weather-credit{color:#84a2b0}
.trend-svg text{fill:#67899b}.trend-svg polyline{filter:drop-shadow(0 2px 3px rgba(20,169,192,.25))}.latest-item{border-bottom-color:rgba(50,130,164,.14)}.latest-item:hover{background:rgba(213,241,248,.55)}.latest-item b{color:#24516a}.latest-item span{color:#c6750a}.latest-item p{color:#66889a}
.ai-launcher{border-color:rgba(255,255,255,.8);background:linear-gradient(135deg,rgba(20,167,196,.94),rgba(46,112,235,.94));box-shadow:0 10px 28px rgba(36,104,173,.28);color:#fff}.ai-launcher b{background:rgba(255,255,255,.2)}
.ai-panel{background:rgba(248,253,255,.94);border-color:rgba(40,136,179,.35);box-shadow:0 18px 58px rgba(28,83,113,.25);backdrop-filter:blur(24px);color:#24475c}.ai-panel header{border-bottom-color:rgba(42,128,165,.2)}.ai-panel header small{color:#708e9f}.ai-panel header button{color:#315b70}.suggestions button{border-color:#badbe7;background:#eef9fc;color:#22708a}.ai-messages div{background:#e7f3f8;color:#294d61}.ai-messages .user{background:#d6eef7;color:#17516a}.ai-panel form{border-top-color:rgba(42,128,165,.2)}.ai-panel input{border-color:#bedce7;background:#fff;color:#264c61}.ai-panel form button{background:linear-gradient(135deg,#19bacb,#397df1);color:#fff}
@media(max-width:720px){.topbar{background:rgba(248,253,255,.92)}}