@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+TC:wght@400;500;600;700;800&display=swap');

:root{font-family:'DM Sans','Noto Sans TC',sans-serif;color:#152b40;background:#f4f7fa;font-synthesis:none;text-rendering:optimizeLegibility;--ink:#152b40;--muted:#718195;--line:#e3e9ef;--navy:#10243a;--teal:#168b86;--red:#df594f;--blue:#3987c6;--amber:#ca8a35;--card:#fff}
*{box-sizing:border-box}
body{margin:0;min-width:320px;background:#f4f7fa}
.topbar{height:62px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 34px;box-shadow:0 3px 14px #10243a1a}
.brand{color:inherit;text-decoration:none;display:flex;align-items:center;gap:11px;font-size:14px;font-weight:650;letter-spacing:.02em}
.brand-mark{display:grid;place-items:center;width:33px;height:33px;border-radius:10px;background:#17a49a;color:#fff;font-size:10px;font-weight:800;letter-spacing:.04em}
.live-indicator{font-size:11px;color:#c7d5df;display:flex;align-items:center;gap:8px}.live-indicator i{width:7px;height:7px;border-radius:50%;background:#52d2ac;box-shadow:0 0 0 3px #52d2ac25}
.page-shell{display:grid;grid-template-columns:275px minmax(0,1fr);max-width:1600px;margin:0 auto;min-height:calc(100vh - 62px)}
.sidebar{background:#fff;border-right:1px solid var(--line);padding:28px 22px 24px;align-self:stretch}
.sidebar-heading{margin-bottom:23px}.sidebar-heading h2{font-size:17px;margin:7px 0 5px}.sidebar-heading p{font-size:11px;color:var(--muted);line-height:1.65;margin:0}.sidebar-heading.compact{margin:0 0 20px}
.eyebrow{display:block;color:#8190a0;font-size:9px;font-weight:750;letter-spacing:.14em;line-height:1.5}
.field-label{font-size:11px;font-weight:650;color:#394e62;display:block;margin:0 0 8px}.field-row{display:flex;justify-content:space-between;align-items:center;margin-top:17px}.text-button{font:inherit;font-size:10px;color:var(--teal);border:0;background:none;cursor:pointer;padding:4px 0}
.control{width:100%;height:38px;border:1px solid #dce4eb;border-radius:7px;background:#fff;color:var(--ink);padding:0 10px;font:inherit;font-size:11px;outline:none}.control:focus{border-color:#52aaa2;box-shadow:0 0 0 3px #168b861a}.search{margin-top:1px}
.hospital-options{margin-top:7px;max-height:170px;overflow:auto;border:1px solid var(--line);border-radius:7px;padding:5px 8px}.hospital-option{display:flex;gap:7px;align-items:flex-start;padding:6px 0;color:#465a6e;font-size:10px;line-height:1.45;cursor:pointer}.hospital-option input{margin:1px 0 0;accent-color:var(--teal)}
.sidebar-divider{height:1px;background:var(--line);margin:22px 0}.slider-label{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#43566a;margin:16px 0 8px}.slider-label output{color:#188a84;font-weight:700;font-variant-numeric:tabular-nums}.range{width:100%;height:4px;margin:0;accent-color:var(--teal);cursor:pointer}.method-note{display:flex;gap:8px;margin-top:20px;padding:10px;background:#f1f8f7;border-radius:7px;color:#278780}.method-note span{font-size:13px}.method-note p{margin:0;color:#657b80;font-size:9px;line-height:1.6}
.content{padding:32px clamp(20px,3.2vw,48px) 24px;min-width:0}.page-title{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:29px}.page-title h1{font-size:25px;letter-spacing:-.03em;margin:7px 0 5px}.page-title p{color:var(--muted);font-size:11px;margin:0}.data-meta{display:grid;justify-items:end;gap:7px}.data-meta-details{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px 12px;color:#8291a0;font-size:9px}.data-meta-details a{color:#3987c6;text-decoration:none}.data-meta-details a:hover{text-decoration:underline}.reload-button{font:inherit;color:#168b86;background:#fff;border:1px solid #dce8e6;border-radius:5px;padding:4px 8px;cursor:pointer}.reload-button:disabled{opacity:.55;cursor:wait}.data-status{font-size:10px;color:#8291a0}.data-status.error{color:#c64a45}.data-status.ready{color:#168b86}
.section-heading,.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-heading{margin-bottom:12px}.section-heading h2,.panel-heading h2{font-size:15px;margin:3px 0 0}.muted{font-size:10px;color:var(--muted)}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:19px}.kpi-card{min-height:116px;padding:15px 16px 12px;background:var(--card);border:1px solid #e7ecf1;border-radius:10px;box-shadow:0 2px 7px #17324d05;display:grid;grid-template-columns:30px 1fr;grid-template-rows:24px 38px 17px;align-items:center;column-gap:9px}.kpi-icon{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-size:16px;font-weight:700}.kpi-icon.teal{background:#e5f4f1;color:#148b84}.kpi-icon.red{background:#fff0ed;color:#d6574b}.kpi-icon.blue{background:#eaf3fa;color:#3987c6}.kpi-icon.amber{background:#fbf3e6;color:#c58b3d}.kpi-label{font-size:10px;color:#718195}.kpi-card strong{grid-column:1/3;font-size:26px;letter-spacing:-.04em;font-weight:700;font-variant-numeric:tabular-nums}.kpi-footnote{grid-column:1/3;font-size:9px;color:#8a98a7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.panel{background:var(--card);border:1px solid #e5ebf0;border-radius:10px;box-shadow:0 2px 7px #17324d05}.map-panel{padding:16px 18px 10px;margin-bottom:14px}.panel-heading{margin-bottom:13px}.map-legend{display:flex;gap:13px;flex-wrap:wrap;color:#718195;font-size:9px}.map-legend span{display:flex;align-items:center;gap:5px}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.legend-dot.hot{background:var(--red)}.legend-dot.cold{background:var(--blue)}.legend-dot.normal{background:#8291a0}.legend-dot.hospital{background:#c44540}
#map{height:470px;width:100%;border-radius:7px;background:#e9eff1;z-index:1}.map-caption{margin:8px 0 0;font-size:9px;color:#8493a1}.leaflet-popup-content{font-family:'Noto Sans TC',sans-serif;font-size:11px;line-height:1.7}.leaflet-popup-content b{font-weight:700;color:#21394f}
.hospital-marker{border:0!important;border-radius:50%;background:#c44540;color:#fff;font-size:14px;font-weight:800;line-height:24px;text-align:center;box-shadow:0 1px 5px #19324755}
.chart-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:14px;margin-bottom:14px}.chart-panel{padding:16px 18px;min-height:210px}.donut-layout{display:flex;gap:23px;align-items:center;min-height:130px;padding:0 5px}.donut{width:126px;height:126px;flex:0 0 126px;border-radius:50%;background:conic-gradient(#e8edf1 0deg 360deg);position:relative}.donut-hole{position:absolute;inset:25px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column}.donut-hole strong{font-size:21px;line-height:1.15}.donut-hole span{font-size:9px;color:var(--muted)}.chart-legend{display:grid;gap:10px;font-size:10px;color:#5c6e80}.chart-legend div{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:7px}.chart-legend i{width:8px;height:8px;border-radius:2px}.chart-legend small{font-size:9px;color:#8291a0}.hospital-chart{display:grid;gap:10px;padding:1px 3px 0;max-height:148px;overflow:auto}.bar-row{display:grid;grid-template-columns:minmax(100px,1fr) minmax(100px,2.4fr) 31px;align-items:center;gap:9px;font-size:9px;color:#586b7e}.bar-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-stack{display:flex;height:10px;border-radius:5px;overflow:hidden;background:#edf1f4}.bar-stack span{height:100%;min-width:0}.bar-total{text-align:right;font-variant-numeric:tabular-nums;color:#8593a0}
.insights-panel{padding:17px 19px;margin-bottom:14px}.insight-body{font-size:10px;line-height:1.8;color:#53677a}.insight-callouts{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:2px 0 18px}.callout{padding:10px 12px;border-radius:7px;background:#f7f9fb;border-left:3px solid #8ca0b2}.callout.hot{border-color:var(--red);background:#fff8f6}.callout.cold{border-color:var(--blue);background:#f5faff}.callout.average{border-color:var(--teal);background:#f3faf8}.callout strong{display:block;color:#263c50;font-size:10px;margin-bottom:3px}.callout span{color:#6e8091;font-size:9px}.insight-body h3{font-size:12px;color:#243a4f;margin:15px 0 5px}.insight-body p{margin:5px 0 9px}.insight-body ol{padding-left:19px;margin:5px 0}.insight-body li{padding-left:3px;margin:4px 0}.insight-body .muted-note{color:#8b98a6}
.table-panel{margin-bottom:14px;overflow:hidden}.table-panel summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;cursor:pointer}.table-panel summary::-webkit-details-marker{display:none}.table-panel summary:after{content:'⌄';font-size:16px;color:#8594a2;margin-left:12px}.table-panel[open] summary:after{content:'⌃'}.table-panel summary>span:first-child{display:grid;gap:3px}.table-panel summary strong{font-size:12px}.summary-count{margin-left:auto;font-size:9px;color:#8493a1}.table-wrap{max-height:440px;overflow:auto;border-top:1px solid var(--line)}table{width:100%;border-collapse:collapse;font-size:9px;white-space:nowrap}th,td{padding:9px 12px;text-align:left;border-bottom:1px solid #edf1f4}th{position:sticky;top:0;background:#f8fafb;color:#66798b;font-weight:650}td{color:#52667a}.numeric{text-align:right}.zone-hot{color:#c84d43;font-weight:650}.zone-cold{color:#317bb1;font-weight:650}.table-footer{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;color:#8493a1;font-size:9px}.page-button{font:inherit;background:#fff;border:1px solid var(--line);border-radius:5px;color:#52667a;padding:6px 9px;margin-left:5px;cursor:pointer}.page-button:disabled{opacity:.45;cursor:default}
.empty-state{padding:25px 10px;text-align:center;color:#8493a1;font-size:11px}.footer{text-align:center;padding:5px 0 8px;font-size:9px;color:#97a3af}
@media(max-width:1100px){.page-shell{grid-template-columns:245px minmax(0,1fr)}.sidebar{padding-left:17px;padding-right:17px}.content{padding-left:24px;padding-right:24px}.map-legend{gap:8px}}
@media(max-width:820px){.page-shell{display:block}.sidebar{border-right:0;border-bottom:1px solid var(--line);padding:18px 20px;display:grid;grid-template-columns:1fr 1fr;column-gap:15px;align-items:start}.sidebar-heading,.sidebar-divider,.sidebar-heading.compact,.method-note{grid-column:1/-1}.sidebar-heading{margin-bottom:10px}.sidebar-heading.compact{margin-bottom:5px}.sidebar-divider{margin:8px 0}.hospital-options{max-height:95px}.field-row{margin-top:0}.sidebar .search,.sidebar .hospital-options{grid-column:1/-1}.content{padding:24px 20px}.map-legend{max-width:260px;justify-content:flex-end}}
@media(max-width:600px){.topbar{height:54px;padding:0 15px}.live-indicator{font-size:9px}.page-title{align-items:flex-start;gap:10px;flex-direction:column;margin-bottom:21px}.data-meta{justify-items:start}.data-meta-details{justify-content:flex-start}.page-title h1{font-size:21px}.page-shell{min-height:calc(100vh - 54px)}.content{padding:20px 13px}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.kpi-card{min-height:104px;padding:11px 12px}.chart-grid{grid-template-columns:1fr;gap:9px}.chart-panel{min-height:190px}.panel-heading{align-items:flex-start;flex-direction:column}.map-legend{justify-content:flex-start;max-width:none}.map-panel{padding:13px 12px 9px}#map{height:390px}.donut-layout{justify-content:center}.hospital-chart{max-height:185px}.insight-callouts{grid-template-columns:1fr}.insights-panel{padding:14px}.sidebar{padding:15px 13px}.bar-row{grid-template-columns:minmax(90px,1fr) minmax(85px,2fr) 28px;gap:6px}}
