:root {
  color-scheme: dark;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #0b1120;
  color: #e5e7eb;
}
* { box-sizing: border-box; }
body { margin: 0; background: #0b1120; }
main { padding: 20px; min-height: 100vh; }
header, footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
header { margin-bottom: 16px; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
h1 { margin: 0 0 6px; font-size: 24px; }
p { margin: 0; color: #94a3b8; }
button, input { font: inherit; }
button { color: #e5e7eb; background: #172033; border: 1px solid #334155; border-radius: 7px; padding: 8px 12px; cursor: pointer; }
button:hover { background: #22304a; }
button:disabled { opacity: .45; cursor: default; }
.danger { background: #7f1d1d; border-color: #b91c1c; }
.danger:hover { background: #991b1b; }
.action-status { min-height: 22px; margin: -8px 0 10px; }
.action-status.working { color: #fbbf24; }
.action-status.success { color: #4ade80; }
.action-status.error { color: #f87171; }
.table-wrap { overflow: auto; border: 1px solid #263349; border-radius: 10px; background: #111827; max-height: calc(100vh - 150px); }
table { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 1750px; font-size: 13px; }
th, td { padding: 9px 10px; border-right: 1px solid #263349; border-bottom: 1px solid #263349; text-align: left; white-space: nowrap; }
thead { position: sticky; top: 0; z-index: 2; }
th { background: #172033; }
#sortRow button { width: 100%; border: 0; padding: 2px; text-align: left; background: transparent; font-weight: 700; }
#sortRow button[data-active="asc"]::after { content: " ▲"; color: #60a5fa; }
#sortRow button[data-active="desc"]::after { content: " ▼"; color: #60a5fa; }
#filterRow th { top: 36px; background: #111827; padding: 6px; }
#filterRow input { display: block; width: 100%; min-width: 105px; margin: 2px 0; padding: 6px 7px; color: #e5e7eb; background: #0b1120; border: 1px solid #334155; border-radius: 5px; }
tbody tr:nth-child(even) { background: #0f172a; }
tbody tr:hover { background: #172554; }
footer { justify-content: center; padding-top: 14px; }
@media (max-width: 800px) {
  main { padding: 12px; }
  header { align-items: flex-start; flex-direction: column; }
  .header-actions { justify-content: flex-start; }
}