/* Kick On Air: phone portrait layer (desktop untouched; everything is inside max-width:760px) */
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; }
  body { overflow-x: hidden; }
  .panel { min-height: 100svh; }
  .site-header, .site-header.is-bar {
    height: auto; min-height: 0; flex-direction: column; align-items: stretch; gap: 6px;
    padding: calc(6px + env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 6px max(10px, env(safe-area-inset-left));
  }
  .site-header .logo { align-self: center; }
  .site-header .logo-mark { font-size: 18px; }
  .nav { flex-wrap: nowrap; justify-content: flex-start; gap: 18px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 4px 2px 6px; }
  .nav::-webkit-scrollbar { display: none; }
  .nav a { font-size: 16px; white-space: nowrap; flex: none; }
  .nav .icon { width: 28px; height: 28px; }
  .nav .icon svg { width: 20px; height: 20px; }
  .page { min-height: 0; padding: 104px 16px calc(32px + env(safe-area-inset-bottom)); }
  .page h1 { font-size: clamp(30px, 9vw, 44px); }

  /* Characters selector */
  .char-stage { min-height: 0; grid-template-columns: 40px minmax(0, 1fr) 40px; gap: 0; }
  .char-nav { width: 40px; height: 64px; font-size: 44px; touch-action: manipulation; }
  .char-card { display: flex; flex-direction: column-reverse; align-items: center; min-height: 0; text-align: center; }
  .char-copy { padding: 0; margin-top: -28px; z-index: 3; }
  .char-copy h1, .char-copy .char-name-row h1 { font-size: clamp(30px, 10vw, 42px); }
  .role { font-size: clamp(14px, 4.2vw, 17px); }
  .line { font-size: clamp(14px, 4.2vw, 17px); }
  .char-card .char-art, .char-card .char-art.is-bust {
    width: 100%; max-width: 100%; height: auto;
    max-height: calc(100svh - 360px - env(safe-area-inset-bottom));
    aspect-ratio: auto; object-fit: contain; object-position: 50% 0;
    --stage-pull: 0px; transform: none;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 78%, transparent 100%), linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 78%, transparent 100%), linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
  }
  .char-card .char-art.is-bust[role="button"]:hover, .char-art.is-revealed[role="button"]:hover { transform: none; }
  .char-thumbs {
    flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory; gap: 8px; margin: 16px -16px 18px; padding: 4px 16px calc(4px + env(safe-area-inset-bottom));
    scrollbar-width: none;
  }
  .char-thumbs::-webkit-scrollbar { display: none; }
  .char-thumbs button { width: 56px; height: 56px; flex: none; scroll-snap-align: center; }
  .char-thumbs > :first-child { margin-left: auto; }
  .char-thumbs > :last-child { margin-right: auto; }
  .char-zoom-img { max-width: 100vw; max-height: 100svh; }
  .char-zoom-close { top: calc(12px + env(safe-area-inset-top)); }
  .roster { grid-template-columns: 1fr 1fr; }
  .site-footer { padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
}
@media (max-width: 760px) {
  .site-header .logo { margin: 0 auto; }
  .hero { display: flex; flex-direction: column; align-items: center; min-height: 100svh; height: auto; padding: 0 12px calc(24px + env(safe-area-inset-bottom)); }
  .hero-logo { left: 16px; top: 112px; }
  .hero-logo .logo-mark { font-size: clamp(44px, 15vw, 64px); }
  .char-countdown.hero-countdown { position: relative; left: auto; top: auto; transform: none; margin: max(300px, 42svh) auto 24px; width: 100%; }
  .hero-countdown .cd-title { font-size: clamp(15px, 4.4vw, 20px); }
  .hero-countdown .cd-cell b { font-size: clamp(36px, 12vw, 56px); }
  .hero-countdown .cd-grid { gap: 10px; }
  .store-badges { position: relative; right: auto; bottom: auto; align-items: center; width: 100%; max-width: 420px; margin: 0 auto; transform: none; }
}
/* v2: kill horizontal overflow */
@media (max-width: 760px) {
  html, body { overflow-x: hidden; max-width: 100%; overscroll-behavior-x: none; touch-action: pan-y; }
  main, section, .panel, .section-inner, .page { max-width: 100%; }
  .panel { height: auto; min-height: 100svh; overflow: hidden; }
  .section-inner { height: auto; padding: 72px 16px 56px; }
  .hero { width: 100%; }
  .support-crypto, .store-badges, .news-grid, .news-panel, .discord-widget { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
  .wallet-addr { word-break: break-all; overflow-wrap: anywhere; white-space: normal; }
  .news-grid { grid-template-columns: 1fr; gap: 20px; }
  .discord-widget, .discord-widget iframe { height: 460px; min-height: 460px; }
  .char-home .section-inner, .char-home { display: flex; flex-direction: column; align-items: center; }
  .char-home .banner { position: relative; left: auto; top: auto; transform: skewX(-12deg); margin: 84px auto 12px; }
  .char-home .sys-actions { position: relative; left: auto; bottom: auto; transform: none; justify-content: center; margin: 12px auto 40px; }
  .collage { position: relative; left: auto; bottom: auto; transform: none; width: 100%; height: 300px; overflow: hidden; }
  .collage img, .collage .p2, .collage .p4, .collage .p6, .collage .p8 { height: 190px; margin: 0 -22px 20px; flex: none; }
  .collage img.p1.is-revealed { height: 280px; margin: 0 -40px 0 0; }
  .collage .p6, .collage .p7, .collage .p8 { display: none; }
  .akira-home-card { position: relative; left: auto; bottom: auto; margin: 0 auto 8px; max-width: calc(100% - 32px); }
  .scroll-hint { display: none; }
  .music-toggle { left: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .to-top { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .site-header .logo { margin: 0 auto; position: static; transform: none; left: auto; right: auto; }
  .foot-grid { grid-template-columns: 1fr; }
  img, iframe, video { max-width: 100%; }
}
@media (max-width: 760px) {
  .char-home .banner { order: -2; margin: 72px auto 8px; }
  .char-home .collage { order: -1; }
  .char-home .sys-actions { margin-bottom: 64px; }
  .music-toggle { padding: 6px 10px; font-size: 12px; opacity: 0.92; }
}
/* v3: FAQ requirements block (all widths) */
.req-banner { margin: 44px 0 22px; }
.req { background: #111; color: #fff; padding: 22px 24px 20px; transform: rotate(-0.4deg); box-shadow: 6px 8px 0 rgba(0,0,0,0.12); }
.req dl { margin: 0; }
.req dl > div { display: grid; grid-template-columns: 110px 1fr; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.12); }
.req dl > div:last-child { border-bottom: 0; }
.req dt { font-family: "Anton", sans-serif; font-weight: normal; color: var(--yellow); letter-spacing: 0.04em; text-transform: uppercase; font-size: 14px; }
.req dd { margin: 0; font-size: 14px; line-height: 1.45; }
.req-info { margin-bottom: 18px !important; }
.req-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.req-card { background: #fff; color: #111; padding: 14px 16px 10px; }
.req-card h3 { margin: 0 0 6px; display: inline-block; background: #111; color: var(--yellow); font-family: "Anton", sans-serif; font-weight: normal; font-style: italic; font-size: 20px; padding: 2px 12px; transform: skewX(-10deg); }
.req-card.is-rec h3 { background: #0E80FA; color: #fff; }
.req-card dl > div { grid-template-columns: 84px 1fr; border-bottom-color: rgba(0,0,0,0.1); }
.req-card dt { color: #111; }
.req-note { margin: 14px 0 0; font-size: 12px; color: #cfcfcf; line-height: 1.5; }
@media (max-width: 760px) {
  .faq-item, .faq-item:nth-child(even), .req { transform: none; }
  .faq-item summary { font-size: clamp(17px, 5vw, 20px); padding: 14px 44px 14px 16px; position: relative; line-height: 1.2; }
  .faq-item summary::after { position: absolute; right: 16px; top: 12px; float: none; font-size: 22px; }
  .faq-item .faq-body { padding: 0 16px 16px; font-size: 15px; overflow-wrap: anywhere; }
  .req { padding: 18px 14px 16px; }
  .req-grid { grid-template-columns: 1fr; }
  .req dl > div, .req-card dl > div { grid-template-columns: 82px 1fr; gap: 10px; }
}
/* v4: Android / iOS requirement groups */
.req-os { margin: 18px 0 10px; font-family: "Anton", sans-serif; font-weight: normal; font-size: 22px; color: #fff; letter-spacing: 0.04em; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.req-soon { display: inline-block; background: #FF0800; color: #fff; font-size: 13px; padding: 3px 10px; transform: skewX(-10deg); letter-spacing: 0.08em; }
.req-grid.is-ios .req-card { opacity: 0.92; }
@media (max-width: 760px) { .req-os { font-size: 20px; } }
/* v6: Google Play pre-registration badge (all widths) */
.store-preg { display: inline-block; background: #111; color: var(--yellow); font-family: "Anton", sans-serif; font-weight: normal; font-size: 15px; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none; padding: 4px 12px; transform: skewX(-10deg); box-shadow: 3px 4px 0 rgba(0,0,0,0.35); }
.store-preg:hover { color: #fff; }
.store-badge.store-badge--gplay { box-shadow: none; margin: -6px -10px -8px 0; }
.store-badge.store-badge--gplay img { width: 180px; height: auto; }
@media (max-width: 760px) { .store-badge.store-badge--gplay { margin: -6px auto -8px; } }