/* city-blocks fullscreen: paired with fullscreen-fit.js, which sets --fs-w (the city's edge) and
   toggles .fs-wide. Applies only while the shell's Full screen is on (html.pip-immersive). */
html.pip-immersive .game-wrap { display: block; }
html.pip-immersive .game-wrap .cb-how { display: none; }
html.pip-immersive .game-wrap #card-grid { width: var(--fs-w, 100%); max-width: var(--fs-w, none); margin-inline: auto; }
html.pip-immersive .game-wrap .cb-bar,
html.pip-immersive .game-wrap .cb-meter,
html.pip-immersive .game-wrap .hud,
html.pip-immersive .game-wrap #status { max-width: var(--fs-w, none); margin-inline: auto; }
html.pip-immersive .game-wrap #status { padding: 3px 8px; margin-bottom: 4px; min-height: 0; }
html.pip-immersive .game-wrap .hud { min-height: 0; padding-top: 4px; margin-bottom: 4px; }
html.pip-immersive .game-wrap .cb-bar { margin: 0 auto; }
html.pip-immersive .game-wrap #color-btns,
html.pip-immersive .game-wrap #build-hint,
html.pip-immersive .game-wrap .cb-tools { max-width: var(--fs-w, none); margin-inline: auto; }
html.pip-immersive .game-wrap #build-hint { margin-bottom: 4px; }
html.pip-immersive .confetti { z-index: 8002; }

html.pip-immersive .game-wrap.fs-wide {
  display: grid;
  grid-template-columns: var(--fs-w) 320px;
  column-gap: 18px;
  align-content: start;
  justify-content: center;
}
html.pip-immersive .game-wrap.fs-wide > * { grid-column: 2; min-width: 0; max-width: none; }
html.pip-immersive .game-wrap.fs-wide > #card-grid { grid-column: 1; grid-row: 1 / span 14; margin: 0; align-self: start; max-width: var(--fs-w); }
html.pip-immersive .game-wrap.fs-wide > #over { grid-column: auto; }
html.pip-immersive .game-wrap.fs-wide .hd-about p { font-size: .9rem; line-height: 1.5; }