.tabs a { padding: 0.35rem 0.8rem; }
#lists { display: block; padding: 0 1rem 2rem; }
.area-block { margin-top: 1.2rem; }
.area-block h2 { font-size: 0.95rem; margin: 0 0 0.15rem; }
.area-block h2 small { color: var(--muted); font-weight: normal; margin-left: 0.5rem; }
.now-line { color: var(--muted); margin: 0 0 0.5rem; font-size: 12px; }
.now-line b { color: var(--text); }
.outage-table { border-collapse: collapse; width: 100%; max-width: 70rem; font-variant-numeric: tabular-nums; margin-bottom: 0.8rem; }
.outage-table th, .outage-table td { padding: 4px 8px; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
.outage-table th { color: var(--muted); font-weight: 600; font-size: 12px; position: sticky; top: 0; background: var(--bg); }
.outage-table td.num { text-align: right; }
.outage-table tr.now td { background: rgba(var(--pos), 0.06); }
.outage-table tr.ended td { color: var(--muted); }
.bar { display: inline-block; height: 8px; border-radius: 2px; background: var(--accent); vertical-align: middle; margin-left: 6px; }
.kind { display: inline-flex; align-items: center; gap: 0.35rem; }
.kind::before { content: ""; width: 0.7rem; height: 0.7rem; border-radius: 2px; background: var(--c); }
.kind.planned { --c: #3987e5; } .kind.unplanned { --c: #d95926; }
.state { font-size: 11px; padding: 1px 6px; border-radius: 10px; border: 1px solid var(--border); color: var(--muted); }
.state.now { color: var(--text); border-color: var(--warn); }
.empty-note { color: var(--muted); padding: 0.4rem 0; }