:root{ --bg:#0b0e14; --card:#111826; --ink:#e7eefb; --mut:#93a2b7; --pri:#3b82f6; }
*{ box-sizing:border-box; }
body.container{ background:var(--bg); color:var(--ink); font:14px/1.5 system-ui,Segoe UI,Roboto; margin:0; padding:24px; }
.card{ max-width:420px; margin:60px auto; background:var(--card); padding:24px; border-radius:16px; box-shadow:0 8px 24px #0006; }
h1,h3{ margin:0 0 12px; }
label{ display:block; margin:12px 0; }
input,select,textarea{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid #2b3446; background:#0e1420; color:var(--ink); }
button,.btn{ background:var(--pri); border:0; color:white; padding:10px 14px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; }
.alert.error{ background:#3b1d2a; color:#ffd1d1; padding:8px 10px; border-radius:10px; }
header nav a{ color:var(--ink); margin-right:12px; text-decoration:none; }
.grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.tile{ background:var(--card); padding:16px; border-radius:14px; }
.grid2{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.table, .grid table{ width:100%; }
.grid table, table.grid{ width:100%; background:var(--card); border-radius:14px; overflow:hidden; border-collapse:collapse; }
.grid th, .grid td, table.grid th, table.grid td{ padding:8px 10px; border-bottom:1px solid #223; }
.pager a{ color:var(--ink); padding:6px 10px; margin-right:6px; border:1px solid #2b3446; border-radius:8px; text-decoration:none; }
.pager a.active{ background:var(--pri); }