:root{
  --bg:#0b1020;
  --card:#121a33;
  --fg:#e8eefc;
  --muted:#a9b4d0;
  --border:rgba(255,255,255,.10);
  --accent:#7aa2ff;
  --danger:#ff6b6b;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Noto Sans",Arial}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:980px;margin:0 auto;padding:16px}
.header{border-bottom:1px solid var(--border);background:rgba(255,255,255,.04)}
.header-row{display:flex;align-items:center;gap:16px}
.brand{font-weight:800;color:var(--fg)}
.nav{display:flex;gap:12px;flex:1}
.logout{margin:0}

.footer{margin-top:48px;border-top:1px solid var(--border);color:var(--muted)}

.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:16px}
.tile{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;display:block}
.tile-title{font-weight:700;margin-bottom:6px}
.tile-desc{color:var(--muted);font-size:14px}

.form{display:flex;flex-direction:column;gap:12px;margin-top:12px}
label{display:flex;flex-direction:column;gap:6px;color:var(--muted)}
input{padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:#0e1530;color:var(--fg)}
.btn{padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--accent);color:#08102a;font-weight:700;cursor:pointer}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-ghost{background:transparent;color:var(--fg)}
.warn{color:#ffd166}
.error{color:var(--danger)}
.muted{color:var(--muted)}