.health-overview-comparison{
  margin:18px 0;
  padding:22px;
  border:1px solid #dfe7f2;
  border-radius:20px;
  background:linear-gradient(135deg,#fff 0%,#f8fbff 60%,#f1fbf9 100%);
  box-shadow:0 14px 34px rgba(26,46,77,.07);
}
.hoc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.hoc-head>div:first-child>span{display:block;color:#0d9488;font-size:12px;font-weight:800;letter-spacing:.08em;margin-bottom:6px}
.hoc-head h2{margin:0;color:#10213d;font-size:24px}
.hoc-head p{margin:8px 0 0;color:#6a7890;font-size:13px}
.hoc-toggle{display:flex;padding:4px;border:1px solid #dce5f0;border-radius:12px;background:#fff}
.hoc-toggle button{border:0;background:transparent;color:#64748b;border-radius:9px;padding:9px 17px;font-size:14px;font-weight:700;cursor:pointer}
.hoc-toggle button.active{background:#172b4d;color:#fff;box-shadow:0 5px 12px rgba(23,43,77,.18)}
.hoc-period{display:flex;align-items:center;gap:10px;margin:18px 0 12px;color:#7a8799;font-size:13px}
.hoc-period strong,.hoc-period b{color:#233753;font-size:14px}
.hoc-period span{padding:3px 9px;border-radius:999px;background:#eaf1f9;color:#60718a}
.hoc-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hoc-metric{padding:16px;border:1px solid #e3eaf3;border-radius:15px;background:rgba(255,255,255,.9)}
.hoc-metric>div{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hoc-metric span{font-size:13px;color:#60718a;font-weight:700}
.hoc-metric em{font-size:11px;font-style:normal;font-weight:800;padding:4px 7px;border-radius:999px;background:#eef2f7;color:#66758a}
.hoc-metric em.up{background:#e8f8f2;color:#07855f}
.hoc-metric em.down{background:#fff0ed;color:#c94b3b}
.hoc-metric strong{display:block;margin:11px 0 4px;color:#11233f;font-size:23px;line-height:1.1}
.hoc-metric p{margin:0;color:#8a96a8;font-size:12px}
.hoc-coverage{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:15px;padding:14px;border-radius:14px;background:#f0f5fa}
.hoc-coverage>div{margin-right:auto;min-width:200px}
.hoc-coverage>div span{display:block;color:#0d9488;font-size:11px;font-weight:800}
.hoc-coverage>div strong{display:block;margin-top:3px;color:#263a55;font-size:13px}
.hoc-coverage>span{display:inline-flex;align-items:center;gap:4px;padding:6px 9px;border-radius:9px;background:#fff;color:#65758c;font-size:12px}
.hoc-coverage>span b{color:#142a49}
.hoc-coverage>span small{color:#9aa6b7}
.hoc-loading{padding:24px;text-align:center;color:#64748b}
.hoc-loading.error{color:#b63e32}
.health-score-history{margin-top:22px;padding-top:22px;border-top:1px solid #dbe5ef}
.hsc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.hsc-head>div:first-child>span{display:block;color:#6d5ce7;font-size:12px;font-weight:800;letter-spacing:.08em;margin-bottom:6px}
.hsc-head h2{margin:0;color:#10213d;font-size:24px}
.hsc-head p{margin:8px 0 0;color:#6a7890;font-size:13px}
.hsc-toggle{display:flex;padding:4px;border:1px solid #dce5f0;border-radius:12px;background:#fff}
.hsc-toggle button{border:0;background:transparent;color:#64748b;border-radius:9px;padding:9px 15px;font-size:14px;font-weight:700;cursor:pointer}
.hsc-toggle button.active{background:#6d5ce7;color:#fff;box-shadow:0 5px 12px rgba(109,92,231,.2)}
.hsc-rule{margin:16px 0 12px;border:1px solid #e0e7f0;border-radius:13px;background:#fff}
.hsc-rule summary{padding:12px 15px;color:#40536d;font-size:13px;font-weight:700;cursor:pointer}
.hsc-rule>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;padding:0 15px 14px}
.hsc-rule p{margin:0;color:#6f7e92;font-size:12px;line-height:1.6}
.hsc-chart-summary{display:flex;align-items:center;gap:14px;margin:10px 2px 2px;color:#758399;font-size:12px}
.hsc-chart-summary span{padding:5px 9px;border-radius:8px;background:#f1f4f9}
.hsc-chart-summary b{color:#263c5b;font-size:14px}
.hsc-chart-summary small{margin-left:auto;color:#8d99aa}
.hsc-chart-wrap{height:235px;margin-top:2px;border:1px solid #e1e8f1;border-radius:14px;background:#fff;overflow:hidden}
.hsc-chart{display:block;width:100%;height:100%;overflow:visible}
.hsc-grid line{stroke:#e4eaf2;stroke-width:1;stroke-dasharray:5 5}
.hsc-grid text,.hsc-chart>text{fill:#8b98aa;font-size:11px}
.hsc-line-shadow{fill:none;stroke:rgba(109,92,231,.12);stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.hsc-line{fill:none;stroke:#6d5ce7;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.hsc-chart circle{fill:#fff;stroke:#6d5ce7;stroke-width:3;cursor:pointer;transition:.16s}
.hsc-chart circle:hover,.hsc-chart circle.selected{fill:#6d5ce7;stroke:#dcd6ff;stroke-width:5}
.hsc-chart-empty{padding:28px;text-align:center;color:#8090a5;background:#fff;border-radius:13px}
.hsc-selected{margin-top:10px}
.hsc-card{display:grid;grid-template-columns:70px minmax(0,1fr);gap:13px;padding:12px 14px;border:1px solid #e1e8f1;border-left:5px solid #90a0b4;border-radius:13px;background:#fff}
.hsc-card.good{border-left-color:#16a77d}.hsc-card.steady{border-left-color:#4c83dc}.hsc-card.watch{border-left-color:#e5a126}.hsc-card.alert{border-left-color:#e35e52}
.hsc-score{display:flex;align-items:baseline;justify-content:center;align-self:start;padding:9px 6px;border-radius:11px;background:#f2f5fa;color:#172b4d}
.hsc-score strong{font-size:29px;line-height:1}.hsc-score span{margin-left:3px;color:#718096;font-size:11px}
.hsc-content{min-width:0}
.hsc-title{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.hsc-title h3{margin:0;color:#1a2f4d;font-size:17px}
.hsc-title>span{padding:4px 8px;border-radius:999px;background:#edf2f8;color:#56677f;font-size:11px;font-weight:700}
.hsc-title small{margin-left:auto;color:#8c98a9;font-size:11px}
.hsc-basis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 14px;margin-top:8px}
.hsc-basis>div{display:flex;align-items:flex-start;gap:7px;min-width:0}
.hsc-basis b{flex:none;color:#304660;font-size:12px}
.hsc-basis span{color:#79879a;font-size:12px;line-height:1.45}
.hsc-context{margin:7px 0 0;padding:6px 9px;border-radius:8px;background:#f5f0ff;color:#675a8b;font-size:11px}
@media(max-width:1100px){.hoc-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){
  .health-overview-comparison{padding:16px}
  .hoc-head{display:block}
  .hoc-toggle{display:inline-flex;margin-top:14px}
  .hoc-metrics{grid-template-columns:1fr}
  .hsc-head{display:block}
  .hsc-toggle{display:inline-flex;margin-top:14px}
  .hsc-rule>div,.hsc-basis{grid-template-columns:1fr}
  .hsc-card{grid-template-columns:70px minmax(0,1fr);padding:12px}
  .hsc-score strong{font-size:28px}
  .hsc-chart-wrap{height:210px;overflow-x:auto}
  .hsc-chart{min-width:760px}
  .hsc-chart-summary{flex-wrap:wrap}
  .hsc-chart-summary small{width:100%;margin-left:0}
}