/*  sk-standby.css — the card that holds the picture until you are ready.
 *  House stock, and deliberately quiet: this is an interruption the player
 *  did not ask for, so it should read as courtesy rather than as an alert. */

.sk-standby {
  position: fixed;
  inset: 0;
  /* Above everything the play chrome puts on a stage. sk-phase2.css floats the
     accessibility button at 99990 and the first-run help scrim at 99998; a
     standby card underneath either of those is a card the player can shoot
     past, which is the one thing it must not be. */
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  padding-bottom: max(1.5rem, env(safe-area-inset-bottom, 0px));
  background: rgba(8, 6, 4, .90);
  /* The card swallows the taps and keys that would otherwise be played into a
     picture the player has not looked at yet. It does not stop the picture —
     an overlay stops nothing — so sk-standby.js holds the frames as well. */
  touch-action: none;
  cursor: pointer;
}
.sk-standby.is-up { display: flex; }

.sk-standby-inner {
  max-width: 24rem;
  text-align: center;
  color: #EDE3D0;
}

.sk-standby-k {
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #8a7f6d;
  margin: 0 0 .5rem;
}

.sk-standby-h {
  font-family: Fraunces, Georgia, serif;
  font-weight: 500;
  font-size: 1.7rem;
  letter-spacing: -.01em;
  margin: 0 0 .6rem;
}

.sk-standby-p {
  font-family: Spectral, Georgia, serif;
  color: #8a7f6d;
  line-height: 1.5;
  margin: 0 0 1.4rem;
}

.sk-standby-go {
  min-height: 48px;
  min-width: 13rem;
  padding: .7rem 1.3rem;
  border: 1px solid #C9A876;
  background: #C9A876;
  color: #14110F;
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.sk-standby-go:focus-visible { outline: 2px solid #F5E6A0; outline-offset: 3px; }

@media (prefers-reduced-motion: no-preference) {
  .sk-standby.is-up .sk-standby-inner { animation: sk-standby-in .28s ease both; }
  @keyframes sk-standby-in { from { opacity: 0; transform: translateY(6px); } }
}
