/* Phone composition stays vertical even on short screens. */
@media (max-width:700px) {
  :root { --pad:24px; }
  .site-header { height:calc(68px + env(safe-area-inset-top)); padding-top:env(safe-area-inset-top); }
  .menu-toggle { width:48px; height:48px; }
  .scene-mode .hero-copy { left:24px; right:24px; top:auto; bottom:29%; }
  .hero-copy h1 { font-size:clamp(44px,13.5vw,70px); line-height:1.04; }
  .hero-bottom { bottom:max(24px,env(safe-area-inset-bottom)); }

  /* A shorter image window gives the character room above the game identity. */
  #worlds .world-art { height:78%; object-position:var(--game-focus,62%) 42%; }
  #worlds .world-copy { bottom:calc(116px + env(safe-area-inset-bottom)); gap:22px; }
  #worlds .world-shade { background:linear-gradient(0deg,#09090e 0%,#09090e 16%,#09090ed9 28%,#09090e38 53%,transparent 76%); }
  .scene-mode .world-nav { bottom:max(20px,env(safe-area-inset-bottom)); left:24px; right:24px; gap:12px; }
  .world-nav button { min-height:48px; font-size:10px; padding-top:10px; }

  #catalog { --phone-cover:min(72vw,38svh); }
  .scene-mode #catalog .catalog-grid { inset:0; }
  #catalog .catalog-grid>.game-card,#catalog .catalog-grid>.police-card { width:var(--phone-cover); top:49%; height:auto; aspect-ratio:2/3; }
  #catalog .showcase-navigation { top:calc(49% + var(--phone-cover)*.75 + 28px); bottom:auto; gap:14px; }
  .showcase-navigation>button { width:48px; height:48px; }

  .scene-mode .publishing .motion-stage { align-items:stretch; padding-top:0; }
  .publishing-copy { position:absolute; top:17%; left:24px; right:24px; width:auto; max-width:none; text-align:center; }
  .scene-mode .publishing .display { font-size:clamp(42px,12.5vw,64px); }
  .publishing-description { max-width:310px; margin:22px auto 0; font-size:16px; line-height:1.6; }
  .publishing .action-button { margin-top:24px; min-height:48px; }
  .publishing-art { top:67%; left:50%; width:min(38vw,22svh); height:auto; aspect-ratio:2/3; }

  .scene-mode .contact .display { font-size:clamp(100px,32vw,150px); }
  .hello-intro { font-size:clamp(20px,6vw,26px); max-width:320px; margin-bottom:28px; }
  .scene-mode .contact .email { font-size:clamp(20px,5.8vw,26px); margin-top:30px; min-height:48px; }
  .scene-mode .site-footer { bottom:max(20px,env(safe-area-inset-bottom)); gap:10px; }
  .site-footer [data-open-privacy] { min-height:44px; padding:12px; font-size:12px; }

  .menu-dialog { padding:calc(100px + env(safe-area-inset-top)) 28px 80px; }
  .menu-dialog nav { gap:24px; }
  .menu-dialog nav a { font-size:clamp(40px,12vw,56px); min-height:48px; }
  .menu-dialog .menu-email { position:absolute; left:28px; bottom:max(40px,env(safe-area-inset-bottom)); padding:14px 0; margin:0; font-size:15px; }

  /* Every detail layer stays full bleed throughout the gallery transition. */
  .detail-backgrounds .detail-cover { height:100%; object-position:var(--game-focus,62%) 42%; }
  .detail-copy { top:auto; bottom:calc(86px + env(safe-area-inset-bottom)); left:24px; right:24px; max-width:none; transform:none; }
  .detail-game-logo { width:min(68vw,280px); height:clamp(100px,16svh,145px); object-position:left bottom; }
  .detail-copy .game-description { font-size:15px; line-height:1.6; margin-top:22px; max-width:none; }
  .detail-copy .game-links { margin-top:24px; gap:18px; }
  .detail-copy .game-links a { min-height:48px; display:inline-flex; align-items:center; }
  .detail-shade { background:linear-gradient(0deg,#09090e 0%,#09090ef5 20%,#09090ed9 35%,#09090e33 65%,transparent 88%); }
  .detail-toolbar { height:calc(76px + env(safe-area-inset-top)); padding-top:env(safe-area-inset-top); }
  .detail-back { min-height:48px; }
  .detail-scroll-cue { bottom:max(24px,env(safe-area-inset-bottom)); right:24px; }
  .detail-scroll-cue .scroll-line { display:none; }
  .detail-scroll-cue .cue-desktop { display:none; }
  .detail-scroll-cue .cue-mobile { display:inline; }

  .pitch-dialog { width:calc(100% - 24px); max-width:none; max-height:calc(100dvh - 24px); border-radius:20px; }
  .pitch-content { padding:64px 24px 32px; }
  .pitch-content h2 { font-size:clamp(33px,9.5vw,42px); margin:20px 0 30px; }
  .pitch-content form { gap:26px; }
  .pitch-content label,.pitch-content legend { font-size:13px; }
  .pitch-content input:not([type=radio]) { min-height:48px; }
  .pitch-content textarea { min-height:96px; }
  .stage-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  .stage-options span { text-align:center; padding:13px 8px; border-radius:12px; }
  .pitch-content form>.action-button { width:100%; justify-content:center; min-height:52px; }
  .privacy-content { padding:64px 24px 32px; }
}
.detail-scroll-cue .cue-mobile { display:none; }
@media (max-width:700px) { .detail-scroll-cue .cue-mobile { display:inline; } }

@media (max-width:700px) and (max-height:650px) {
  .scene-mode .site-header { height:64px; }
  .scene-mode .hero-copy { bottom:28%; }
  #worlds .world-copy { bottom:98px; gap:14px; }
  #worlds .world-game-logo { max-height:23svh; }
  #worlds .world-nav { bottom:12px; }
  .publishing-copy { top:18%; }
  .scene-mode .publishing .display { font-size:clamp(36px,11.5vw,48px); }
  .publishing-description { font-size:14px; line-height:1.55; margin-top:16px; }
  .publishing .action-button { margin-top:18px; }
  .publishing-art { top:76%; width:min(34vw,20svh); }
  .scene-mode .contact .motion-stage { padding-top:64px; padding-bottom:140px; }
  .scene-mode .contact .display { font-size:clamp(90px,30vw,120px); }
  .hello-intro { font-size:20px; margin-bottom:20px; }
  .scene-mode .contact .email { margin-top:22px; }
  .scene-mode .site-footer .brand { width:110px; }
  .detail-copy { top:auto; bottom:66px; transform:none; max-width:none; }
  .detail-game-logo { height:90px; }
  .detail-copy .game-description { font-size:13.5px; line-height:1.5; margin-top:16px; }
  .detail-copy .game-links { margin-top:18px; }
  .detail-scroll-cue { bottom:18px; }
  .menu-dialog { padding-top:90px; }
  .menu-dialog nav { gap:14px; }
  .menu-dialog nav a { font-size:40px; }
}

@media(max-width:700px){
  .header-socials{display:none}
  .menu-dialog .menu-socials{display:flex;flex-direction:row;position:absolute;left:22px;bottom:max(103px,calc(env(safe-area-inset-bottom) + 76px));gap:12px}
  .menu-dialog .menu-socials a{width:48px;height:48px;min-height:48px;font-size:inherit}
}
@media(max-width:700px) and(max-height:500px){
  .menu-dialog{overflow-y:auto;padding-bottom:160px}
  .menu-dialog .menu-socials{position:static;margin-top:28px;margin-left:-6px}
  .menu-dialog .menu-email{position:static;display:inline-block;margin-top:12px}
}
