/* Cleveland EMS v3: restrained civic-data visual system.
   Layered over styles.css so the original design remains a rollback option. */
:root {
  --bg: #f3f6fa;
  --ink: #17283d;
  --muted: #5d7086;
  --line: #e0e8f0;
  --blue: #177aa9;
  --accent: #16a3ab;
  --navy: #0c2335;
  --shadow: 0 9px 28px rgba(18,42,62,.045);
}
html { scroll-padding-top: 28px; }
body {
  background: radial-gradient(ellipse 56% 25% at 80% 0%,#e9f3f4 0%,transparent 76%),var(--bg);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
.shell { align-items: stretch; }
.sidebar {
  width: 236px;
  padding: 33px 18px 26px;
  background: linear-gradient(165deg,#102f42 0%,#0b2133 55%,#101f31 100%);
  border-right: 1px solid rgba(255,255,255,.08);
}
.brand { margin: 0 4px 70px;gap: 12px;line-height: 1.05; }
.brand-icon {background: linear-gradient(145deg,#26b7b6,#1984b9);box-shadow:0 5px 18px rgba(24,161,178,.23);border:1px solid rgba(255,255,255,.16);}
.brand-accent {color:#66ddd3;}
.nav-label {margin:0 13px 15px;color:#7796ab;}
.nav-link {border:1px solid transparent;transition:background .18s ease,color .18s ease;gap:12px;font-weight:600;}
.nav-link:hover {background:#1b4153;}
.nav-link.active {background:rgba(46,171,184,.14);border-color:rgba(72,195,200,.25);color:#e9fcff;}
.nav-link span {width:20px;text-align:center;color:#75b9c6;}
.sidebar-bottom {color:#d4e7ed;border-top-color:#294657;}
.sidebar-bottom p {color:#88a7b8;}
.main {max-width:1530px;padding:0 47px 44px;}
.topbar {height:72px;}
.breadcrumb {font-size:10px;letter-spacing:1.45px;color:#768da0;}
.topbar-links {display:flex;gap:23px;align-items:center;}
.docs-link {font-size:11px;color:#39738e;transition:color .2s ease;}
.docs-link:hover {color:#0c628a;}
.hero {padding:40px 0 36px;gap:35px;}
.hero-copy {min-width:0;}
.eyebrow {font-size:10px;color:#168493;letter-spacing:1.65px;margin-bottom:16px;}
.eyebrow-dot {background:#12b6b2;box-shadow:0 0 0 4px rgba(18,182,178,.13);}
.hero h1 {font-size:clamp(33px,3.15vw,49px);line-height:1.12;letter-spacing:-2.2px;color:#122d40;max-width:710px;}
.hero h1 em {color:#138c9b;}
.hero p {max-width:680px;margin-top:17px;font-size:14px;line-height:1.75;color:#5f7484;}
.hero-pills {display:flex;flex-wrap:wrap;gap:7px;margin-top:20px;}
.hero-pill {border:1px solid #d7e7ea;background:rgba(255,255,255,.65);color:#44718a;padding:6px 10px;border-radius:100px;font-size:10px;font-weight:700;letter-spacing:.08px;}
.hero-stamp {align-self:stretch;flex:0 0 234px;min-width:0;padding:18px 19px;text-align:left;background:linear-gradient(145deg,#143e4f,#0e293e 78%);border:1px solid #1c5162;color:#fff;border-radius:17px;position:relative;overflow:hidden;box-shadow:0 10px 26px rgba(7,37,54,.10);}
.hero-stamp:after {content:"";position:absolute;width:170px;height:170px;right:-85px;top:-65px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 30px rgba(255,255,255,.018),0 0 0 62px rgba(255,255,255,.018);}
.hero-stamp-icon {font-size:24px;color:#6fe1d6;margin-bottom:15px;}
.hero-stamp-title {font:800 14px/1.45 Manrope,sans-serif;letter-spacing:.8px;}
.hero-stamp-rule {height:1px;background:rgba(204,239,244,.2);margin:13px 0;}
.hero-stamp-foot {font-size:9px;color:#a3ccd5;letter-spacing:.7px;font-weight:700;}
.hero-stamp-foot span {color:#50d0c9;margin:0 4px;}
.filters,.panel,.kpi {box-shadow:var(--shadow);border-color:var(--line);}
.filters {padding:20px 23px 21px;border-radius:16px;margin-bottom:19px;}
.filter-top {align-items:center;margin-bottom:17px;}
.filter-top .overline {margin-bottom:7px;}
.filter-top strong {font:800 15px Manrope,sans-serif;letter-spacing:-.3px;}
.filter-top #sync-indicator {font-size:11px;font-weight:700;color:#487081;}
.sync-box {text-align:right;display:grid;gap:6px;}
#snapshot-note {color:#7c92a2;font-size:10px;}
.filter-row {gap:14px;}
.range-buttons {gap:7px;}
.range-button {background:#f1f5f7;border:1px solid #e9eef2;color:#50667c;font-size:11px;border-radius:9px;padding:11px 13px;transition:transform .18s ease,background .18s ease,border-color .18s ease;}
.range-button:hover {background:#e4eff2;border-color:#ccdee4;}
.range-button.selected {background:#135a78;border-color:#135a78;color:#fff;box-shadow:0 3px 10px rgba(20,95,119,.15);}
.priority-select {font-size:11px;color:#576d7c;}
.priority-select select {min-width:135px;padding:10px 12px;border-radius:9px;}
.custom-range {background:#f7fafb;padding:13px 14px;border-radius:10px;}
.custom-range input {border-radius:8px;}
.custom-range button {background:#154b64;border-radius:8px;}
.kpi-grid {gap:16px;margin-bottom:34px;}
.kpi {padding:23px 22px 21px;min-height:157px;border-radius:15px;position:relative;overflow:hidden;transition:transform .22s ease,box-shadow .22s ease;}
.kpi:before {content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:#bbdfea;}
.kpi:nth-child(2):before {background:#8fd1c9;}
.kpi:nth-child(3):before {background:#a8c1db;}
.kpi:hover,.insight-card:hover {transform:translateY(-2px);box-shadow:0 14px 33px rgba(20,45,61,.07);}
.kpi-label {font-size:11px;color:#5d758a;align-items:center;}
.kpi-label span {background:#edf7f9;padding:5px 7px;color:#147e94;border-radius:8px;font-size:14px;line-height:1;}
.kpi-value {font-size:clamp(25px,2.4vw,35px);margin:17px 0 7px;line-height:1.2;color:#15364a;}
.kpi-meta {font-size:10px;color:#7d8f9f;line-height:1.6;}
.kpi-dark {background:linear-gradient(140deg,#153e53,#0f2a40);border-color:#18485a;}
.kpi-dark:before {background:#45c5c1;}
.kpi-dark .kpi-value {color:#f2ffff;}
.kpi-dark .kpi-label span {color:#9ce0db;background:rgba(255,255,255,.1);}
.section-heading {display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:15px;}
.section-heading h2 {font:800 clamp(20px,2.3vw,25px) Manrope,sans-serif;letter-spacing:-.7px;color:#153247;}
.section-heading .overline {margin-bottom:7px;}
.section-heading p {font-size:12px;color:#667d8e;line-height:1.6;margin-top:6px;}
.section-index {font-size:10px;font-weight:800;color:#8ca1ae;letter-spacing:1px;white-space:nowrap;padding-bottom:2px;}
.insights-section {margin-bottom:34px;scroll-margin-top:30px;}
.insights-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.insight-card {background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px 21px 18px;min-height:203px;display:flex;flex-direction:column;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .22s ease,box-shadow .22s ease;}
.insight-card:after {content:"";position:absolute;right:-28px;top:-42px;width:125px;height:125px;border-radius:50%;background:rgba(23,151,150,.045);pointer-events:none;}
.insight-blue:after {background:rgba(47,110,186,.048);}
.insight-violet:after {background:rgba(114,106,181,.056);}
.insight-top {display:flex;align-items:center;gap:9px;font-size:11px;color:#617789;font-weight:800;}
.insight-icon {width:30px;height:30px;border-radius:9px;background:#e5f6f3;color:#0f948f;display:grid;place-items:center;font-size:17px;}
.insight-blue .insight-icon {background:#eaf2fc;color:#3478bc;}
.insight-violet .insight-icon {background:#eeecf9;color:#756cbd;}
.insight-value {font:800 clamp(23px,2.2vw,31px)/1.22 Manrope,sans-serif;color:#18374c;letter-spacing:-.9px;margin:18px 0 7px;}
.insight-detail {color:#65798a;font-size:11px;line-height:1.65;max-width:355px;flex:1;}
.insight-bottom {font-size:9px;letter-spacing:.55px;font-weight:800;color:#91a2af;border-top:1px solid #edf1f5;padding-top:12px;margin-top:15px;}
.two-col {gap:18px;margin-bottom:18px;}
.panel {border-radius:15px;padding:23px 23px 20px;scroll-margin-top:25px;}
.panel h2 {font-size:17px;letter-spacing:-.48px;color:#16374d;}
.panel-header {margin-bottom:19px;}
.panel p {color:#6a7e8e;line-height:1.65;font-size:11px;}
.overline {color:#23859a;}
.tag {background:#ebf7f9;color:#27788b;}
.chart-wrap {height:265px;}
.donut-wrap {height:265px;}
.panel-actions {display:flex;align-items:center;gap:9px;}
.small-action {font-size:10px;font-weight:800;color:#236b82;border:1px solid #d5e8eb;background:#f5fbfc;padding:7px 9px;border-radius:8px;white-space:nowrap;}
.small-action:hover {background:#e9f6f7;}
#map {background:radial-gradient(circle at 35% 45%,#f3f8fa,#e4eef3);border-color:#d8e6ec;}
.panel p.data-quality-note {border-left-color:#b3c8d7;background:#f5f8fa;color:#64798a;padding:12px 14px;}
.map-caption {font-size:10px;color:#627d90;}
.area-ranking li {padding:9px 2px;}
footer {margin-top:29px;padding-top:20px;color:#7c92a0;}
footer p {font-size:10px;color:#6d8191;}
[aria-busy="true"] .kpi-value,[aria-busy="true"] .insight-value {opacity:.65;}
@media (max-width:1260px) {
  .main {padding-left:29px;padding-right:29px;}
  .sidebar {width:205px;padding-left:13px;padding-right:13px;}
  .hero-stamp {flex-basis:200px;}
  .range-button {padding:10px 11px;}
}
@media (max-width:1050px) {
  .kpi-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  .insights-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;}
  .insight-card {padding:17px;}
  .hero-stamp {display:none;}
}
@media (max-width:780px) {
  .shell {display:block;}
  .sidebar {position:relative;top:auto;width:100%;height:auto;padding:15px 16px 10px;display:flex;flex-wrap:wrap;gap:7px;}
  .brand {margin:0;width:100%;font-size:20px;}
  .sidebar .nav-link {margin:0;padding:9px 11px;font-size:11px;}
  .sidebar-bottom,.nav-label {display:none;}
  .main {padding:0 17px 30px;}
  .topbar {height:auto;min-height:54px;gap:9px;flex-wrap:wrap;padding:13px 0;}
  .topbar-links {gap:13px;}
  .topbar-links a {font-size:10px;}
  .hero {padding:31px 0 29px;}
  .hero h1 {font-size:clamp(31px,7vw,44px);}
  .hero p {font-size:12px;}
  .filters {padding:17px;}
  .filter-top {align-items:flex-start;flex-direction:column;gap:10px;}
  .sync-box {text-align:left;}
  .range-buttons {gap:6px;}
  .range-button {padding:9px 10px;}
  .kpi-grid {gap:10px;margin-bottom:29px;}
  .kpi {min-height:135px;padding:17px;}
  .kpi-value {font-size:26px;}
  .insights-grid {grid-template-columns:1fr;}
  .insight-card {min-height:0;padding:18px;}
  .insight-value {font-size:27px;margin-top:12px;}
  .section-index {display:none;}
  .section-heading h2 {font-size:22px;}
  .panel {padding:19px 15px;}
  .panel-header {flex-direction:row;flex-wrap:wrap;}
  .chart-wrap {height:235px;}
  .two-col,.two-col.second-row {grid-template-columns:minmax(0,1fr);}
  footer {margin-top:20px;}
}
@media (max-width:420px) {
  .kpi {padding:14px;}
  .kpi-label {font-size:10px;}
  .kpi-label span {display:none;}
  .kpi-value {font-size:23px;}
  .kpi-meta {font-size:10px;}
  .breadcrumb {font-size:9px;}
  .panel h2 {font-size:15px;}
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}