/* assets/styles.css */
:root { --bg:#0f172a; --fg:#e2e8f0; --card:#1e293b; --acc:#38bdf8; --err:#ef4444; }
* { box-sizing: border-box; }
body.container { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; background: var(--bg); color: var(--fg); display:flex; align-items:center; justify-content:center; min-height:100vh; padding:16px; }
.card { width:100%; max-width:380px; background: var(--card); border-radius:16px; padding:24px; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
h1 { margin:0 0 16px; font-size:22px; }
label { display:block; margin:12px 0 6px; font-size:14px; }
input { width:100%; padding:12px; border-radius:10px; border:1px solid #334155; background:#0b1220; color:#e2e8f0; }
button { margin-top:16px; width:100%; padding:12px; border:0; border-radius:10px; background:var(--acc); color:#082f49; font-weight:700; cursor:pointer; }
.error { margin-top:12px; padding:10px; background:#0b1220; border-left:4px solid var(--err); }
.topbar { position: fixed; top:0; left:0; right:0; padding:12px 16px; background:#0b1220; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #1f2937; }
.topbar a { color: var(--fg); margin-left:12px; text-decoration:none; opacity:.85; }
.grid { margin-top:80px; display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:16px; width:100%; max-width:960px; }
.tile { display:block; padding:24px; background: var(--card); border-radius:16px; text-decoration:none; color:var(--fg); border:1px solid #334155; text-align:center; }
form button[type="submit"] {
  padding: 10px 14px;
  border: 0;
  border-radius: 10px;
  background: var(--acc);
  color: #082f49;
  font-weight: 700;
  cursor: pointer;
}