:root{ --bg:#0b1020; --fg:#f7f8fb; --accent:#62d3ff; --muted:#a6afc3; }
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;color:var(--fg);background:#000}
.bg{position:fixed;inset:0;background:radial-gradient(1000px 600px at 20% 10%,#1c2a55 0%,transparent 60%),radial-gradient(900px 500px at 80% 70%,#10304a 0%,transparent 60%),linear-gradient(180deg,#04060d,#0b1020 60%,#04060d 100%);filter:saturate(110%);z-index:-1}
.site-header{display:flex;justify-content:space-between;align-items:center;padding:18px 28px}
.menu{display:flex;gap:10px;flex-wrap:wrap}
.btn{padding:10px 14px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);border-radius:12px;color:var(--fg);text-decoration:none;cursor:pointer;backdrop-filter:blur(6px)}
.btn:hover{border-color:rgba(255,255,255,.35)}
.btn-primary{border-color:transparent;background:linear-gradient(90deg,#3da9f5,#62d3ff)}
.hero{display:grid;place-items:center;height:70vh;text-align:center;padding:0 20px}
.hero h2{font-size:clamp(28px,4vw,44px);margin:.2em 0}
.hero p{color:var(--muted)}
.site-footer{padding:20px;text-align:center;color:var(--muted)}
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}
.card{width:min(480px,94vw);background:rgba(9,14,30,.8);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:20px 22px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.card h1{margin-top:0}
label{display:block;margin:12px 0 6px;color:#cfd7ef}
input,select{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.05);color:var(--fg)}
input:focus,select:focus{outline:none;border-color:var(--accent)}
.w-100{width:100%}
.alert{background:#2a1730;border:1px solid #a74786;color:#ffd4f0;padding:10px;border-radius:10px;margin-bottom:10px}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-bottom:1px solid rgba(255,255,255,.15)}
.content{padding:22px}
.muted{color:var(--muted)}

/* admin table */
.table{width:100%;border-collapse:collapse;margin-top:14px}
.table th,.table td{padding:10px;border-bottom:1px solid rgba(255,255,255,.15)}