:root {
  --bg: #0f172a;
  --card: #111827;
  --text: #e5e7eb;
  --muted: #9ca3af;
  --accent: #60a5fa;
  --danger: #f87171;
  --ok: #34d399;
  --border: #1f2937;
}

* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background: var(--bg); color: var(--text); }
a { color: var(--accent); text-decoration: none; }

.topbar {
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 16px; background:#0b1220; border-bottom:1px solid var(--border);
}
.brand a { font-weight:700; color:#fff; }
nav a { margin-left:12px; }

.content { max-width: 1100px; margin: 20px auto; padding: 0 16px; }

.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: 0 10px 20px rgba(0,0,0,.2);
}

form .row { display:flex; gap:12px; margin-bottom: 12px; flex-wrap:wrap; }
form label { display:block; font-size: 14px; color: var(--muted); margin-bottom: 6px; }
input[type="text"], input[type="email"], input[type="password"], input[type="date"], textarea, select {
  width: 100%; padding:10px 12px; border-radius:10px; border:1px solid var(--border); background:#0b1220; color:var(--text);
}
textarea { min-height: 120px; }

.btn { display:inline-block; padding:10px 14px; border-radius: 12px; border:1px solid var(--border); background:#0b1220; color:var(--text); cursor:pointer; }
.btn.primary { background: var(--accent); color:#0b1220; border-color: transparent; font-weight:700; }
.btn.danger { background: var(--danger); color:#0b1220; border-color: transparent; font-weight:700; }

.footer { padding: 24px 0 40px; border-top:1px solid var(--border); margin-top: 40px; }
.footer-inner { text-align: center; color: var(--muted); }
.footer .sep { margin: 0 8px; }

/* Calendar grid */
.calendar-nav { display:flex; justify-content:space-between; align-items:center; margin-bottom: 12px; }
.calendar-grid {
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
}
.day-header { text-align:center; font-weight:700; color: var(--muted); padding: 6px 0; }
.day-cell {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 8px;
  min-height: 120px;
  display:flex; flex-direction:column;
}
.day-number { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.event { background:#0b1220; border:1px solid var(--border); border-radius:10px; padding:6px 8px; margin-bottom:6px; }
.event .title { font-weight:600; }
.event .author { font-size: 12px; color: var(--muted); }
.day-actions { margin-top:auto; }
.add-link { font-size:12px; }
.empty { color: var(--muted); font-size: 12px; }