:root {
  color-scheme: dark;
  font-family: Inter, system-ui, sans-serif;
  background: #0f1117;
  color: #f3f4f6;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 1.25rem; }
a { color: #a5b4fc; }
button, input { font: inherit; }
.portal-card { width: min(100%, 560px); padding: 2rem; background: #1a1d26; border: 1px solid #2e3447; border-radius: 18px; box-shadow: 0 16px 48px #0008; }
.portal-card.wide { width: min(100%, 980px); }
.portal-brand { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.5rem; }
.portal-brand strong { font-size: 1.3rem; }
.portal-brand span { font-size: 1.8rem; }
h1 { margin: 0 0 .4rem; font-size: 1.65rem; }
.muted { color: #a1a1aa; }
.field { display: grid; gap: .45rem; margin: 1.1rem 0; }
.field input { width: 100%; padding: .8rem 1rem; border: 1px solid #3b4152; border-radius: 9px; color: #f3f4f6; background: #12141c; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border: 0; border-radius: 9px; padding: .75rem 1rem; background: #4f6bff; color: white; text-decoration: none; font-weight: 650; cursor: pointer; }
.btn.secondary { background: #282d3b; border: 1px solid #41475a; }
.btn.danger { background: #8d2929; }
.btn:disabled { opacity: .6; cursor: wait; }
.actions { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1rem 0; }
.notice { margin: 1rem 0; padding: .8rem 1rem; border-radius: 9px; background: #20283e; color: #c7d2fe; }
.notice.error { background: #3a2024; color: #fecaca; }
.notice.success { background: #17352b; color: #a7f3d0; }
.row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.script-list { display: grid; gap: .65rem; padding: 0; list-style: none; }
.script-item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; background: #12141c; border: 1px solid #2e3447; border-radius: 10px; }
.script-title { font-weight: 650; overflow-wrap: anywhere; }
.script-meta { color: #9ca3af; font-size: .85rem; margin-top: .2rem; }
.admin-table-wrap { overflow-x: auto; margin-top: 1rem; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: .7rem; border-bottom: 1px solid #343949; text-align: left; }
.status { padding: .2rem .55rem; border-radius: 20px; background: #41475a; font-size: .8rem; }
.status.active { background: #12432f; color: #a7f3d0; }
.status.suspended, .status.pending_subscription { background: #492d16; color: #fed7aa; }
@media (max-width: 640px) {
  .portal-card { padding: 1.3rem; }
  .script-item, .row { align-items: flex-start; flex-direction: column; }
  th, td { padding: .55rem; }
}