/* Spot, Act, Report palette.
   Load AFTER ksd-guide-shared.css. All layout, spacing, type and
   breakpoints come from that file — this one only swaps the colour
   roles: yellow becomes the page, cobalt becomes the accent. */

body {
  background: var(--sun);
}

/* ---------------- hero ---------------- */
header.hero {
  color: var(--midnight);
}
.hero-back {
  color: var(--midnight);
}
.pill {
  background: var(--cobalt);
  color: #fff;
}
.hero h1 {
  color: var(--cobalt);
}

/* ---------------- panel ---------------- */
.panel-h {
  background: var(--cobalt);
}
/* The Spot/Act/Report marks are midnight artwork on a transparent
   background, so they need a white chip to read on cobalt. Box size
   and spacing stay exactly as ksd-guide-shared.css sets them. */
.panel-h .mark {
  object-fit: contain;
  height: 110px;
}
.pic {
  background: var(--sky-pale);
  color: var(--cobalt-deep);
}

/* ---------------- sheet ---------------- */
.eitem .eic {
  background: var(--sky-pale);
  color: var(--cobalt-deep);
}

/* ---------------- guide index ---------------- */
.index-page {
  background: var(--sun);
}
.index-hero {
  color: var(--midnight);
}
.index-hero h1 {
  color: var(--cobalt);
}