/* Project Dynasty — Season Preview room styles (2026-10-11).
 *
 * The "Preview vs Reality" room and its per-season section: the committed
 * season preview's 32 projected records beside the verified actual records,
 * the projected bracket beside the real postseason, and the projection
 * provenance badge. Vault vocabulary, scoped under .pd-hw like the rest of
 * History. Dark theme keeps the vault surface via the same override the
 * season results table uses.
 */

.pd-hw .pd-sp {
  gap: var(--pd-space-5);
}

.pd-hw .pd-sp-provenance {
  display: block;
  padding: 0.65rem 0.95rem;
  border: 1px solid var(--hw-line);
  border-radius: 12px;
  background: var(--hw-raised);
  color: var(--hw-muted);
  font-size: var(--pd-text-xs);
  line-height: 1.5;
}

.pd-hw .pd-sp-provenance b {
  color: var(--hw-muted);
  font-weight: 850;
  letter-spacing: 0.06em;
}

.pd-hw .pd-sp-provenance[data-sp-retro="true"] {
  border-color: var(--hw-gold);
  background: var(--hw-gold-soft);
  color: var(--hw-ink);
}

.pd-hw .pd-sp-provenance[data-sp-retro="true"] b {
  color: var(--hw-gold-ink);
}

.pd-hw .pd-sp-note {
  margin: 0;
  padding: 0.6rem 0.9rem;
  border: 1px dashed var(--pd-border-strong);
  border-radius: 10px;
  color: var(--hw-muted);
  font-size: var(--pd-text-xs);
  line-height: 1.5;
}

.pd-hw .pd-sp-headlines {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: var(--pd-space-3);
}

.pd-hw .pd-sp-headline {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  padding: var(--pd-space-4);
  border: 1px solid var(--hw-vault-line);
  border-radius: 14px;
  background: linear-gradient(160deg, var(--hw-vault-raised), var(--hw-vault-field));
}

.pd-hw .pd-sp-headline small {
  color: var(--hw-vault-muted);
  font-size: 0.64rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pd-hw .pd-sp-headline strong {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  color: var(--hw-vault-ink);
  font-family: var(--pd-font-display);
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  font-weight: 950;
  letter-spacing: -0.02em;
}

.pd-hw .pd-sp-headline strong em {
  font-size: 0.85em;
  font-style: normal;
}

.pd-hw .pd-sp-headline span {
  color: var(--hw-vault-muted);
  font-size: var(--pd-text-xs);
  line-height: 1.5;
}

.pd-hw .pd-sp-headline--over {
  border-color: rgba(217, 178, 94, 0.5);
}

.pd-hw .pd-sp-headline--over strong em {
  color: var(--hw-vault-gold-ink);
}

.pd-hw .pd-sp-headline--collapse strong em {
  color: #e28a80;
}

.pd-hw .pd-sp-subhead {
  margin: var(--pd-space-2) 0 0;
  color: var(--hw-ink);
  font-family: var(--pd-font-display);
  font-size: var(--pd-text-lg);
  font-weight: 900;
  letter-spacing: -0.01em;
}

.pd-hw .pd-sp-table-wrap {
  border: 1px solid var(--hw-line);
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
}

/* The legacy dark-theme History rule forces every .table-wrap white; the
   preview keeps its vault surface in both themes (same override as results). */
html[data-theme="dark"] #history .pd-sp-table-wrap {
  border-color: var(--hw-line);
  background: transparent;
  box-shadow: none;
}

.pd-hw .pd-sp-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 34rem;
}

.pd-hw .pd-sp-table th {
  color: var(--hw-muted);
  font-size: var(--pd-text-xs);
  font-weight: 850;
  letter-spacing: 0.06em;
  text-align: left;
  text-transform: uppercase;
}

.pd-hw .pd-sp-table th,
.pd-hw .pd-sp-table td {
  padding: 0.5rem;
  border-bottom: 1px solid var(--hw-line);
  color: var(--hw-ink);
  background: transparent;
  white-space: nowrap;
}

.pd-hw .pd-sp-table tbody tr {
  background: transparent;
}

.pd-hw .pd-sp-table tbody tr:hover {
  background: var(--hw-gold-soft);
}

.pd-hw .pd-sp-table td b {
  font-weight: 850;
}

.pd-hw .pd-sp-rank {
  color: var(--hw-muted);
  font-size: var(--pd-text-xs);
  font-weight: 850;
}

.pd-hw .pd-sp-table td.pd-sp-projected {
  color: var(--hw-muted);
}

.pd-hw .pd-sp-table td.pd-sp-actual {
  color: var(--hw-ink);
  font-weight: 750;
}

.pd-hw .pd-sp-table td.pd-sp-delta {
  font-weight: 850;
}

.pd-hw .pd-sp-table td.pd-sp-delta.is-over {
  color: var(--hw-gold-ink);
}

.pd-hw .pd-sp-table td.pd-sp-delta.is-under {
  color: var(--hw-muted);
}

.pd-hw .pd-sp-bracket {
  display: grid;
  gap: var(--pd-space-3);
}

.pd-hw .pd-sp-round {
  display: grid;
  gap: var(--pd-space-2);
  padding: var(--pd-space-4);
  border: 1px solid var(--hw-vault-line);
  border-radius: 14px;
  background: linear-gradient(160deg, var(--hw-vault-raised), var(--hw-vault-field));
}

.pd-hw .pd-sp-round h4 {
  margin: 0;
  color: var(--hw-vault-gold-ink);
  font-size: var(--pd-text-xs);
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pd-hw .pd-sp-round__side {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}

.pd-hw .pd-sp-round__side small {
  color: var(--hw-vault-muted);
  font-size: 0.62rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pd-hw .pd-sp-round__side ul {
  display: grid;
  gap: 0.3rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pd-hw .pd-sp-game {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--hw-vault-line);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--hw-vault-ink);
  font-size: var(--pd-text-xs);
}

.pd-hw .pd-sp-game b {
  margin-left: auto;
  color: var(--hw-vault-gold-ink);
  font-weight: 850;
}

.pd-hw .pd-sp-game em {
  color: var(--hw-vault-muted);
  font-style: normal;
}

.pd-hw .pd-sp-game.is-empty {
  border-style: dashed;
  color: var(--hw-vault-muted);
}

.pd-hw .pd-sp-champions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: var(--pd-space-3);
}

.pd-hw .pd-sp-champions > span {
  display: grid;
  gap: 0.15rem;
  padding: var(--pd-space-3) var(--pd-space-4);
  border: 1px solid var(--hw-vault-line);
  border-radius: 12px;
  background: linear-gradient(160deg, var(--hw-vault-raised), var(--hw-vault-field));
}

.pd-hw .pd-sp-champions small {
  color: var(--hw-vault-muted);
  font-size: 0.62rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pd-hw .pd-sp-champions strong {
  color: var(--hw-vault-ink);
  font-family: var(--pd-font-display);
  font-size: var(--pd-text-xl);
  font-weight: 950;
  letter-spacing: -0.02em;
}

.pd-hw .pd-sp-method {
  margin: 0;
  color: var(--hw-muted);
  font-size: var(--pd-text-xs);
  line-height: 1.55;
}

.pd-hw .pd-sp-method code {
  font-size: 0.9em;
}

@media (min-width: 56.0625rem) {
  .pd-hw .pd-sp-round {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
      "head head"
      "projected actual";
  }

  .pd-hw .pd-sp-round h4 { grid-area: head; }
  .pd-hw .pd-sp-round__side:first-of-type { grid-area: projected; }
  .pd-hw .pd-sp-round__side:last-of-type { grid-area: actual; }
}

@media (max-width: 40rem) {
  .pd-hw .pd-sp-table {
    min-width: 30rem;
  }
}

/* ---- Vault entry: preview link beside the season status ------------------- */

.pd-hw .pd-hw-vault-entry__status-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.45rem;
  justify-self: end;
  min-width: 0;
}

.pd-hw .pd-hw-vault-entry__preview {
  min-height: 0;
  padding: 0.3rem 0.7rem;
  font-size: 0.68rem;
}

@media (max-width: 56rem) {
  .pd-hw .pd-hw-vault-entry__status-wrap {
    grid-area: status;
    align-items: flex-start;
    justify-self: start;
  }
}