/* Shared narrow-screen corrections; desktop artwork and content stay unchanged. */
@media (max-width: 1100px) {
  [data-lollipop-site-header],
  [data-lollipop-site-header] :is(.header-inner, .site-nav, .wrap > nav) {
    height: auto;
    flex-wrap: wrap;
    white-space: normal;
  }
  [data-lollipop-site-header] [data-lollipop-header-actions] {
    flex-wrap: wrap !important;
    max-width: 100%;
    min-width: 0;
  }
  [data-lollipop-site-header] :is(.nav-links, .primary-nav, .main-nav, .site-nav) {
    flex-wrap: wrap;
    min-width: 0;
  }
  [data-lollipop-site-header].story-complete-header,
  [data-lollipop-site-header] .site-nav {
    grid-template-columns: auto minmax(0, 1fr);
  }
  [data-lollipop-site-header].story-complete-header > [data-lollipop-header-actions],
  [data-lollipop-site-header] .site-nav > [data-lollipop-header-actions] {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
}

@media (max-width: 800px), (max-height: 500px) {
  /* Keep the logo, navigation, then actions in document order in either language. */
  [data-lollipop-site-header] [data-lollipop-header-actions] {
    flex-basis: 100%;
    width: 100%;
    justify-content: flex-end;
    order: 3;
  }
  [data-lollipop-site-header] :is(a, button, select),
  [data-lollipop-site-header] [data-lollipop-header-actions] :is(a, button, select),
  [data-lollipop-site-header] nav a:not(.logo):not(.story-header-logo),
  [data-lollipop-site-header] [data-lollipop-auth-slot] :is(a, button) {
    min-height: 44px;
    font-size: .875rem;
    line-height: 1.25;
  }
  [data-lollipop-site-header] :is(.icon-btn, .lang-btn) { min-width: 44px; }
  [data-lollipop-site-header] .lollipop-auth-control { max-width: 100%; }
  [data-lollipop-site-header] .lollipop-auth-greeting { font-size: .8rem; }
  .story-complete-header .story-shortcut { grid-row: auto; grid-column: auto; }
  :is(main, footer) :is(p, li, h1, h2, h3, a),
  .legal-shell { overflow-wrap: break-word; }
  :is(.hero-grid, .grid, .layout, .footer-grid) > * { min-width: 0; }
  :is(input, select, textarea) { font-size: 16px !important; }
  :is(.btn-primary, .btn-secondary, .download, .download-btn, .play-link) {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }
  :is(.footer-col, .footer-legal, .privacy-tools) a,
  .privacy-tools button { display: inline-flex; align-items: center; min-height: 44px; }
  .footer-col a { display: flex; }
  .social-row a { width: 44px; height: 44px; }
  :is(.cookie-actions button, .filter, .play, .game-topbar button) { min-height: 44px; }
  .cookie-banner { max-height: calc(100dvh - 32px); overflow-y: auto; }
  .filters { flex-wrap: wrap; overflow: visible; gap: 10px; }
  /* Contain the decorative rays as well as the interactive badge. */
  .cover-wrap .sun-badge { right: 28px; }
  #giftBadge { right: 24px; width: 88px; height: 88px; top: 0; }
  html[dir="rtl"] #giftBadge { right: auto; left: 24px; }
  .preview-stage .crayon-grape { left: 48px; }
  .preview-stage .crayon-coral { right: 48px; }
  .level-hotspot--start { min-height: 44px; }
  .level-hotspot:focus-visible { outline: 3px solid #614099; outline-offset: 3px; }
  .game-topbar { flex-wrap: wrap; gap: 12px; }
  .game-topbar .topbar-btns { flex-wrap: wrap; }
  .win-card { max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; }
  .win-btns { flex-wrap: wrap; }
}

/* The story portrait extends beyond its column before the original phone breakpoint. */
@media (min-width: 761px) and (max-width: 980px) {
  body:has(.story-shell) .hero-grid { grid-template-columns: 1fr; }
}

@media (max-width: 800px), (max-height: 500px) {
  .win-card { max-height: calc(100dvh - 32px); overflow-y: auto; }
  .lollipop-auth-dialog { max-height: calc(100dvh - 24px); overflow-y: auto; }
  .lollipop-auth-dialog .lollipop-auth-close { width: 44px; height: 44px; }
  .lollipop-auth-dialog :is(button, .lollipop-auth-password-toggle) { min-height: 44px; }
  .lollipop-search-layer { padding: 12px; overflow-y: auto; }
  .lollipop-search-dialog { max-height: calc(100dvh - 24px); overflow-y: auto; }
  .lollipop-search-results { max-height: none; }
}
@media (max-height: 500px) {
  [data-lollipop-site-header] { position: relative; }
}

/* Off-screen spam fields must not create a huge RTL scroll area. */
.honeypot {
  position: absolute;
  left: auto !important;
  right: auto !important;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (max-width: 800px), (max-height: 500px) {
  [data-lollipop-site-header] .lang-switch { position: static; }
  [data-lollipop-site-header] .lang-menu {
    left: 14px !important;
    right: auto !important;
    width: min(340px, calc(100vw - 28px));
    top: 100%;
  }
  .paper-preview { width: min(350px, 74vw); }
  .paper-preview::before { right: 0; }
}
@media (max-width: 800px), (max-height: 500px) {
  body:has(#newsletterForm) .hero::after { left: 0; right: 0; }
}
