:root{ --container-w:1100px; --gap:16px; }
.container{ max-width:var(--container-w); margin:0 auto; padding:16px; }
.card{ background: var(--card, rgba(20,20,26,.95)); border:1px solid rgba(0,150,136,.18); border-radius:16px; padding:24px; box-shadow:0 20px 60px rgba(0,0,0,.35); }
.card + .card{ margin-top:16px; }
h1,h2,h3{ margin:0 0 12px 0; }
form .row{ display:grid; grid-template-columns:1fr; gap:12px; }
label{ opacity:.9; font-size:.95rem; }
input[type=text],input[type=password],input[type=email],input[type=number]{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); color: var(--fg,#e7e7ea); }
input:focus{ outline:none; border-color: rgba(0,150,136,.5); box-shadow:0 0 0 3px rgba(0,150,136,.15); }
.btn{ display:inline-block; padding:10px 14px; border-radius:10px; text-decoration:none; cursor:pointer; }
.btn-primary{ background:#009688; color:#fff; }
.btn-ghost{ background:transparent; border:1px solid rgba(255,255,255,.14); color:#e7e7ea; }
.actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.table{ width:100%; border-collapse:collapse; }
.table th,.table td{ padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.08); text-align:left; }
.muted{ opacity:.75; }
.notice{ padding:10px 12px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background: rgba(255,255,255,.05); }
@media (max-width:760px){ .container{ padding:12px; } .card{ padding:18px; } }