/* Large game player: top bar with game name (left), fullscreen + X (right). */
#modal .modal-title-wrap { display: flex; align-items: center; gap: .65rem; min-width: 0; }
#modal .modal-icon { width: 28px; height: 28px; border-radius: 6px; object-fit: cover; flex: none; }
#modal .modal-title-wrap h3 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#modal .modal-actions { display: flex; align-items: center; gap: .5rem; flex: none; }
#modal .modal-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .04);
  color: #e4e4e7; cursor: pointer; transition: background .15s, color .15s;
}
#modal .modal-icon-btn:hover { background: rgba(125, 255, 138, .12); border-color: rgba(125, 255, 138, .55); color: #7dff8a; }
#modal .modal-icon-btn[hidden] { display: none; }
/* Favorite star: outline when off, filled green when on. */
#modal .modal-fav-btn svg { transition: transform .15s, fill .15s; }
#modal .modal-fav-btn:hover svg { transform: scale(1.12); }
#modal .modal-fav-btn[aria-pressed="true"] { color: #7dff8a; border-color: rgba(125, 255, 138, .55); background: rgba(125, 255, 138, .12); }
#modal .modal-fav-btn[aria-pressed="true"] svg { fill: currentColor; }

#modal.game-mode { padding: 0; align-items: stretch; }
#modal.game-mode > .absolute { background: #000; }
#modal.game-mode > #modal-panel {
  max-width: none; max-height: none; width: 100%; height: 100%;
  border: 0; border-radius: 0; background: #0d0b08;
}
#modal.game-mode #modal-bar { flex: none; padding: .55rem 1.25rem; }
#modal.game-mode #modal-body {
  flex: 1 1 auto; min-height: 0; padding: 0; overflow: hidden; background: #000;
}
#modal.game-mode #modal-body iframe { width: 100%; height: 100%; display: block; }

/* "Game not working?" report dialog (opened by the flag button in the game player). */
#modal .report-overlay {
  position: absolute; inset: 0; z-index: 5;
  display: flex; align-items: center; justify-content: center; padding: 1rem;
}
#modal .report-overlay[hidden] { display: none; }
#modal .report-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .6); backdrop-filter: blur(3px); }
#modal .report-card {
  position: relative; width: 100%; max-width: 26rem; text-align: center;
  padding: 1.75rem 1.5rem 1.5rem; border-radius: 1.1rem;
  background: #0d0f12; border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .6);
}
#modal .report-title {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  margin: 0; font-size: 1.3rem; font-weight: 700; color: #fff;
}
#modal .report-text { margin: .9rem 0 0; font-size: .95rem; line-height: 1.6; color: #a1a1aa; }
#modal .report-game { margin: .5rem 0 0; font-size: .85rem; color: #71717a; }
#modal .report-game strong { color: #d4d4d8; font-weight: 600; }
#modal .report-discord {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  margin-top: 1.4rem; padding: .95rem 1rem; border-radius: .9rem;
  background: #5865f2; color: #fff; font-weight: 700; font-size: 1rem; text-decoration: none;
  transition: filter .15s;
}
#modal .report-discord:hover { filter: brightness(1.1); }
#modal .report-cancel {
  display: block; width: 100%; margin-top: .75rem; padding: .95rem 1rem; border-radius: .9rem;
  background: transparent; color: #d4d4d8; font-weight: 600; font-size: 1rem; cursor: pointer;
  border: 1px solid rgba(255, 255, 255, .16); transition: background .15s;
}
#modal .report-cancel:hover { background: rgba(255, 255, 255, .06); }
#modal .report-discord:focus-visible, #modal .report-cancel:focus-visible { outline: 2px solid #7dff8a; outline-offset: 2px; }

/* While a game is open the page behind it is fully covered. Stop painting it (and the fixed
   gradient background / blurred header) so a weak laptop spends everything on the game. */
html.game-open body { background: #000 !important; }
/* No page scrollbar down the right edge while a game window is open (game windows only). */
html.game-open, html.game-open body { overflow: hidden !important; scrollbar-width: none; }
html.game-open::-webkit-scrollbar, html.game-open body::-webkit-scrollbar { display: none; }
html.game-open #landing,
html.game-open #workspace,
html.game-open nav.dock { visibility: hidden; }