/* Shared web presentation. Game rules and progression stay in their existing modules. */
#landscape-gate {
  margin: auto; width: min(440px, calc(100% - 32px)); max-height: calc(100dvh - 32px);
  padding: 28px 20px; overflow: auto; border: 3px solid rgba(255, 255, 255, .92); border-radius: 20px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(233, 247, 255, .78));
  box-shadow: 0 0 0 3px rgba(65, 194, 244, .2), 0 16px 38px rgba(0, 53, 88, .24);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  color: #23475f; text-align: center; font-family: Arial, sans-serif;
}
#landscape-gate::backdrop { background: rgba(5, 18, 34, .34); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
#landscape-gate h1 { margin: 16px 0 8px; color: #0b5f96; font-size: 20px; font-weight: 1000; line-height: 1.2; }
#landscape-gate p { margin: 0 0 15px; font-size: 15px; font-weight: 800; line-height: 1.55; }
#landscape-gate button { font-family: inherit; }
.rotate-symbol { display: block; width: min(210px, 55vw); height: auto; margin: 0 auto; }
.landscape-required .game-frame-wrap { visibility: hidden !important; }
#micalo-orientation-hint { display: none !important; }
html:not(.mobile-game-layout) .levels-grid { grid-template-columns: repeat(5, 240px); gap: 8px; }
html:not(.mobile-game-layout) .level-card { width: 240px !important; }

.shared-page-controls { position: absolute; z-index: 200; top: 14px; right: 14px; display: flex; flex-direction: row-reverse; gap: 6px; direction: ltr; }
.shared-page-controls .shell-control { width: 80px; height: 80px; }
.shared-page-controls .shell-control-icon { width: 100%; height: 100%; object-fit: contain; }
.shared-page-controls [hidden], .shell-header[hidden] { display: none; }
.fullscreen-button.shared-fullscreen { position: absolute; top: 14px; left: 14px; right: auto; bottom: auto; width: 88px; height: 80px; padding: 0; margin: 0; border: 0; background: transparent; z-index: 200; }
.landscape-required .shared-page-controls, .landscape-required .shared-fullscreen { visibility: hidden; }

html.micalo-fullscreen #fullscreen-button { visibility: hidden; pointer-events: none; }
