.overview-card{margin-top:16px;margin-bottom:16px;padding:18px 20px 20px;overflow:hidden}
.connection-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;margin:18px 18px 0;padding:20px 22px;border:1px solid rgb(245 158 11/.28);border-radius:12px;background:linear-gradient(105deg,rgb(120 53 15/.22),rgb(36 29 20/.72));box-shadow:0 12px 35px rgb(0 0 0/.09)}
.connection-banner-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:13px;background:rgb(245 158 11/.12);color:#f7bd58}.connection-banner-icon svg{width:22px;height:22px}
.connection-banner-copy small{color:#dba94d;font-size:10px;font-weight:800;letter-spacing:.15em}.connection-banner-copy h2{margin:4px 0;color:#fff4df;font-size:18px}.connection-banner-copy p{max-width:760px;margin:0;color:#b9ad99;font-size:12px;line-height:1.7}
.connection-banner-actions{display:flex;align-items:center;gap:9px;white-space:nowrap}
.overview-card h2{font-size:16px;margin:0 0 22px;padding-left:12px;position:relative;color:#f4f7fb}
.overview-card h2:before{content:"";position:absolute;left:0;top:1px;width:4px;height:19px;border-radius:3px;background:#3b82f6}
.activity-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px}
.activity-columns article{min-width:0}
.activity-columns article>header{display:flex;justify-content:space-between;align-items:center;color:#8d98aa;font-size:13px;margin-bottom:10px}
.activity-columns article>header b{font-size:16px;color:#f1f5f9}
.activity-months{display:grid;grid-template-columns:repeat(12,1fr);padding-left:28px;margin-bottom:8px;color:#8994a6;font-size:11px}
.activity-months span{text-align:left}
.activity-body{display:flex;gap:7px;overflow:hidden}
.activity-weekdays{width:20px;display:grid;grid-template-rows:repeat(4,1fr);align-items:center;color:#778397;font-size:11px;height:91px}
.activity-grid{display:grid;grid-template-rows:repeat(7,11px);grid-auto-flow:column;grid-auto-columns:11px;gap:2px;min-width:max-content}
.activity-cell{display:block;width:11px;height:11px;border-radius:2px;background:#252b36}
.activity-cell.outside{background:transparent}
.activity-cell.level-1{background:#173d70}.activity-cell.level-2{background:#1d5fa8}.activity-cell.level-3{background:#287fd7}.activity-cell.level-4{background:#3b9cff}
.sent .activity-cell.level-1{background:#153b32}.sent .activity-cell.level-2{background:#1d684f}.sent .activity-cell.level-3{background:#26936c}.sent .activity-cell.level-4{background:#36c98f}
.activity-legend{display:flex;align-items:center;justify-content:flex-end;gap:3px;margin-top:10px;color:#778397;font-size:11px}
.status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.status-metric{text-align:center;min-width:0}
.status-ring{width:104px;height:104px;margin:0 auto 13px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--ring-color) 0 var(--ring-value),#29303c var(--ring-value) 360deg);position:relative}
.status-ring:before{content:"";position:absolute;inset:9px;border-radius:50%;background:#1b1d21;box-shadow:inset 0 0 0 1px #313640}
.status-ring>div{position:relative;display:grid;gap:3px;z-index:1}
.status-ring b{font-size:20px;color:#f8fafc}.status-ring b small{font-size:11px;margin-left:2px}.status-ring span{font-size:12px;color:#91a0b5}
.status-metric p{margin:0;color:#78869b;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stability-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.stability-group{min-width:0;padding:16px;border:1px solid #303643;border-radius:11px;background:#1b1f26}.stability-group>header{margin-bottom:13px}.stability-group h3{margin:0;color:#eef3f9;font-size:14px}.stability-group>header p{margin:4px 0 0;color:#79869a;font-size:11px;line-height:1.5}.stability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.stability-grid>div{min-width:0;padding:12px;border:1px solid #2c323d;border-radius:8px;background:#20242b;display:grid;gap:6px}.stability-grid span{color:#8d9bb0;font-size:11px}.stability-grid b{color:#edf3fb;font-size:14px;overflow-wrap:anywhere}.stability-grid b.warn{color:#f5b84b}.stability-warning{margin-top:12px;padding:11px 13px;border-radius:8px;background:rgb(245 184 75/.08);border:1px solid rgb(245 184 75/.2);color:#dcb56b;font-size:12px}
.traffic-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.traffic-stats>div{background:#171a20;border:1px solid #343a45;border-radius:7px;padding:9px 11px;display:grid;gap:5px}
.traffic-stats span{font-size:11px;color:#7e8ba0}.traffic-stats b{font-size:14px;color:#76a9ff;font-weight:600}
.traffic-legend{display:flex;justify-content:flex-end;gap:18px;margin:14px 5px 0;color:#8895a7;font-size:11px}
.traffic-legend span:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.traffic-legend .up:before{background:#36c98f}.traffic-legend .down:before{background:#3b82f6}
.traffic-svg{display:block;width:100%;height:190px;margin-top:2px;overflow:visible}
.traffic-grid line{stroke:#2b3039;stroke-width:1}.traffic-up,.traffic-down{fill:none;stroke-width:2;vector-effect:non-scaling-stroke}.traffic-up{stroke:#36c98f}.traffic-down{stroke:#3b82f6}
@media(max-width:1180px){.stability-groups{grid-template-columns:repeat(2,minmax(0,1fr))}.stability-group:last-child{grid-column:1/-1}}
@media(max-width:1100px){.activity-columns{grid-template-columns:1fr}.status-grid{grid-template-columns:repeat(2,1fr)}.connection-banner{grid-template-columns:auto minmax(0,1fr)}.connection-banner-actions{grid-column:2}}
@media(max-width:680px){.connection-banner{grid-template-columns:1fr;margin:12px 12px 0;padding:17px}.connection-banner-icon{width:42px;height:42px}.connection-banner-actions{grid-column:1;flex-wrap:wrap}.overview-card{padding:16px 12px}.activity-body{overflow:auto}.traffic-stats,.stability-grid{grid-template-columns:repeat(2,1fr)}.stability-groups{grid-template-columns:1fr}.stability-group:last-child{grid-column:auto}.status-grid{grid-template-columns:repeat(2,1fr);gap:26px 10px}.traffic-svg{height:150px}}
