/* Persistent navigation layer copied by src/build.mjs. */
.cover-slide::before {
  background:
    linear-gradient(90deg, rgba(8,18,26,.9) 0%, rgba(8,18,26,.78) 43%, rgba(8,18,26,.26) 66%, rgba(8,18,26,.08) 100%),
    linear-gradient(0deg, rgba(5,12,18,.48) 0%, transparent 34%, rgba(5,12,18,.14) 100%);
}

.cover-wordmark {
  top: 4.8vh;
  right: 4.8vw;
  width: clamp(220px, 20vw, 380px);
}

.cover-copy {
  left: 5.2vw;
  top: 7.6vh;
  width: min(52vw, 980px);
}

.cover-copy h1 {
  margin: 1.6vh 0 1.3vh;
  font-size: clamp(46px, 4.75vw, 90px);
  line-height: .96;
}

.cover-subtitle { font-size: clamp(15px, 1.12vw, 22px); }

.cover-index {
  width: 100%;
  margin-top: 3.6vh;
}

.cover-index-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 1.2vh;
  padding-bottom: 1vh;
  border-bottom: 1px solid rgba(255,248,235,.32);
}

.cover-index-heading span {
  color: #f3d4a0;
  font-size: clamp(10px, .68vw, 13px);
  font-weight: 700;
  letter-spacing: .16em;
}

.cover-index-heading strong {
  color: rgba(255,248,235,.68);
  font-size: clamp(11px, .74vw, 14px);
  font-weight: 500;
}

.cover-index-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65vh .6vw;
}

.cover-index-card {
  display: grid;
  grid-template-columns: 2.2vw minmax(0, 1fr) auto;
  align-items: center;
  min-height: 5.45vh;
  padding: .65vh .8vw;
  border: 1px solid rgba(255,248,235,.16);
  border-left: 3px solid var(--accent);
  border-radius: 7px;
  background: rgba(5,12,18,.43);
  color: #fff8eb;
  text-align: left;
  cursor: pointer;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}

.cover-index-card:hover,
.cover-index-card:focus-visible {
  transform: translateX(4px);
  border-color: color-mix(in srgb, var(--accent) 58%, rgba(255,255,255,.16));
  background: rgba(5,12,18,.66);
  outline: none;
}

.cover-index-number {
  color: var(--accent);
  font-size: clamp(11px, .72vw, 14px);
  font-weight: 800;
}

.cover-index-card strong {
  overflow: hidden;
  font-size: clamp(12px, .87vw, 17px);
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cover-index-card small {
  margin-left: .6vw;
  color: rgba(255,248,235,.58);
  font-size: clamp(9px, .6vw, 12px);
  white-space: nowrap;
}

#prev-button,
#next-button { min-width: 84px; }

#home-button {
  min-width: 86px;
  color: #fff8eb;
}

.deck-controls[data-scope="cover"] #prev-button,
.deck-controls[data-scope="cover"] #home-button,
.deck-controls[data-scope="cover"] #page-indicator,
.deck-controls[data-scope="cover"] #next-button { display: none; }

@media (max-width: 900px), (orientation: portrait) {
  .cover-wordmark { top: 3.5vh; right: 5vw; width: clamp(138px, 34vw, 250px); }
  .cover-copy { top: 9vh; left: 5vw; width: 90vw; }
  .cover-copy h1 { font-size: clamp(42px, 10vw, 72px); }
  .cover-subtitle { max-width: 74vw; font-size: clamp(12px, 2.7vw, 18px); }
  .cover-index { margin-top: 3vh; }
  .cover-index-grid {
    grid-template-columns: 1fr;
    max-height: 39vh;
    padding-right: 5px;
    overflow-y: auto;
  }
  .cover-index-card { grid-template-columns: 34px minmax(0, 1fr) auto; min-height: 42px; padding: 7px 10px; }
  .cover-index-card strong { font-size: clamp(12px, 3.2vw, 16px); }
  .cover-index-card small { font-size: 10px; }
  #prev-button,
  #next-button { min-width: 68px; font-size: 12px; }
  #home-button { min-width: 70px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .cover-index-card { transition: none; }
}
