.bt-hero { text-align: left; margin-bottom: 1.25rem; }
.bt-hero h1 { margin: 0 0 0.35rem; font-size: 1.75rem; }
.page { max-width: 1280px; }

.bt-toolbar {
  display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: end;
  margin-bottom: 1rem; padding: 0.75rem 1rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
}
.bt-toolbar label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.75rem; color: var(--muted); }
.bt-toolbar select, .bt-toolbar input { min-width: 120px; padding: 0.35rem 0.5rem; font-size: 0.85rem;
  background: var(--bg); color: var(--text); border: 1px solid var(--border); border-radius: 6px; }

.bt-btn {
  padding: 0.45rem 0.85rem; font-size: 0.85rem; cursor: pointer;
  background: var(--accent); color: #fff; border: none; border-radius: 6px;
}
.bt-btn:hover { filter: brightness(1.08); }
.bt-btn-ghost { background: transparent; color: var(--muted); border: 1px solid var(--border); }

.bt-kpi-grid {
  display: none;
}
.bt-kpi {
  padding: 0.75rem 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
}
.bt-kpi-label { font-size: 0.72rem; color: var(--muted); }
.bt-kpi-hint { font-weight: 400; opacity: 0.85; }
.bt-kpi-sub { font-size: 0.68rem; color: var(--muted); margin-top: 0.25rem; }
.bt-kpi-value { font-size: 1.5rem; font-weight: 700; }
.bt-kpi-occ .bt-kpi-value { color: #f59e0b; }
.bt-kpi-avail .bt-kpi-value { color: #34d399; }
.bt-kpi-delta { font-size: 0.75rem; color: var(--muted); }
.bt-kpi-delta.up { color: #34d399; }
.bt-kpi-delta.down { color: #f87171; }

.bt-cat-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 0.5rem; margin-bottom: 1.25rem;
}
.bt-cat {
  padding: 0.5rem 0.75rem; background: var(--surface); border: 1px solid var(--border);
  border-radius: 8px; text-align: center;
}
.bt-cat-label { font-size: 0.68rem; color: var(--muted); }
.bt-cat-value { font-size: 1.25rem; font-weight: 700; color: #34d399; }
.bt-cat-delta { font-size: 0.65rem; color: var(--muted); }
.hidden { display: none !important; }
.bt-col-trauma { color: #a78bfa; }

.bt-layout { display: grid; grid-template-columns: 1fr 320px; gap: 1rem; align-items: start; }
@media (max-width: 960px) { .bt-layout { grid-template-columns: 1fr; } }

.bt-table-wrap { overflow: auto; max-height: 70vh; border: 1px solid var(--border); border-radius: 10px; }
.bt-table {
  width: 100%; border-collapse: collapse; font-size: 11px;
}
.bt-table th, .bt-table td { padding: 0.4rem 0.55rem; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
.bt-table th { position: sticky; top: 0; background: var(--surface); z-index: 1; text-align: center; }
.bt-th-group { border-bottom: 1px solid var(--border); background: rgba(99, 102, 241, 0.08); }
.bt-sub { font-size: 10px; font-weight: 600; }
.bt-num { font-variant-numeric: tabular-nums; }
.bt-table th.bt-sort { cursor: pointer; user-select: none; }
.bt-table th.bt-sort:hover { color: var(--accent); }
.bt-table th.bt-sort.sorted::after { content: ' ▲'; font-size: 8px; opacity: 0.7; }
.bt-table th.bt-sort.sorted[data-dir="desc"]::after { content: ' ▼'; }
.bt-cat-pct { display: block; font-weight: 600; }
.bt-cat-sub { display: block; font-size: 9px; color: var(--muted); }
.bt-col-occupied { color: #f59e0b; }
.bt-col-available { color: #34d399; }
.bt-cap-src { display: block; font-size: 9px; color: var(--muted); font-weight: 400; }
.bt-table td:first-child, .bt-table th:first-child { text-align: left; max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.bt-table tbody tr { cursor: pointer; }
.bt-table tbody tr:hover { background: rgba(99, 102, 241, 0.08); }
.bt-table tr.selected { background: rgba(16, 185, 129, 0.12); }

.bt-aside {
  padding: 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
}
.bt-aside h3 { margin: 0 0 0.5rem; font-size: 0.95rem; }
.bt-note { font-size: 0.72rem; color: var(--muted); margin-top: 0.5rem; }
.muted { color: var(--muted); }

.bt-drawer.hidden { display: none; }
.bt-drawer { position: fixed; inset: 0; z-index: 100; }
.bt-drawer-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.55); }
.bt-drawer-panel {
  position: absolute; right: 0; top: 0; bottom: 0; width: min(520px, 100%);
  background: var(--surface); border-left: 1px solid var(--border);
  display: flex; flex-direction: column;
}
.bt-drawer-head { display: flex; justify-content: space-between; align-items: center; padding: 1rem; border-bottom: 1px solid var(--border); }
.bt-drawer-head h2 { margin: 0; font-size: 1rem; }
.bt-detail-section { margin-bottom: 1.25rem; }
.bt-detail-section h3 { margin: 0 0 0.5rem; font-size: 0.85rem; color: var(--accent); }
.bt-hospital-info .bt-info-row { display: flex; gap: 0.75rem; padding: 0.2rem 0; font-size: 0.8rem; border-bottom: 1px solid var(--border); }
.bt-hospital-info .lbl { min-width: 3.5rem; color: var(--muted); flex-shrink: 0; }
.bt-drawer-summary { padding: 0.75rem; background: rgba(16, 185, 129, 0.06); border-radius: 8px; }
.bt-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; font-size: 0.8rem; }
.bt-summary-grid .lbl { display: block; font-size: 0.68rem; color: var(--muted); }
.bt-summary-grid .occ strong { color: #f59e0b; }
.bt-summary-grid .avail strong { color: #34d399; }
.bt-raw-details { margin-top: 1rem; font-size: 0.75rem; }
.bt-raw-details pre { font-size: 0.68rem; overflow: auto; max-height: 40vh; white-space: pre-wrap; word-break: break-all; }
.bt-breakdown-group { margin-bottom: 1rem; }
.bt-breakdown-head { font-weight: 600; border-bottom: 1px solid var(--border); padding-bottom: 0.25rem; margin-bottom: 0.15rem; }
.bt-breakdown-sub { padding-left: 0.5rem; font-size: 0.78rem; opacity: 0.9; }
.bt-breakdown-group h4 { margin: 0 0 0.35rem; font-size: 0.85rem; color: var(--accent); }
.bt-breakdown-row { display: flex; justify-content: space-between; padding: 0.2rem 0; border-bottom: 1px solid var(--border); }
.bt-drawer-body { flex: 1; overflow: auto; padding: 1rem; font-size: 0.8rem; }

.bt-map-form { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 2rem; padding: 1rem; background: var(--surface); border-radius: 10px; border: 1px solid var(--border); }
.bt-map-form label { display: flex; flex-direction: column; gap: 0.35rem; min-width: 200px; }
.bt-map-form input, .bt-map-form select { padding: 0.4rem; background: var(--bg); color: var(--text); border: 1px solid var(--border); border-radius: 6px; }

.badge-y { color: #34d399; }
.badge-n { color: #f87171; }