/* element-quiz · fullscreen. Paired with fullscreen-fit.js (toggles .fs-wide on the stage when the screen is
   wide). Only inside the game-shell Full screen (html.pip-immersive). */
html.pip-immersive .game-wrap.pip-stage .hud { margin: 4px 0; }
html.pip-immersive .game-wrap.pip-stage #card-grid { width: 100%; max-width: 640px; margin-left: auto; margin-right: auto; }
html.pip-immersive .game-wrap.pip-stage .hud, html.pip-immersive .game-wrap.pip-stage #status { max-width: 640px; margin-left: auto; margin-right: auto; }
html.pip-immersive .game-wrap.pip-stage.fs-wide #card-grid, html.pip-immersive .game-wrap.pip-stage.fs-wide .hud, html.pip-immersive .game-wrap.pip-stage.fs-wide #status { max-width: 860px; }
html.pip-immersive .game-wrap.pip-stage.fs-wide .qcard {
  display: grid; grid-template-columns: minmax(150px, .8fr) minmax(0, 1.2fr); column-gap: 18px;
  grid-template-areas: "top top" "bar bar" "tile opts" "hint opts"; align-items: center;
}
html.pip-immersive .game-wrap.pip-stage.fs-wide .qtop { grid-area: top; }
html.pip-immersive .game-wrap.pip-stage.fs-wide .tbar { grid-area: bar; }
html.pip-immersive .game-wrap.pip-stage.fs-wide .tile { grid-area: tile; }
html.pip-immersive .game-wrap.pip-stage.fs-wide .qhint { grid-area: hint; }
html.pip-immersive .game-wrap.pip-stage.fs-wide .opts { grid-area: opts; }
@media (max-height: 740px) {
  html.pip-immersive .game-wrap.pip-stage .tile:not(.wide) { width: 92px; height: 92px; }
  html.pip-immersive .game-wrap.pip-stage .tile .big { font-size: 2.7rem; }
  html.pip-immersive .game-wrap.pip-stage .tile.wide { height: 76px; }
  html.pip-immersive .game-wrap.pip-stage .qcard { padding-top: .6rem; padding-bottom: .7rem; }
  html.pip-immersive .game-wrap.pip-stage .qhint { margin: .25rem 0 .3rem; }
  html.pip-immersive .game-wrap.pip-stage .opt { min-height: 42px; margin: .25rem 0; padding-top: .45rem; padding-bottom: .45rem; }
  html.pip-immersive .game-wrap.pip-stage .opts.grid .opt { min-height: 50px; }
}
@media (max-height: 460px) {
  html.pip-immersive .game-wrap.pip-stage .tile:not(.wide) { width: 76px; height: 76px; }
  html.pip-immersive .game-wrap.pip-stage .tile .big { font-size: 2.1rem; }
  html.pip-immersive .game-wrap.pip-stage .tile .cat, html.pip-immersive .game-wrap.pip-stage .tile .num { display: none; }
  html.pip-immersive .game-wrap.pip-stage .setup .how { display: none; }
}