/* ZRL Captain – small extras on top of Tailwind CDN */

.prose-tactics h1,
.prose-tactics h2,
.prose-tactics h3 {
  font-family: "Barlow Condensed", system-ui, sans-serif;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #fff;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
}
.prose-tactics h1 { font-size: 1.5rem; }
.prose-tactics h2 { font-size: 1.25rem; color: #3dff9a; }
.prose-tactics h3 { font-size: 1.1rem; color: #c5d0e0; }
.prose-tactics p { margin: 0.5rem 0; line-height: 1.65; color: #c5d0e0; }
.prose-tactics ul,
.prose-tactics ol { margin: 0.5rem 0 0.5rem 1.25rem; color: #c5d0e0; }
.prose-tactics li { margin: 0.25rem 0; }
.prose-tactics strong { color: #fff; }
.prose-tactics code {
  background: rgba(26, 34, 51, 0.9);
  padding: 0.1rem 0.35rem;
  border-radius: 0.25rem;
  font-size: 0.9em;
}

.input-field {
  width: 100%;
  border-radius: 0.5rem;
  border: 1px solid rgba(139, 155, 180, 0.2);
  background: rgba(18, 24, 38, 0.9);
  color: #c5d0e0;
  padding: 0.55rem 0.75rem;
  font-size: 0.875rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.input-field:focus {
  border-color: rgba(61, 255, 154, 0.45);
  box-shadow: 0 0 0 3px rgba(61, 255, 154, 0.12);
}
.input-field::placeholder { color: rgba(139, 155, 180, 0.55); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  border-radius: 0.5rem;
  padding: 0.55rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s, transform 0.1s;
}
.btn:active { transform: translateY(1px); }
.btn-primary {
  background: #3dff9a;
  color: #07090d;
}
.btn-primary:hover { background: #6affb4; box-shadow: 0 0 24px rgba(61,255,154,0.18); }
.btn-ghost {
  background: transparent;
  color: #8b9bb4;
  border: 1px solid rgba(139, 155, 180, 0.2);
}
.btn-ghost:hover { color: #fff; border-color: rgba(139, 155, 180, 0.4); background: rgba(26,34,51,0.6); }
.btn-danger {
  background: rgba(255, 90, 61, 0.12);
  color: #ff8a6b;
  border: 1px solid rgba(255, 90, 61, 0.3);
}
.btn-danger:hover { background: rgba(255, 90, 61, 0.22); }

.cat-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 0.35rem;
  border-radius: 0.35rem;
  font-family: "Barlow Condensed", system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
}
.cat-A { background: rgba(255,90,61,0.2); color: #ff8a6b; }
.cat-B { background: rgba(255,180,60,0.18); color: #ffc14d; }
.cat-C { background: rgba(61,255,154,0.15); color: #3dff9a; }
.cat-D { background: rgba(100,160,255,0.18); color: #7eb6ff; }
.cat-E { background: rgba(180,140,255,0.18); color: #c4a8ff; }
.cat-? { background: rgba(139,155,180,0.15); color: #8b9bb4; }

.status-badge {
  display: inline-flex;
  align-items: center;
  height: 1.35rem;
  padding: 0 0.45rem;
  border-radius: 0.3rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.status-MEMBER { background: rgba(61,255,154,0.12); color: #3dff9a; }
.status-INVITED { background: rgba(255,180,60,0.14); color: #ffc14d; }
.status-PENDING { background: rgba(139,155,180,0.15); color: #8b9bb4; }
.status-DECLINED,
.status-REMOVED { background: rgba(255,90,61,0.14); color: #ff8a6b; }

.avail-yes { color: #3dff9a; }
.avail-maybe { color: #ffc14d; }
.avail-no { color: #ff8a6b; }
.avail-unset { color: #8b9bb4; }

@keyframes fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-up { animation: fade-up 0.45s ease-out both; }
.delay-1 { animation-delay: 0.08s; }
.delay-2 { animation-delay: 0.16s; }
.delay-3 { animation-delay: 0.24s; }