:root{color-scheme:dark;--text:#e8f1f3;--muted:#91a9b6;--mint:#7ae4cf;--cyan:#86d9e7;--orange:#f2b785;--line:rgba(170,216,224,.10);--surface:linear-gradient(140deg,rgba(31,53,67,.79),rgba(19,32,49,.87))}*{box-sizing:border-box}body{margin:0;color:var(--text);font:14px/1.5 "PingFang SC","Microsoft YaHei",sans-serif;background:#0a1525;background-image:radial-gradient(ellipse at 9% 0%,#24575f88 0,transparent 42%),radial-gradient(ellipse at 94% 72%,#38416e77 0,transparent 48%),radial-gradient(ellipse at 52% 38%,#1b555f55 0,transparent 48%),linear-gradient(120deg,#122734,#101c30 60%,#172238);background-attachment:fixed}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(#c1e8e50b .7px,transparent .7px);background-size:5px 5px;z-index:-1}.dashboard{max-width:2400px;margin:auto;padding:0 30px}header{min-height:102px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;border-bottom:1px solid var(--line);margin-bottom:24px}.brand{display:flex;gap:12px;align-items:center;font-size:17px;font-weight:600;letter-spacing:1px;color:#d6e9eb}.brand-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:linear-gradient(145deg,#8cecd8,#4b9aab);color:#133c46;font-size:28px;box-shadow:0 4px 22px #64d5c41c}.brand small{font:9px/2 Arial;letter-spacing:2.5px;color:#84aab5;display:block}.title{text-align:center}h1{margin:0;font-size:27px;letter-spacing:4px;font-weight:600;line-height:1.4}.title p{margin:8px 0 0;color:#87a6b5;font-size:12px;letter-spacing:2px}.header-right{justify-self:end;display:flex;align-items:center;gap:16px}time{font:12px/1.8 Arial;white-space:pre-line;text-align:right;font-variant-numeric:tabular-nums;color:#a6bbc7}.demo{padding:4px 10px;border:1px solid #a7c7d121;border-radius:20px;font-size:11px;color:#a4bdc8;background:#c0e1ec05;white-space:nowrap}button{border:1px solid #a0d7db24;color:#b4d2da;background:#bcf8f708;border-radius:8px;font:12px/1.5 inherit;padding:8px 12px;cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s}button:hover{background:#b9faf218;border-color:#96e8dd55;color:#d9fff6}button:focus-visible{outline:2px solid var(--mint);outline-offset:4px}#fullscreen{font-size:20px;line-height:1;padding:8px}main{display:grid;grid-template-columns:minmax(300px,1fr) minmax(0,2.3fr) minmax(310px,1fr);gap:22px;align-items:start;margin-bottom:24px}.surface,.alerts,.ranking,.trend-panel{background:var(--surface);border:1px solid #bfdfe91a;border-radius:16px;box-shadow:0 12px 32px #040c1c18,inset 0 1px 0 #e3ffff05;backdrop-filter:blur(14px)}.left-col{min-width:0;overflow:hidden;padding:0 20px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 0 18px;border-bottom:1px solid var(--line)}.section-heading h2{font-size:16px;margin:4px 0 0;font-weight:500;letter-spacing:1px}.eyebrow{font:9px/1.4 Arial;letter-spacing:2.2px;color:#86a4b3}.section-badge{font-size:11px;color:#b1cdc8;padding:3px 8px;border-radius:5px;background:#83d5c30d;border:1px solid #94d6c917}.panel{min-width:0}.panel-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:15px;min-height:22px}.panel-title h2,.map-heading h2{font-size:14px;line-height:1.5;font-weight:500;margin:0;color:#d0e1e8;letter-spacing:.5px}.panel-title h2{display:flex;align-items:center;gap:9px}.panel-title i{font-style:normal;color:#8acac5;display:flex;align-items:center;justify-content:center}.panel-title svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.panel-title>span{font-size:11px;color:#7c99a9}.left-col>.panel,.side-health>.panel{padding:20px 0;border-bottom:1px solid var(--line)}.side-health{display:block}.side-health>.panel:last-child{border-bottom:0}.left-col .panel-title>span,.secondary-health .panel-title>span{display:none}.pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}.pair label,label{display:block;color:#88a2b1;font-size:12px;line-height:1.5}label small{font-size:10px;color:#7a96a7;white-space:nowrap}.pair strong{display:block;margin-top:7px;font:29px/1.15 Arial;letter-spacing:-.7px;font-variant-numeric:tabular-nums}.cyan{color:var(--cyan)}.orange{color:var(--orange)}.heartbeat-total{margin:17px 0 10px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px 12px;padding:12px;border-radius:8px;background:linear-gradient(100deg,#91dcc30d,#79cfe804);border:1px solid #a3e6df0c}.heartbeat-total>span{font-size:12px;color:#9ebac2;white-space:nowrap}.heartbeat-total>div{display:flex;align-items:baseline;gap:6px;white-space:nowrap}.heartbeat-total b{font:24px/1.2 Arial;color:#a6e9dd;font-variant-numeric:tabular-nums;letter-spacing:-.5px}.heartbeat-total small{font-size:11px;color:#8ba7b7}.ecg{display:block;width:100%;height:31px}.ecg path{fill:none;stroke:#77ccb9;stroke-width:1.4;stroke-dasharray:700;animation:ecg 6s linear infinite}.axis{display:flex;justify-content:space-between;gap:8px;color:#688696;font:10px/1.5 Arial;margin-top:6px}.oxygen-body{display:grid;grid-template-columns:114px minmax(0,1fr);gap:25px;align-items:center}.gauge{width:108px;height:108px;border-radius:50%;padding:5px;background:conic-gradient(from 220deg,#a5e5d7,#7faabf 82%,#a5e5d710 82%);position:relative}.gauge>div{width:100%;height:100%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#1b303e}.gauge b{font:32px/1.2 Arial;color:#c8f4e9;letter-spacing:-1px}.gauge small{font-size:15px;letter-spacing:0}.gauge span{font-size:11px;color:#87a6b1}.oxygen-body p{margin:4px 0 13px;color:#9bb5c3;font-size:11px}.oxygen-body p:last-child{margin-bottom:0}.oxygen-body strong{font:23px/1.2 Arial;color:#d8e8ed}.oxygen-body .orange strong{color:var(--orange)}.subline{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;color:#8ba7b3;margin-top:15px}.subline b{font-weight:400;color:#9bd5c7}.health-card .panel-title{margin-bottom:12px}.health-card-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(108px,.9fr);gap:16px;align-items:center}.health-primary{min-width:0;display:flex;flex-direction:column;gap:8px}.metric{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 7px}.metric b{font:33px/1.15 Arial!important;color:#e5eff1!important;letter-spacing:-1px;font-variant-numeric:tabular-nums}.metric>span{font-size:11px;color:#8ba7b3;white-space:nowrap}.metric-label{font-size:11px;color:#85a1b0;line-height:1.5}.health-side-stats{border-left:1px solid var(--line);padding-left:16px;display:grid;gap:10px;min-width:0}.stat-label{font-size:11px;line-height:1.4;color:#83a0b0;display:block}.stat-value{margin-top:3px;display:flex;gap:5px;align-items:baseline;flex-wrap:wrap;color:#c9dfe7}.stat-value b{font:19px/1.2 Arial;font-variant-numeric:tabular-nums;letter-spacing:-.3px}.stat-value small{font-size:10px;color:#8da7b6;white-space:nowrap}.stat-value.orange{color:#eac299}.right-col{min-width:0;display:flex;flex-direction:column;gap:16px}.secondary-health{padding:0 20px}.secondary-health .section-heading{padding:17px 0 15px}.secondary-health .health-card{padding:15px 0}.map-section{display:flex;flex-direction:column;gap:18px;min-width:0;align-self:stretch}.overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0;padding:22px 0;background:linear-gradient(135deg,#466f7a21,#25345144);border:1px solid #b9e5ee14;border-radius:14px;box-shadow:inset 0 1px 0 #baf7ec08}.overview-item{padding:0 16px;border-right:1px solid var(--line);min-width:0}.overview-item:last-child{border:0}.overview-icon{display:none}.overview-item label{font-size:12px;color:#9bb4c0;white-space:nowrap}.overview-item strong{display:inline-block;font:clamp(24px,1.85vw,36px)/1.15 Arial;letter-spacing:-1px;color:#e4f7f5;margin-top:11px;font-variant-numeric:tabular-nums}.overview-item small{font-size:10px;color:#8daab9;margin-left:5px}.overview-item .note{margin-top:9px;color:#7faf9f;font-size:10px;line-height:1.4}.map-shell{position:relative;display:flex;flex-direction:column;flex:1;min-height:510px;border-radius:18px;background:radial-gradient(ellipse at 50% 46%,#326e7229,transparent 70%),linear-gradient(160deg,#3869760b,#3c518a0c);border:1px solid #acd4df0c;padding:20px 18px 17px;overflow:hidden}.map-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;position:relative;z-index:1}.map-heading h2{font-size:17px;color:#dcebee;letter-spacing:1px}.map-heading p{font-size:11px;color:#7f9da9;margin:6px 0 0}.live-dot{display:inline-block;width:5px;height:5px;background:#92dec1;border-radius:50%;vertical-align:middle;margin-right:6px;box-shadow:0 0 8px #91dbc22e}.map-heading button{font-size:11px;padding:7px 10px;color:#8eaeb9}.map-heading button span{margin-left:12px;color:#b2d8d3}.map-stage{position:relative;flex:1;min-height:340px;margin:8px -8px 0}#map{position:absolute;inset:0;width:100%;height:100%}.map-watermark{position:absolute;left:12px;top:16px;color:#60828f;font:9px/1.5 Arial;letter-spacing:1.5px;pointer-events:none}.map-toast{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 20px);background:#17303ed9;border:1px solid #82baa927;border-radius:30px;padding:7px 14px;color:#9bbabf;font-size:11px;text-align:center;pointer-events:none;backdrop-filter:blur(8px)}.map-tip{display:none;position:absolute;pointer-events:none;padding:10px 14px;background:#152b3cf5;border:1px solid #719d9d66;border-radius:8px;font-size:12px;z-index:4;line-height:1.8;box-shadow:0 8px 30px #0004}.map-legend{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;padding:16px 0;color:#7f9aa9;font-size:10px}.gradient{width:60px;height:4px;background:linear-gradient(90deg,#346777,#b5f8de);border-radius:4px}.pulse-key{width:6px;height:6px;border:1px solid #8dcec8;border-radius:50%;margin-left:14px}.map-bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);padding-top:16px}.map-bottom>div{text-align:center;padding:0 6px;border-right:1px solid var(--line)}.map-bottom>div:last-child{border:0}.map-bottom span{font-size:11px;color:#90acb7;display:block}.map-bottom b{display:block;font:25px/1.2 Arial;color:#c5e3e2;margin-top:7px;font-variant-numeric:tabular-nums}.map-bottom small{font:10px sans-serif;color:#809dab;margin-left:3px}.trend-panel{padding:17px 20px;position:relative}.trend-panel .panel-title{margin:0 0 10px}.chart-legend{display:flex;gap:16px;justify-content:flex-end;font-size:10px;color:#89a5b4;margin-bottom:5px}.chart-legend span:before{content:"";display:inline-block;width:12px;height:3px;background:#7dcbbc;vertical-align:middle;margin-right:6px;border-radius:2px}.chart-legend span+span:before{background:#7197d1}#trend svg{width:100%;height:62px;display:block}.alerts,.ranking{padding:17px 20px}.alerts .panel-title,.ranking .panel-title{margin-bottom:13px}.warning-tag{font-size:10px!important;color:#c8a786!important;background:#d9a5710b;padding:3px 7px;border-radius:5px}.alert-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding-bottom:13px;border-bottom:1px solid var(--line)}.alert-summary>div{padding-left:2px}.alert-summary b{font:25px/1.2 Arial;display:block;color:#cbdde4}.alert-summary b.orange{color:#f1bc94}.alert-summary b.cyan{color:#9bd7c6}.alert-summary span{display:block;margin-top:5px;font-size:10px;color:#829cac}.alert-list{height:124px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#446779 transparent}.alert-item{padding:11px 0;border-bottom:1px solid var(--line);animation:fade .5s}.alert-item:last-child{border:0}.alert-item-top{display:flex;align-items:center;flex-wrap:wrap;gap:5px 8px;font-size:12px;color:#bacfd9}.alert-item-top time{font-size:10px;color:#6f8b9e;margin-left:auto;white-space:nowrap}.level{font-size:9px;background:#bc805416;color:#eeb784;padding:2px 5px;border-radius:4px}.level.low{color:#96b8bc;background:#99bcb710}.alert-item-top .city{font-size:10px;color:#7895a6}.alert-item p{font-size:11px;color:#9bb1c0;margin:6px 0 0;line-height:1.6}.alert-item p b{font-weight:400;color:#d9af8a;white-space:nowrap}.alert-foot{font-size:10px;color:#7797a4;margin-top:10px}.ranking .panel-title>span{font-size:10px}#ranking{display:grid;gap:11px}.rank-row{display:flex;align-items:center;gap:10px;font-size:11px;min-height:16px}.rank-num{font:10px Arial;color:#688498;flex:0 0 16px}.rank-row:nth-child(-n+3) .rank-num{color:#86c5b8}.rank-name{flex:0 0 38px;color:#aac0cc}.rank-track{flex:1;min-width:0;height:3px;background:#9db8c40e;border-radius:3px}.rank-track i{display:block;height:100%;background:linear-gradient(90deg,#4d8989,#8ed7bb);border-radius:3px;transition:width 1s}.rank-count{font:11px Arial;min-width:28px;color:#c0d7df;text-align:right}footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding:0 2px 20px;color:#668494;font-size:10px;line-height:1.5}footer em{font-style:normal;color:#3b5b6d;margin:0 8px}@keyframes ecg{0%{stroke-dashoffset:700}70%,100%{stroke-dashoffset:0}}@keyframes fade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1700px){.dashboard{padding:0 36px}main{grid-template-columns:352px minmax(0,1fr) 352px;gap:24px}.left-col{align-self:stretch;display:flex;flex-direction:column}.left-col>.panel{padding:24px 0}.left-col .side-health{flex:1;display:flex;flex-direction:column}.left-col .health-card{flex:1;display:flex;flex-direction:column;justify-content:center}.map-stage{min-height:365px}.overview{padding:23px 0}.overview-item{padding:0 24px}.overview-item label{font-size:13px}.overview-item .note{font-size:11px}.secondary-health .health-card{padding:16px 0}.map-shell{min-height:550px}}
@media(min-width:1180px) and (max-width:1599px){.dashboard{padding:0 20px}main{grid-template-columns:290px minmax(0,1fr) 290px;gap:16px}.left-col,.secondary-health{padding-left:16px;padding-right:16px}.overview{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px;padding:19px 0}.overview-item:nth-child(2){border:0}.overview-item strong{font-size:28px}.overview-item{padding:0 18px}.map-shell{padding:17px 13px}.map-heading h2{font-size:15px}.health-card-body{gap:12px;grid-template-columns:minmax(0,1fr) 110px}.health-side-stats{padding-left:12px}.metric b{font-size:29px!important}.brand{font-size:15px}.brand small{font-size:8px}.brand-icon{width:34px;height:34px}h1{font-size:23px;letter-spacing:2px}.header-right{gap:8px}.alerts,.ranking{padding:17px 16px}.map-legend{gap:5px}.pulse-key{margin-left:6px}.gradient{width:38px}}
@media(max-width:1179px){.dashboard{padding:0 20px}header{grid-template-columns:1fr auto;min-height:94px;margin-bottom:18px}.brand{display:none}.title{text-align:left}h1{font-size:24px;letter-spacing:2px}.title p{letter-spacing:1px}main{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.map-section{grid-column:1/-1;grid-row:1}.left-col{grid-column:1;grid-row:2}.right-col{grid-column:2;grid-row:2}.overview-item strong{font-size:30px}.map-stage{min-height:440px}.map-shell{min-height:640px}.left-col .health-card{padding:23px 0}}
@media(max-width:640px){.dashboard{padding:0 14px}header{gap:10px;min-height:90px}.title h1{font-size:18px;letter-spacing:1px}.title p{font-size:10px}.header-right time,.demo{display:none}main{display:flex;flex-direction:column;gap:18px}.left-col,.right-col,.map-section{width:100%}.map-section{order:-1;gap:14px}.overview{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px;padding:19px 0}.overview-item:nth-child(2){border:0}.overview-item{padding:0 20px}.overview-item strong{font-size:30px}.map-shell{padding:18px 12px;min-height:480px}.map-stage{min-height:290px}.map-heading{gap:10px}.map-heading h2{font-size:15px}.map-heading button{font-size:10px;padding:6px}.map-watermark{font-size:8px}.map-legend{font-size:9px;gap:5px}.gradient{width:35px}.pulse-key{margin-left:5px}.map-bottom b{font-size:23px}.map-bottom span{font-size:10px}.trend-panel{padding:16px}.left-col,.secondary-health{padding:0 18px}.left-col .health-card{padding:22px 0}.alerts,.ranking{padding:18px}.alert-list{height:180px}footer{font-size:9px}.health-card-body{grid-template-columns:minmax(0,1fr) minmax(108px,.9fr)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(min-width:1700px){.right-col{gap:14px}.secondary-health .section-heading{padding:12px 0 10px}.secondary-health .section-heading .eyebrow{font-size:8px}.secondary-health .section-heading h2{margin-top:2px}.secondary-health .health-card{padding:10px 0}.secondary-health .health-card .panel-title{margin-bottom:6px}.secondary-health .health-side-stats{gap:6px}.secondary-health .stat-label{line-height:1.35}.secondary-health .stat-value{margin-top:2px}.alerts{padding:12px 18px}.alerts .panel-title{margin-bottom:10px}.alert-list{height:95px}.alert-summary{padding-bottom:10px}.ranking{padding:10px 18px}.ranking .panel-title{margin-bottom:10px}#ranking{gap:7px}}
button{font-family:inherit;font-size:12px;line-height:1.5}
@media(min-width:1700px){header{min-height:90px;margin-bottom:20px}main{margin-bottom:16px}.right-col{gap:12px}footer{padding-bottom:12px}}

/* The map now occupies the former trend area. */
@media(min-width:1180px){.map-shell{min-height:720px}.map-stage{min-height:510px}}

/* Let the desktop dashboard fill the actual browser height instead of ending early. */
@media(min-width:1180px){
 .dashboard{min-height:100svh;display:flex;flex-direction:column}
 header,footer{flex:none}
 main{flex:1;align-items:stretch;min-height:0}
 .left-col{align-self:stretch;display:flex;flex-direction:column}
 .left-col .side-health{flex:1;display:flex;flex-direction:column}
 .left-col .health-card{flex:1;display:flex;flex-direction:column;justify-content:center}
 .right-col{height:auto;min-height:0;align-self:stretch}
 .right-col .secondary-health,.right-col .ranking{flex:none}
 .right-col .alerts{flex:1;display:flex;flex-direction:column;min-height:240px}
 .alerts .alert-list{flex:1;min-height:95px;height:0}
 .alerts .panel-title,.alerts .alert-summary,.alerts .alert-foot{flex:none}
 .map-section{min-height:0}.map-shell{flex:1;min-height:500px}.map-stage{min-height:300px}
 footer{margin-top:auto}
}
@media(min-width:1180px){.dashboard{height:100svh;min-height:1080px}main{flex:1 1 auto}.left-col>.panel{padding:20px 0}}

.title h1{line-height:1.5}.map-stage{background:radial-gradient(ellipse at 50% 45%,rgba(83,167,175,.045),transparent 70%)}
