* { box-sizing: border-box; }
:root { color-scheme: dark; font-family: 'Segoe UI', sans-serif; background: #090b11; color: #eef0f8; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 20% 0%, #1a1740, transparent 45%), #090b11; }
.page { width: min(760px, 100%); margin: auto; padding: 8vh 20px; }
.panel { padding: 32px; border: 1px solid #303348; border-radius: 16px; background: rgba(20, 23, 36, .92); box-shadow: 0 20px 70px rgba(0,0,0,.35); }
[hidden] { display: none !important; }
.eyebrow { color: #17e6d0; font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; }
h1 { margin: 8px 0; font-size: 32px; } h2 { margin-top: 30px; font-size: 18px; }
p { color: #9aa0b4; line-height: 1.5; }
form { display: grid; gap: 14px; margin-top: 24px; } label { display: grid; gap: 7px; color: #b8bdd0; font-size: 13px; font-weight: 600; }
input { padding: 12px; border: 1px solid #3a3e55; border-radius: 8px; background: #11131d; color: #fff; font: inherit; } input:focus { outline: 2px solid #17e6d0; }
button { border: 0; border-radius: 8px; padding: 11px 16px; background: #7054ed; color: white; cursor: pointer; font-weight: 700; } button:hover { filter: brightness(1.12); }
.secondary, .danger { padding: 8px 11px; background: #292d40; font-size: 12px; } .danger { background: #542936; }
.heading-row, .user-row { display: flex; align-items: center; gap: 10px; } .heading-row { justify-content: space-between; }
.user-row { padding: 12px 0; border-top: 1px solid #2b2f43; } .user-row strong { flex: 1; } .user-row span { color: #35e08a; font-size: 12px; }
.message { min-height: 20px; margin-top: 12px; color: #35e08a; font-size: 13px; } .message.error { color: #ff7080; } .muted { color: #656c83; }