:root{
  --bg:#0b0f14; --panel:#121824; --card:#161f2e; --text:#e6edf3; --muted:#9aa4b2;
  --accent:#4da3ff; --border: rgba(255,255,255,.08);
}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu; background:var(--bg); color:var(--text)}
.topbar{position:sticky;top:0;display:flex;gap:12px;align-items:center;justify-content:space-between;padding:14px 14px;border-bottom:1px solid var(--border);background:rgba(11,15,20,.9);backdrop-filter: blur(10px)}
.topbar h1{margin:0;font-size:18px}
.sub{color:var(--muted);font-size:12px;margin-top:2px}
.filters{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.chip{padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text);font-weight:700;font-size:12px}
.chip.active{background:rgba(77,163,255,.18);border-color:rgba(77,163,255,.5)}
.btn{border:1px solid var(--border); background:var(--accent); color:#06121f; padding:10px 12px; border-radius:10px; font-weight:700;}
.btn.ghost{background:transparent;color:var(--text)}
.wrap{display:grid;grid-template-columns:1fr;gap:12px;padding:12px}
.col{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:12px;min-height:120px}
.col h2{margin:0 0 10px 0; font-size:14px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em}
.list{display:flex;flex-direction:column;gap:10px}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}
.card .title{font-weight:700;line-height:1.2}
.meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--muted);font-size:12px}
.badge{border:1px solid var(--border);padding:2px 8px;border-radius:999px}
.badge.owner-nico{background:rgba(77,163,255,.15);color:#bfe0ff}
.badge.owner-mat{background:rgba(170,255,170,.12);color:#c9ffd1}
.due{color:#ffd27a}
.actionsRow{display:flex;gap:8px}
.smallBtn{padding:6px 10px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--text);font-weight:600}
.smallBtn.primary{background:rgba(77,163,255,.15);border-color:rgba(77,163,255,.4)}
.dlg{width:min(720px, 96vw); border:1px solid var(--border); border-radius:14px; background:var(--panel); color:var(--text)}
.dlg form{display:flex;flex-direction:column;gap:12px;padding:14px}
.dlg input,.dlg select,.dlg textarea{width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);background:#0d1420;color:var(--text)}
.row{display:grid;grid-template-columns:1fr;gap:10px}
.actions{display:flex;justify-content:flex-end;gap:10px}

@media (min-width: 900px){
  .wrap{grid-template-columns:repeat(3,1fr);align-items:start}
  .row{grid-template-columns:1fr 1fr 1fr}
}

/* Login */
.loginWrap{min-height:100vh;display:grid;place-items:center;padding:18px}
.loginCard{width:min(420px, 96vw);background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:16px}
.loginCard h1{margin:0 0 6px 0;font-size:18px}
.muted{color:var(--muted);margin:0 0 14px 0}
.err{margin-top:12px;color:#ff9a9a}