html, body { background: #0b1224; color: #e2e8f0; min-height: 100vh; }
body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0b1224; }
::-webkit-scrollbar-thumb { background: #1f2a44; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #2c3a5e; }

.toggle {
  position: relative; width: 44px; height: 24px; border-radius: 999px;
  background: #1f2a44; cursor: pointer; transition: background .15s;
}
.toggle::after {
  content: ''; position: absolute; top: 3px; left: 3px;
  width: 18px; height: 18px; border-radius: 999px; background: #94a3b8;
  transition: all .15s;
}
.toggle.on { background: #16a34a; }
.toggle.on::after { left: 23px; background: #fff; }

.badge { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; letter-spacing: .04em; }
.badge-active { background: #14532d; color: #4ade80; }
.badge-free { background: #334155; color: #cbd5e1; }
.badge-paid { background: #422006; color: #fbbf24; }
.badge-blacklist { background: #7f1d1d; color: #fecaca; }
.badge-whitelist { background: #1e3a8a; color: #93c5fd; }

.btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 8px; font-weight: 600; font-size: 13px; transition: all .15s; cursor: pointer; border: 0; }
.btn-blue { background: #2563eb; color: #fff; } .btn-blue:hover { background: #1d4ed8; }
.btn-green { background: #16a34a; color: #fff; } .btn-green:hover { background: #15803d; }
.btn-red { background: #dc2626; color: #fff; } .btn-red:hover { background: #b91c1c; }
.btn-outline-green { background: transparent; color: #4ade80; border: 1px solid #16a34a; } .btn-outline-green:hover { background: #052e16; }
.btn-outline-blue { background: transparent; color: #60a5fa; border: 1px solid #2563eb; } .btn-outline-blue:hover { background: #0c1638; }
.btn-icon { padding: 8px; border-radius: 8px; background: #1f2a44; color: #cbd5e1; cursor: pointer; }
.btn-icon:hover { background: #2c3a5e; }

input, select, textarea {
  background: #0b1224 !important; border: 1px solid #1f2a44 !important; color: #e2e8f0 !important;
  border-radius: 8px; padding: 8px 12px; outline: none; width: 100%;
}
input:focus, select:focus, textarea:focus { border-color: #3b82f6 !important; }
textarea { font-family: ui-monospace, 'Cascadia Mono', Menlo, monospace; font-size: 12px; }

.modal-bg { position: fixed; inset: 0; background: rgba(0,0,0,.6); backdrop-filter: blur(4px); z-index: 50; display: none; align-items: center; justify-content: center; }
.modal-bg.show { display: flex; }
.modal { background: #11192e; border: 1px solid #1f2a44; border-radius: 14px; width: 540px; max-width: 92vw; max-height: 90vh; overflow: auto; }

.row-hover:hover { background: rgba(255,255,255,.02); }
