:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #111017;
  color: #f7f1e7;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; overflow: hidden; background: #111017; }
button, a { font: inherit; }

.player-header {
  min-height: 72px;
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
  align-items: center;
  gap: 20px;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(255,255,255,.12);
  background: #1a1720;
}

.back-link { color: #d7cedf; font-size: .82rem; font-weight: 800; text-decoration: none; }
.back-link:hover { color: white; }
.game-heading { text-align: center; }
.game-heading p { margin: 0 0 2px; color: #93899e; font-size: .61rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.game-heading h1 { margin: 0; font-family: Georgia, serif; font-size: clamp(1.15rem, 2vw, 1.65rem); font-weight: 500; }
.player-actions { display: flex; justify-content: flex-end; gap: 8px; }
.player-actions button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid rgba(255,255,255,.19);
  border-radius: 999px;
  background: transparent;
  color: #ded6e6;
  font-size: .72rem;
  font-weight: 800;
  cursor: pointer;
}
.player-actions button:hover { border-color: white; color: white; }
.player-actions button:disabled { opacity: .45; cursor: not-allowed; }

.player-main { height: calc(100% - 72px); padding: 10px; }
.game-frame-shell { position: relative; width: 100%; height: 100%; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: #08070b; }
.game-frame-shell:fullscreen { border: 0; border-radius: 0; }
#game-frame { width: 100%; height: 100%; display: block; border: 0; background: #08070b; }
.loading-card { position: absolute; z-index: 3; inset: 0; display: grid; place-content: center; justify-items: center; gap: 16px; background: #111017; color: #d9d0e1; }
.loading-card[hidden] { display: none; }
.loading-card a { color: white; }
.loader-door { width: 42px; height: 58px; border: 3px solid #8e7af5; border-radius: 18px 18px 3px 3px; box-shadow: inset -8px 0 rgba(142,122,245,.17), 0 0 30px rgba(142,122,245,.2); }
.loader-door::after { content: ""; display: block; width: 4px; height: 4px; margin: 30px 0 0 27px; border-radius: 50%; background: #ff805d; }
noscript { display: block; padding: 20px; }

@media (max-width: 650px) {
  .player-header { min-height: 62px; grid-template-columns: auto 1fr auto; gap: 8px; padding: 8px 10px; }
  .back-link span { display: none; }
  .player-main { height: calc(100% - 62px); padding: 0; }
  .game-frame-shell { border: 0; border-radius: 0; }
  .player-actions button:first-child { display: none; }
  .player-actions button { min-height: 34px; padding: 0 10px; }
}
