/* Duke edition: same components as styles.css, recolored in Duke Blue and Duke Navy.
   Colors only. No Duke logos, marks or fonts (those need trademark approval). */
:root {
  --navy: #012169;     /* Duke Navy */
  --blue: #00539B;     /* Duke Blue */
  --primary: var(--blue);
  --link: #00539B;
  --sky: #E3ECF7;
  --sun: #FFD960;      /* warm accent for stickers, bubbles and picked buttons */
  --tint: #C9DBF0;     /* light blue for classes, icon tiles and notes */
  --tint-2: #A9C4E6;
}
@media (prefers-color-scheme: dark) {
  :root { --link: #8FB8E8; --sky: #18294A; }
  :focus-visible { outline-color: #8FB8E8; }
  .typer-live::after { background: #8FB8E8; }
}

/* Duke Blue is dark, so text on it is white. */
.btn-primary, .chip-primary, .tab[aria-selected="true"], .shot-btn, .faq-tag { color: #FFFFFF; }
.shot-btn-quiet { color: var(--text); }

.note-1, .note-6 { background: var(--tint); }
.note-1, .note-6 { --note-bg: var(--tint); }
.note-4 { --note-bg: var(--tint-2); }
.note-5 { --note-bg: var(--sky); }
@media (prefers-color-scheme: dark) { .note-5 { --note-bg: #E3ECF7; } }
.note a { color: #00396B; }

/* Stats band: navy with light-blue numbers (Duke Blue is too dark on navy). */
.stats b { color: #9FC2EC; }

/* Nav wordmark: plain calendar icon + name. */
.wordmark { display: inline-flex; align-items: center; gap: var(--space-3); font-weight: 900; font-size: var(--text-lg); letter-spacing: -0.02em; color: var(--text); text-decoration: none; }
.nav .wordmark img { height: 36px; width: 36px; }


/* Example prompts: two per row on wide screens. */
.prompts-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }

/* Registration dates band at the very top: navy, like the stats band. */
.band { background: var(--navy); color: #FFFFFF; font-size: var(--text-sm); border-bottom: 3px solid #111418; }
.band-inner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); padding-top: var(--space-3); padding-bottom: var(--space-3); }
.band b { padding: 2px 10px; background: var(--sun); color: #111418; border: 2px solid #111418; border-radius: 6px; font-weight: 900; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; }
.band span { color: rgb(255 255 255 / 88%); }
.band span + span::before { content: "\25C6"; margin-right: var(--space-5); color: #9FC2EC; font-size: 9px; vertical-align: 1px; }
.band a { margin-left: auto; color: #FFFFFF; font-weight: 700; }
@media (max-width: 640px) { .band span + span::before { display: none; } .band a { margin-left: 0; } }

.eyebrow-pill { display: inline-block; padding: 4px 14px; background: var(--blue); color: #FFFFFF; border: var(--border-thin); border-radius: var(--radius-pill); box-shadow: 2px 2px 0 var(--ink); font-weight: 800; font-size: 15px; transform: rotate(-2deg); }

/* Example week in Duke colors. Course codes are longer here (COMPSCI 201), so a touch smaller (they wrap after the subject). */
.cls { font-size: 11.5px; letter-spacing: -0.02em; }
.cls-a { background: var(--blue); color: #FFFFFF; }
.cls-b { background: var(--tint); }
.cls-c { background: var(--sun); }
.cls-d { background: #B9DCDC; }
.tile-sky { background: var(--tint); }
@media (max-width: 600px) { .cls { white-space: normal; text-overflow: clip; padding: 2px 3px; font-size: 9.5px; letter-spacing: -0.04em; } .cls small { font-size: 9.5px; } }