/* ===== API 可用性看板页 ===== */
.status-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px; padding-bottom: 30px;
}
.status-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  padding: 14px 16px; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 10px;
}
.status-card.is-down { border-color: #e6a3a3; }
.sc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sc-name { font-weight: 700; font-size: 15px; }
.sc-dot {
  font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 999px; flex: none;
}
.sc-dot.up { color: var(--free); background: var(--free-bg); }
.sc-dot.down { color: #fff; background: #d8453a; }
.sc-dot.unknown { color: var(--text-2); background: var(--surface-2); }
.sc-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.pill {
  font-size: 11px; color: var(--text-2); background: var(--surface-2);
  padding: 3px 9px; border-radius: 999px;
}
.pill.ok { color: var(--free); background: var(--free-bg); }
.pill.warn { color: var(--quota); background: var(--quota-bg); }
.sc-rows { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.sc-row { display: flex; align-items: center; gap: 8px; color: var(--text-2); }
.sc-row b { color: var(--text); font-weight: 600; }
.src-tag {
  font-size: 10px; color: var(--accent-2); background: color-mix(in srgb, var(--accent-2) 12%, transparent);
  padding: 1px 6px; border-radius: 5px; margin-left: auto;
}
.sc-foot { display: flex; gap: 14px; font-size: 13px; border-top: 1px solid var(--border); padding-top: 10px; }
.sc-foot a { color: var(--accent-2); font-weight: 600; }
.status-foot { text-align: center; color: var(--text-2); margin: 10px 0 30px; }
.status-foot a { color: var(--accent-2); }
.note code { background: var(--surface-2); padding: 1px 6px; border-radius: 5px; font-size: 12px; }