:root{
  --bg:#fff7ed; --card:#ffffff; --text:#1f2937; --muted:#64748b; --brand:#10b981; --brand-2:#06b6d4; --accent:#f59e0b;
  --success:#16a34a; --danger:#dc2626; --border:#e5e7eb; --ring:#67e8f9;
}
*{box-sizing:border-box} html,body{height:100%}
body{font-family:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  margin:0;background:var(--bg);color:var(--text);line-height:1.45}
a{color:var(--brand-2);text-decoration:none} a:hover{text-decoration:underline}
header{
  background: radial-gradient(1200px 500px at 10% -10%, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 60%),
              linear-gradient(90deg, var(--brand) 0%, var(--brand-2) 60%, #60a5fa 100%);
  color:#fff; padding:16px 18px; display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.25);
}
header .brand{font-weight:800;letter-spacing:.2px;font-size:18px}
header nav a{color:#fff;opacity:.95;margin-left:12px} header nav a:hover{opacity:1;text-decoration:underline}
main{padding:24px;max-width:1100px;margin:0 auto}
.hero{position:relative;overflow:hidden;border-radius:16px;background:conic-gradient(from 140deg at 40% 20%,#fff 0%,#fff 20%,#e0f2fe 35%,#fef3c7 55%,#dcfce7 75%,#fff 100%);
  padding:28px;margin:14px 0 18px;border:1px solid var(--border);box-shadow:0 8px 20px rgba(16,185,129,.12)}
.hero h1{margin:0 0 6px;font-size:clamp(24px,2.6vw,34px)} .hero p{margin:0;color:#334155} .hero .cta{margin-top:14px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin:12px 0;box-shadow:0 6px 16px rgba(2,132,199,.06)}
.badge{display:inline-block;background:#ecfeff;color:#0e7490;border:1px solid #a5f3fc;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.2px}
label{display:block;margin:10px 0 6px;font-size:14px;color:#334155}
input,select{width:100%;padding:12px;border-radius:12px;border:1px solid var(--border);background:#fff;color:var(--text);outline:none;transition:box-shadow .15s,border-color .15s}
input:focus,select:focus{border-color:var(--brand-2);box-shadow:0 0 0 4px rgba(103,232,249,.35)}
button,.btn{background:linear-gradient(180deg,var(--brand-2),#0891b2);color:#fff;padding:12px 16px;border:0;border-radius:12px;cursor:pointer;font-weight:700;box-shadow:0 4px 12px rgba(6,182,212,.3)}
button:hover,.btn:hover{transform:translateY(-1px)}
.btn-secondary{background:#fff;color:#0f172a;border:1px solid var(--border);box-shadow:0 2px 8px rgba(2,6,23,.06)}
.btn-warning{background:linear-gradient(180deg,var(--accent),#d97706)}
.grid{display:grid;gap:12px} @media (min-width:768px){.grid-2{grid-template-columns:1fr 1fr}}
.notice{background:#ecfdf5;border:1px solid #86efac;padding:12px;border-radius:12px;color:#065f46}
.error{background:#fef2f2;border:1px solid #fecaca;padding:12px;border-radius:12px;color:#991b1b}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}
th,td{padding:12px;font-size:14px} thead tr{background:#f8fafc} tbody tr{border-top:1px solid var(--border)}
.fc .fc-toolbar-title{font-size:18px} .fc .fc-daygrid-day-number{color:#334155}
.fc .fc-event{background:#e0f2fe;border-color:#bae6fd;color:#0369a1;font-weight:600} .fc a{color:#0369a1}
/* Calendar: make "X kits available" text black */
.fc .fc-daygrid-event,
.fc .fc-daygrid-event .fc-event-title,
.fc .fc-daygrid-event .fc-event-time,
.fc .fc-event,
.fc .fc-event .fc-event-main,
.fc .fc-daygrid-event a {
  color: #000 !important;
}
header .brand,
header .brand:visited {
  color: #fff !important;
  text-decoration: none;
}

header .brand:hover {
  opacity: 0.7;
}

header .brand:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
  border-radius: 6px;
}
