:root{--bg:#f3f6fa;--ink:#183047;--muted:#7c8b9b;--blue:#2469ef;--line:#e8edf3;--green:#13b58a}*{box-sizing:border-box}body{margin:0;background:var(--bg);font:14px -apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer;background:white;border:1px solid #dce4ed;border-radius:7px;padding:9px 14px;color:#51647a}button:hover{border-color:var(--blue);color:var(--blue)}button.primary{background:var(--blue);color:white;border-color:var(--blue)}aside{position:fixed;width:222px;background:#101f33;color:#a2b2c7;height:100vh;display:flex;flex-direction:column;z-index:10}.brand{display:flex;gap:12px;color:white;padding:27px 23px;font-size:21px}.brand b{color:#6a9cff;font-size:35px}.brand small{font-size:9px;letter-spacing:1px;display:block;margin-top:6px}.park{margin:0 16px 15px;padding:14px;background:#1c2e45;border-radius:9px;color:#e0e9f6}.park small{display:block;margin-top:7px;color:#8295ae;font-size:11px}nav{overflow:auto;padding:0 12px;flex:1}nav label{font-size:10px;letter-spacing:2px;color:#60758e;display:block;padding:16px 14px 8px}nav button{display:flex;align-items:center;gap:12px;width:100%;color:#9db0c8;background:none;border:0;padding:11px 14px;margin:3px 0;text-align:left}nav button.active{background:#245fd7;color:white}nav button:hover{background:#203952;color:white}nav button span{font-size:17px;width:22px}.sidefoot{padding:18px;font-size:11px;border-top:1px solid #24344a}.sidefoot small{display:block;color:#647992;margin-top:10px}i{display:inline-block;width:6px;height:6px;background:var(--green);border-radius:50%;margin-right:7px}.shell{margin-left:222px}header{height:70px;display:flex;justify-content:space-between;align-items:center;padding:0 30px;background:white;border-bottom:1px solid var(--line);font-size:12px;color:#8290a2}header>div{display:flex;align-items:center;gap:18px}.demo{color:#a77724;background:#fff7e7;border:1px solid #ffe8ba;padding:5px 9px;border-radius:5px}.avatar{background:#eaf0ff;padding:8px;border-radius:50%;color:#3b6ac7}main{padding:27px 30px;min-height:calc(100vh - 110px)}h1{font-size:25px;margin:0 0 9px;font-weight:650;letter-spacing:.5px}h2{font-size:15px;margin:0;font-weight:600}p{color:#7b8b9d;line-height:1.8;margin:5px 0}.title{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px}.actions{display:flex;gap:8px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.card{background:white;border:1px solid var(--line);border-radius:10px;padding:21px;box-shadow:0 3px 12px #15315303}.metric .label{color:#788b9d;font-size:12px}.metric strong{display:inline-block;font-size:29px;font-weight:650;margin:13px 0 10px;letter-spacing:-1px}.metric em{font-size:12px;font-style:normal;color:#9caabc;margin-left:6px}.metric .trend{color:var(--green);font-size:11px}.metric .icon{float:right;color:var(--blue);padding:8px;background:#edf3ff;border-radius:7px}.grid{display:grid;grid-template-columns:1.65fr 1fr;gap:20px;margin-bottom:20px}.grid.equal{grid-template-columns:1fr 1fr}.panelhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.tag{font-size:10px;border-radius:5px;background:#e9f8f2;color:#16a078;padding:5px 8px}.tag.warn{background:#fff4df;color:#c58a29}.tag.red{background:#fff0f0;color:#dd6969}.sub{font-size:11px;color:#9babbc}.map{height:325px;border-radius:8px;position:relative;overflow:hidden;background:radial-gradient(ellipse at center,#224259,#122d40);color:white}.map:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#86abc810 1px,transparent 1px),linear-gradient(90deg,#86abc810 1px,transparent 1px);background-size:30px 30px;transform:rotate(-24deg) scale(1.5)}.map svg{width:100%;height:100%}.map text{font-family:inherit}.map button{position:absolute;bottom:14px;right:15px;background:#173348;color:#bfd5e8;border-color:#3b5b73;font-size:11px}.map .legend{position:absolute;top:15px;left:16px;color:#9cb9ce;font-size:10px}.building{cursor:pointer;transition:filter .2s}.building:hover{filter:brightness(1.5)}.chart{width:100%;height:210px;overflow:visible}.chart text{fill:#a0adbb;font:10px sans-serif}.legendline{display:flex;gap:20px;font-size:11px;color:#8b9aab}.legendline b{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px;background:#3a81f7}.rows{display:grid;gap:0}.row{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);gap:12px}.row:last-child{border:0}.row small{display:block;color:#9aabba;font-size:10px;margin-top:6px}.row strong{font-size:13px}.row .right{text-align:right}.bar{height:6px;background:#edf2f8;border-radius:5px;margin-top:10px;overflow:hidden}.bar span{display:block;height:100%;background:#4182ed;border-radius:5px}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tile{cursor:pointer}.tile:hover{border-color:#91b3f2;transform:translateY(-2px)}.tile .symbol{font-size:26px;color:#3b7be9;margin-bottom:15px}.tile h2{margin-bottom:9px}.tile p{font-size:12px}.tile .bottom{margin-top:20px;display:flex;justify-content:space-between}.tabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}.tabs button.selected{color:#2469ef;background:#e9f1ff;border-color:#a9c4ff}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;background:#f7f9fc;color:#8998aa;font-weight:500;padding:13px}td{padding:15px 12px;border-bottom:1px solid var(--line)}td button{font-size:11px;padding:5px 9px}.controls{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.controls input{accent-color:var(--blue)}.flow{display:flex;gap:12px;align-items:stretch;margin:25px 0}.flow>div{flex:1;background:#f2f6fd;padding:22px 15px;border:1px solid #e0e9f7;border-radius:9px;position:relative}.flow>div:not(:last-child):after{content:'→';position:absolute;right:-17px;top:42%;color:var(--blue);z-index:2}.flow small{color:#98a6b9}.flow h3{font-size:14px}.flow p{font-size:12px}.timeline{display:grid;gap:12px}.timeline>div{padding:15px 18px;background:#f5f8fc;border-left:3px solid #4b88f4;border-radius:5px}.timeline small{color:#8b9bb0;margin-right:12px}.chat{background:#f4f7fd;padding:20px;border-radius:9px;margin:17px 0;line-height:1.9}.chatinput{display:flex;gap:10px}.chatinput input{flex:1;border:1px solid #dce5f1;border-radius:7px;padding:13px}.phone{width:285px;margin:15px auto;border:9px solid #172638;border-radius:35px;background:#f2f6fc;padding:20px 14px;box-shadow:0 14px 35px #213b5720}.phone .card{padding:14px;margin-top:12px}.phone h2{font-size:17px}.phone button{width:100%;margin-top:10px}.ring{width:126px;height:126px;border-radius:50%;background:conic-gradient(#397bef 0 45%,#19b997 45% 68%,#89adf3 68% 86%,#e9eff8 86%);display:grid;place-items:center;margin:auto}.ring>div{width:91px;height:91px;background:white;border-radius:50%;display:grid;place-content:center;text-align:center}.ring strong{font-size:23px}.ring small{font-size:10px;color:#98a6b5}.modal{display:none;position:fixed;inset:0;background:#10233b65;backdrop-filter:blur(4px);z-index:30;align-items:center;justify-content:center}.modal.open{display:flex}.dialog{background:white;padding:28px;border-radius:14px;width:min(720px,90vw);max-height:85vh;overflow:auto}.dialog .close{float:right}.dialog h2{font-size:20px;margin-bottom:14px}#toast{position:fixed;bottom:35px;left:50%;background:#14314b;color:white;border-radius:8px;padding:14px 23px;opacity:0;z-index:50;pointer-events:none;transition:opacity .2s}footer{padding:15px 30px;color:#9eaaba;font-size:10px;border-top:1px solid #e6ecf3}footer span{float:right}.coverage{font-size:11px;color:#8e9faf;margin-top:14px}.screen{background:#0d2138;color:#e7effc}.screen .card{background:#132c46;border-color:#23415b}.screen p,.screen .label{color:#9bb2c9}.screen td{border-color:#23415b}.screen .shell{margin-left:0}.screen aside,.screen header{display:none}.screen main{min-height:100vh}.screen footer{display:none}@media(max-width:1100px){aside{width:185px}.shell{margin-left:185px}main{padding:20px}.grid{grid-template-columns:1fr}.tiles{grid-template-columns:repeat(2,1fr)}.metric strong{font-size:23px}.kpis{gap:10px}.title{gap:15px}}@media(max-width:700px){aside{position:relative;width:100%;height:auto}.brand{padding:15px}.park,.sidefoot,nav label{display:none}nav{display:flex;overflow:auto;flex:none}nav button{white-space:nowrap;width:auto}.shell{margin:0}header{padding:10px;height:auto}#clock,.avatar{display:none}.kpis,.tiles,.grid.equal{grid-template-columns:1fr 1fr}.title{align-items:flex-start;flex-direction:column}.flow{flex-direction:column}.flow>div:after{display:none}table{min-width:650px}.card{overflow:auto}.grid{gap:12px}main{padding:15px}.actions{flex-wrap:wrap}}
