#opponent { margin-block: 0 12px; }
.supply { align-items: center; }
.supply h2 { flex-basis: 100%; font-size: 1rem; text-align: center; margin: 0; }
.supply .active-player { color: var(--accent); }
.supply .playing-card { width: clamp(34px, 6vw, 60px); }
#challenge:empty { display: none; }
.solitaire-board .card-row .covered { place-content: start; padding: 4px 1px; }
.card-row .covered .card-rank, .card-row .covered .card-suit { font-size: clamp(10px, 1.6vw, 17px); }
#status {
  margin: 8px 0 0;
  padding: .45em .75em;
  border: 2px solid var(--accent);
  border-radius: var(--radius);
  background: var(--wash);
  text-align: center;
  font-weight: 700;
}
.supply { border: 2px solid transparent; border-radius: var(--radius); padding: 4px; }
.supply.current-side { border-color: var(--accent); }

.playing-card.stacked {
  box-shadow: 2px 2px var(--paper), 3px 3px var(--accent);
}

.playing-card.computer-move-target {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
button.playing-card.computer-move-target:disabled { opacity: 1; }
.playing-card.computer-move-flight {
  position: fixed;
  z-index: 30;
  margin: 0;
  pointer-events: none;
}

:is(#opponent, #supply) { align-items: start; }
:is(#opponent, #supply) > div:not(.personal-actions) {
  flex: 0 1 min(7em, calc((100% - 16px) / 3));
  min-width: 0;
  text-align: center;
}
#supply > .personal-actions { flex-basis: 100%; }
#move-log { margin-block-start: 12px; }
#move-log summary { cursor: pointer; }
#move-log-list { padding-inline-start: 1.5em; }

.second-deck-back { --second-deck-ink: #a21832; }
[data-theme="contrast"] .second-deck-back { --second-deck-ink: #830019; }
button.stock-card.has-stock.second-deck-back:not(.tile) {
  background: repeating-linear-gradient(-45deg, var(--second-deck-ink) 0 3px, var(--wash) 3px 5px);
  outline-color: var(--second-deck-ink);
  box-shadow: 2px 2px var(--paper), 3px 3px var(--second-deck-ink),
    4px 4px var(--paper), 5px 5px var(--second-deck-ink);
}
.playing-card.stacked.second-deck-back {
  box-shadow: 2px 2px var(--paper), 3px 3px var(--second-deck-ink);
}

.playing-card.awaiting-computer-card { visibility: hidden; }

#stop-notice {
  border: 2px solid var(--accent);
  border-radius: var(--radius);
  padding: .5em;
  text-align: center;
  font-weight: 750;
  background: var(--wash);
}
button.playing-card.stop-preview:disabled { opacity: 1; }

#acknowledge-stop { display: block; margin: 0 auto 8px; }

.computer-turn button.playing-card:disabled,
button.playing-card.computer-move-flight:disabled { opacity: 1; }

.confirm-game-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 8px;
}

#propose-settlement { display: block; margin: 8px auto 0; }
#settlement-notice { margin: 8px 0 0; text-align: center; }