/* Richardson Building — Shared Styles */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --navy:   #0a1628;
  --navy-2: #0f2040;
  --amber:  #d97706;
  --rust:   #b45309;
  --slate:  #475569;
  --cream:  #fef3c7;
  --white:  #f8fafc;
  --muted:  #94a3b8;
  --border: #1e3a5f;
  --green:  #16a34a;
  --red:    #dc2626;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--navy);
  color: var(--white);
  line-height: 1.6;
}

h1, h2, h3, h4 {
  font-family: 'Space Grotesk', sans-serif;
}

.mono {
  font-family: 'JetBrains Mono', monospace;
}

/* Hero gradient — warm construction tones */
.hero-gradient {
  background: linear-gradient(135deg, #0a1628 0%, #1a2f52 40%, #2d1a0e 80%, #1a0e05 100%);
  background-size: 300% 300%;
  animation: heroShift 12s ease infinite;
}

@keyframes heroShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Noise overlay */
.noise::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  opacity: 0.3;
}

/* Amber underline accent */
.amber-underline {
  border-bottom: 2px solid var(--amber);
  padding-bottom: 2px;
}

/* Status pills */
.pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  font-family: 'JetBrains Mono', monospace;
}
.pill-amber  { background: rgba(217,119,6,0.2);  color: #fbbf24; }
.pill-green  { background: rgba(22,163,74,0.2);   color: #4ade80; }
.pill-slate  { background: rgba(71,85,105,0.3);   color: #94a3b8; }
.pill-red    { background: rgba(220,38,38,0.2);   color: #f87171; }
.pill-rust   { background: rgba(180,83,9,0.2);    color: #fb923c; }

/* Pulse animation for deferred badges */
@keyframes pulse-badge {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.55; }
}
.pulse { animation: pulse-badge 2.4s ease-in-out infinite; }

/* Assignment card entry animation */
@keyframes slideIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.assignment {
  animation: slideIn 300ms ease forwards;
}