.heatmap-intro{color:var(--text-secondary);font-size:0.95rem;line-height:1.6;max-width:68ch;margin:0 0 var(--sp-6)}.heatmap-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-5)}.heatmap-legend{display:flex;flex-wrap:wrap;gap:var(--sp-4);list-style:none}.legend-item{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:0.8rem;color:var(--text-secondary);font-family:var(--font-mono)}.legend-swatch{width:10px;height:10px;border-radius:3px;display:inline-block}.legend-swatch.operational{background:var(--operational)}.legend-swatch.degraded{background:var(--degraded)}.legend-swatch.outage{background:var(--outage)}.legend-swatch.unknown{background:var(--unknown)}.heatmap-view-toggle{display:inline-flex;border:1px solid var(--border-subtle);border-radius:var(--r-md);overflow:hidden}.view-toggle-btn{font-family:var(--font-mono);font-size:0.8rem;padding:var(--sp-2) var(--sp-4);background:var(--bg-elevated);color:var(--text-secondary);border:none;cursor:pointer;transition:background var(--t-fast),color var(--t-fast)}.view-toggle-btn+.view-toggle-btn{border-left:1px solid var(--border-subtle)}.view-toggle-btn:hover{color:var(--text-primary)}.view-toggle-btn[aria-pressed="true"]{background:var(--cyan-dim);color:var(--cyan)}.view-toggle-btn:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}.heatmap-chart{position:relative;width:100%;aspect-ratio:2 / 1;min-height:420px;max-height:640px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-lg);overflow:hidden}@media (max-width:767px){.heatmap-chart{aspect-ratio:3 / 4;min-height:520px;max-height:none}}.heatmap-tile{position:absolute;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--sp-1) var(--sp-2);border-radius:var(--r-sm);cursor:pointer;font-family:var(--font-sans);transition:filter var(--t-fast),transform var(--t-fast);outline-offset:-2px}.heatmap-tile:hover,.heatmap-tile:focus-visible{filter:brightness(1.12);z-index:2}.heatmap-tile:focus-visible{outline:2px solid var(--text-primary)}.heatmap-tile.operational{background:var(--operational);color:#0a0e18}.heatmap-tile.degraded{background:var(--degraded);color:#0a0e18}.heatmap-tile.outage{background:var(--outage);color:#0a0e18}.heatmap-tile.unknown{background:var(--unknown);color:var(--text-primary)}.tile-name{font-weight:600;font-size:0.75rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tile-status{font-family:var(--font-mono);font-size:0.62rem;opacity:0.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heatmap-tile.tile-compact .tile-name,.heatmap-tile.tile-compact .tile-status{display:none}.heatmap-tooltip{position:fixed;z-index:50;max-width:260px;background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--r-md);padding:var(--sp-3);font-size:0.78rem;color:var(--text-secondary);box-shadow:0 8px 24px rgba(0,0,0,0.4);pointer-events:none}.heatmap-tooltip[hidden]{display:none}.tooltip-title{font-family:var(--font-sans);font-weight:600;color:var(--text-primary);font-size:0.88rem;margin-bottom:var(--sp-1)}.tooltip-status{font-family:var(--font-mono);font-size:0.72rem;margin-bottom:var(--sp-1)}.tooltip-status.operational{color:var(--operational)}.tooltip-status.degraded{color:var(--degraded)}.tooltip-status.outage{color:var(--outage)}.tooltip-status.unknown{color:var(--unknown)}.tooltip-incident{margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--border-subtle);color:var(--text-secondary)}.heatmap-table-wrap{overflow-x:auto;border:1px solid var(--border-subtle);border-radius:var(--r-lg);background:var(--bg-surface)}.heatmap-table{width:100%;border-collapse:collapse;font-size:0.85rem}.heatmap-table th,.heatmap-table td{text-align:left;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-subtle);white-space:nowrap}.heatmap-table th{font-family:var(--font-mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--text-secondary)}.heatmap-table td{color:var(--text-primary)}.heatmap-table tbody tr:last-child td{border-bottom:none}.table-status-cell{display:inline-flex;align-items:center;gap:var(--sp-2);font-family:var(--font-mono);font-size:0.8rem}.table-status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0}.table-status-dot.operational{background:var(--operational)}.table-status-dot.degraded{background:var(--degraded)}.table-status-dot.outage{background:var(--outage)}.table-status-dot.unknown{background:var(--unknown)}