:root { --bg: #0b1020; --card: #141a2e; --muted: #7d8db1; --text: #e8ecff; --acc: #7aa2ff; }
*{ box-sizing:border-box }
body{ margin:0; font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background:var(--bg); color:var(--text); }
.wrap{ max-width:980px; margin:40px auto; padding:0 16px; }
.card{ background:var(--card); border-radius:16px; padding:20px; box-shadow:0 10px 30px rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.06) }
h1{ font-size:22px; margin:0 0 12px }
h2{ font-size:18px; margin:18px 0 8px }
p.muted{ color:var(--muted); margin-top:0 }
form{ margin:0; display:block }
.input, input[type=text], textarea{ width:100%; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.08); background:#0e1430; color:var(--text); }
textarea{ min-height:160px; font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; }
.row{ display:flex; gap:12px; flex-wrap:wrap }
.btn{ appearance:none; border:none; background:var(--acc); color:#06122e; padding:10px 14px; border-radius:12px; font-weight:600; cursor:pointer }
.btn.secondary{ background:#1d2748; color:var(--text); border:1px solid rgba(255,255,255,.08) }
.btn.danger{ background:#ff6b6b; color:#1b0b0b }
table{ width:100%; border-collapse:collapse; margin-top:14px }
th,td{ text-align:left; padding:10px 8px; border-bottom:1px solid rgba(255,255,255,.06) }
.right{ margin-left:auto }
.flash{ background:#10213f; border:1px solid #21407a; padding:10px 12px; border-radius:10px; margin:8px 0 }
.small{ font-size:12px; color:var(--muted) }
code{ background:#0e1430; padding:2px 6px; border-radius:6px }
.grid{ display:grid; grid-template-columns:1fr; gap:18px }
.pre{ white-space:pre-wrap; background:#0e1430; padding:12px; border-radius:12px; border:1px solid rgba(255,255,255,.08); }