:root {
  --bg:#f3f6fb;
  --bg-accent:#eaf1ff;
  --fg:#0f172a;
  --muted:#64748b;
  --card:#ffffff;
  --border:#dbe5f2;
  --shadow:0 8px 24px rgba(15,23,42,.07);
  --header-grad:linear-gradient(90deg,#0f172a 0%, #1e3a8a 55%, #2563eb 100%);
}
:root[data-theme='dark'] {
  --bg:#0b1220;
  --bg-accent:#0f1b35;
  --fg:#e5e7eb;
  --muted:#9fb0c7;
  --card:#111827;
  --border:#233047;
  --shadow:0 10px 28px rgba(0,0,0,.35);
  --header-grad:linear-gradient(90deg,#111827 0%, #172554 55%, #1d4ed8 100%);
}
* { box-sizing: border-box; }
body {
  margin:0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  background:
    radial-gradient(1200px 500px at 0% -10%, var(--bg-accent), transparent 70%),
    var(--bg);
  color:var(--fg);
}
header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 20px;
  border-bottom:1px solid #ffffff22;
  background:var(--header-grad);
  color:#fff;
  position:sticky;
  top:0;
  z-index:20;
  box-shadow:0 4px 18px rgba(0,0,0,.18);
}
.brand {
  font-weight:800;
  letter-spacing:.2px;
  display:flex;
  align-items:center;
  gap:10px;
}
.brand-logo {
  height:38px;
  width:auto;
  border-radius:6px;
  background:#ffffff;
  padding:2px 4px;
}
nav a {
  margin-right:12px;
  color:#eaf2ff;
  text-decoration:none;
  padding:6px 10px;
  border-radius:8px;
}
nav a:hover { background:#ffffff1a; }
main { padding:22px; max-width:1400px; margin:0 auto; width:100%; flex:1; }
h2 { margin-top:0; }
.dashboard-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.export-btn {
  text-decoration:none;
  font-size:13px;
  font-weight:600;
  padding:8px 12px;
  border-radius:10px;
  border:1px solid #60a5fa;
  color:#1d4ed8;
  background:linear-gradient(180deg,#eff6ff,#dbeafe);
  box-shadow:0 4px 12px rgba(37,99,235,.15);
}
.export-btn:hover { filter:brightness(1.03); }
:root[data-theme='dark'] .export-btn {
  color:#dbeafe;
  border-color:#3b82f6;
  background:linear-gradient(180deg,#1e3a8a,#1d4ed8);
}
.toolbar, form { display:flex; flex-wrap:wrap; gap:10px; align-items:end; margin-bottom:16px; }
label { display:flex; flex-direction:column; font-size:12px; gap:4px; color:var(--muted); }
input, select, button {
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--card);
  color:var(--fg);
}
button {
  cursor:pointer;
  background:linear-gradient(180deg,#ffffff,#f6f9ff);
}
:root[data-theme='dark'] button {
  background:linear-gradient(180deg,#1f2937,#111827);
}
button:hover { transform:translateY(-1px); }
section {
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  margin-bottom:14px;
  box-shadow:var(--shadow);
}
.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:14px; }
@media (max-width: 900px){ .grid2 { grid-template-columns: 1fr; } }
@media (max-width: 1100px){
  .dashboard-head { align-items:flex-start; flex-direction:column; }
  .export-btn { width:100%; text-align:center; }
  .desktop-table { display:none !important; }
  .mobile-list { display:flex !important; flex-direction:column; gap:8px; }
}
.cohort-grid { display:grid; grid-template-columns: 1fr; gap:14px; }
.cohort-box { border-width:2px; }
.mobile-list { display:none; }
.mobile-item {
  border:1px solid var(--border);
  border-radius:10px;
  padding:8px 10px;
  background:var(--card);
}
.mi-title { font-weight:600; font-size:13px; }
.mi-sub { color:var(--muted); font-size:12px; margin-top:2px; }
.mi-time { font-size:12px; margin-top:4px; }
.cohort-box h3 { margin:0 0 10px 0; font-size:16px; }
.cohort-box.diagnostic { border-color:#2563EB; }
.cohort-box.roadroute { border-color:#16A34A; }
.cohort-box.notworking { border-color:#FACC15; }
.cohort-box.interventional { border-color:#EF4444; }
.cohort-box.shared { border-color:#A855F7; }
table {
  width:100%;
  border-collapse: separate;
  border-spacing:0;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
}
thead th {
  background:linear-gradient(180deg, #f8fbff, #eef4ff);
}
:root[data-theme='dark'] thead th {
  background:linear-gradient(180deg, #1f2937, #111827);
}
th, td {
  border-bottom:1px solid var(--border);
  text-align:left;
  padding:9px 10px;
  font-size:13px;
  vertical-align:top;
}
tbody tr:hover { background:#2563eb0d; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size:11px; }
.flash-wrap { margin-bottom:12px; }
.flash { padding:8px 10px; border-radius:10px; margin-bottom:6px; }
.flash.ok { background:#16a34a22; border:1px solid #16a34a66; }
.flash.error { background:#ef444422; border:1px solid #ef444466; }
.note { color:var(--muted); margin-bottom:10px; }

.matrix-wrap {
  overflow:auto;
  position: relative;
  height:72vh;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--card);
}
.matrix-table {
  min-width:1200px;
  border:none;
  border-collapse: separate;
  border-spacing: 0;
  overflow: visible;
}
.matrix-table th, .matrix-table td { font-size:11px; min-width:60px; max-width:150px; padding:5px 6px; }
.matrix-table thead th {
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--card);
}
.matrix-table .day-col { text-align:center; min-width:36px; }
.matrix-table .weekend-col { background:#e8efff !important; color:#1e3a8a; }
:root[data-theme='dark'] .matrix-table .weekend-col { background:#243247 !important; color:#dbeafe; }
.matrix-table .sticky-col,
.matrix-table tr > th:first-child,
.matrix-table tr > td:first-child {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--card);
  min-width: 190px;
  box-shadow: 2px 0 0 var(--border);
}
.matrix-table thead .sticky-col,
.matrix-table thead tr > th:first-child {
  z-index: 8;
  top: 0;
}
.matrix-table .name-col { font-weight:600; }
.matrix-table .cell { white-space:normal; line-height:1.1; }
.matrix-table .weekend-cell { background:#f6f9ff; }
:root[data-theme='dark'] .matrix-table .weekend-cell { background:#1a2740; }
.pill {
  display:inline-block;
  font-size:10px;
  padding:2px 5px;
  margin:1px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#f8fafc;
}
:root[data-theme='dark'] .pill { background:#1f2937; }
.pill.assign { border-color:#93c5fd; }
.pill.person { border-color:#fca5a5; }
.pill.pill-diagnostic { border-color:#60a5fa; background:#dbeafe; }
.pill.pill-roadroute { border-color:#4ade80; background:#dcfce7; }
.pill.pill-notworking { border-color:#facc15; background:#fef9c3; }
.pill.pill-interventional { border-color:#f87171; background:#fee2e2; }
.pill.pill-shared { border-color:#c084fc; background:#f3e8ff; }
:root[data-theme='dark'] .pill.pill-diagnostic { background:#1e3a8a55; border-color:#60a5fa; }
:root[data-theme='dark'] .pill.pill-roadroute { background:#16653466; border-color:#4ade80; }
:root[data-theme='dark'] .pill.pill-notworking { background:#a1620766; border-color:#facc15; }
:root[data-theme='dark'] .pill.pill-interventional { background:#7f1d1d66; border-color:#f87171; }
:root[data-theme='dark'] .pill.pill-shared { background:#581c8766; border-color:#c084fc; }
.cohort-row td {
  font-size:11px;
  font-weight:700;
  letter-spacing:.3px;
  color:var(--muted);
  background:#eef4ff;
}
:root[data-theme='dark'] .cohort-row td { background:#172554; }

.page-footer {
  text-align:right;
  font-size:11px;
  letter-spacing:.2px;
  color: rgba(15, 23, 42, 0.45);
  border-top:1px solid var(--border);
  padding:8px 16px;
  background:transparent;
}
:root[data-theme='dark'] .page-footer {
  color: rgba(226,232,240,0.45);
}

.auth-shell {
  width:100%;
  max-width:560px;
  margin:48px auto;
  padding:0 12px;
  position:relative;
  z-index:2;
}
.auth-card {
  padding:20px;
}
.auth-brand {
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}
.auth-brand h2 { margin:0; }
.auth-form { margin-top:8px; }

.auth-page { overflow:hidden; }
.auth-bg {
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:1;
}
.float-oval {
  position:absolute;
  width:56px;
  height:22px;
  border-radius:999px;
  border:none;
  opacity:.28;
  filter:blur(.2px);
  animation: drift 18s ease-in-out infinite alternate;
}
.float-oval.o1 { left:8%; top:18%; background:#60a5fa; animation-duration:13s; }
.float-oval.o2 { left:26%; top:72%; background:#4ade80; animation-duration:11.5s; }
.float-oval.o3 { left:48%; top:28%; background:#facc15; animation-duration:12.5s; }
.float-oval.o4 { left:68%; top:62%; background:#f87171; animation-duration:10.5s; }
.float-oval.o5 { left:82%; top:22%; background:#c084fc; animation-duration:14s; }
.float-oval.o6 { left:38%; top:52%; background:#93c5fd; animation-duration:11.8s; }
.float-oval.o7 { left:14%; top:44%; background:#34d399; animation-duration:12.8s; }
.float-oval.o8 { left:56%; top:78%; background:#fbbf24; animation-duration:10.2s; }
.float-oval.o9 { left:74%; top:38%; background:#a78bfa; animation-duration:12.2s; }
.float-oval.o10 { left:90%; top:68%; background:#38bdf8; animation-duration:10.9s; }
.float-oval.o11 { left:6%; top:82%; background:#22d3ee; animation-duration:11.3s; }
.float-oval.o12 { left:44%; top:12%; background:#fb7185; animation-duration:12s; }
.float-oval.o13 { left:62%; top:46%; background:#86efac; animation-duration:10.7s; }
.float-oval.o14 { left:88%; top:14%; background:#fcd34d; animation-duration:13.2s; }

@keyframes drift {
  0% { transform: translate(0,0) scale(1); }
  50% { transform: translate(18px,-14px) scale(1.04); }
  100% { transform: translate(-16px,16px) scale(.98); }
}

@media (prefers-reduced-motion: reduce) {
  .float-oval { animation: none; }
}