.status-page {
  min-height: auto;
  padding: 54px 0 90px;
}

.status-card {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto;
  padding: 38px 44px 46px;
  background: var(--cream);
  border: 3px solid var(--ink);
  box-shadow: 8px 8px 0 var(--orange);
}

.status-card h1 { margin: 12px 0 14px; font-size: clamp(38px, 4.5vw, 56px); line-height: 1; }
.status-card p { color: var(--muted); line-height: 1.65; }
.status-card > .shards-summary,
.status-card > .shards-list { display: none; }
.status-indicator { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font: 700 16px 'Pixelify Sans', sans-serif; }
.status-dot { width: 16px; height: 16px; background: #f2b84b; border: 3px solid var(--ink); border-radius: 50%; box-shadow: 3px 3px 0 var(--brown); }
.status-dot.online { background: #48db7d; }
.status-dot.offline { background: #ed6a5a; }
.status-meta { margin-top: 22px; padding-top: 16px; border-top: 2px dashed var(--brown); font: 12px 'DM Mono', monospace; }
.shards-summary { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; font: 700 14px 'DM Mono', monospace; }
.shard-chip { padding: 9px 11px; color: var(--ink); background: var(--white); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--brown); }
.shards-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-top: 14px; }
.cluster-card { padding: 13px; color: #fff7ef; background: #29232f; border: 2px solid var(--ink); }
.cluster-card strong { color: var(--orange); }
.cluster-card small { display: block; margin-top: 7px; color: #cdbdb3; font: 12px/1.5 'DM Mono', monospace; }
.cluster-dashboard { margin-top: 30px; }
.cluster-dashboard { width: 100%; }
.cluster-dashboard h2 { margin: 28px 0 12px; padding-bottom: 10px; border-bottom: 2px solid var(--brown); font-size: clamp(24px, 4vw, 34px); }
.status-legend { display: grid; gap: 9px; margin: 24px 0 30px; padding: 16px 18px; background: rgba(125,75,56,.14); border: 2px dashed var(--brown); }
.legend-item { display: flex; align-items: center; gap: 10px; font: 14px 'Space Grotesk', sans-serif; }
.legend-icon { display: inline-grid; place-items: center; width: 20px; height: 20px; border: 2px solid currentColor; border-radius: 50%; font-weight: 700; }
.legend-online { color: #20d889; }
.legend-warning { color: #ffd21f; }
.legend-offline { color: #ff5d5d; }
.cluster-summary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.cluster-summary-item { padding: 14px; background: var(--white); border: 2px solid var(--ink); box-shadow: 4px 4px 0 var(--brown); }
.cluster-summary-item span { display: block; color: var(--muted); font: 12px 'DM Mono', monospace; }
.cluster-summary-item strong { display: block; margin-top: 5px; color: var(--orange); font-size: 24px; }
.cluster-search { display: flex; gap: 8px; margin: 14px 0 12px; }
.cluster-search input { flex: 1; min-width: 0; padding: 12px; color: var(--ink); background: var(--white); border: 2px solid var(--ink); font: 14px 'DM Mono', monospace; }
.cluster-search button { padding: 10px 16px; color: #fff; background: var(--orange); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--brown); font-weight: 700; cursor: pointer; }
.cluster-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.cluster-tile { min-height: 92px; padding: 13px; color: #fff7ef; background: #29232f; border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--brown); }
.cluster-tile strong { color: var(--orange); font: 700 16px 'Pixelify Sans', sans-serif; }
.cluster-tile small { display: block; margin-top: 8px; color: #cdbdb3; font: 11px/1.55 'DM Mono', monospace; }
.cluster-tile { position: relative; cursor: help; }
.cluster-state { display: inline-flex; align-items: center; gap: 6px; margin-top: 9px; font: 11px 'DM Mono', monospace; }
.cluster-state .legend-icon { width: 16px; height: 16px; font-size: 10px; }
.cluster-tooltip { position: absolute; left: calc(100% + 10px); top: 0; z-index: 5; display: block; width: 250px; max-width: 250px; padding: 12px 14px; color: #fff7ef; background: #29232f; border: 2px solid var(--orange); box-shadow: 5px 5px 0 var(--brown); font-family: 'Space Grotesk', Arial, sans-serif !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.55 !important; letter-spacing: normal !important; text-transform: none !important; white-space: normal !important; opacity: 0; pointer-events: none; transform: translateX(-6px); transition: opacity .15s steps(2, end), transform .15s steps(2, end); }
.cluster-tooltip::after { position: absolute; left: 50%; bottom: -7px; width: 10px; height: 10px; background: #29232f; border-right: 2px solid var(--orange); border-bottom: 2px solid var(--orange); content: ''; transform: translateX(-50%) rotate(45deg); }
.cluster-tile:hover .cluster-tooltip, .cluster-tile:focus .cluster-tooltip { opacity: 1; transform: translateX(0); }
[data-theme='dark'] .cluster-summary-item, [data-theme='dark'] .cluster-search input { color: #fff7ef; background: #403548; }

[data-theme='dark'] .status-card { background: #29232f; color: #fff7ef; }
[data-theme='dark'] .shard-chip { color: #fff7ef; background: #403548; }

@media (max-width: 800px) {
  .status-page { padding: 38px 0 70px; }
  .status-card { padding: 26px 20px 34px; }
  .cluster-summary-grid { grid-template-columns: 1fr; }
  .cluster-search { flex-direction: column; }
  .cluster-grid { grid-template-columns: 1fr; }
  .cluster-tooltip { position: static; width: 100%; max-width: none; margin-top: 12px; transform: none; }
  .cluster-tile:hover .cluster-tooltip, .cluster-tile:focus .cluster-tooltip { transform: none; }
}