/* 실제 휴대폰 / 좁은 뷰포트 — 전체 화면 웹앱 */
@media (max-width: 520px), ((max-width: 820px) and (pointer: coarse)) {
  :root {
    --phone-w: 100%;
    --phone-h: 100dvh;
    --top-bar-h: max(env(safe-area-inset-top, 0px), 12px);
    --pad-x: 20px;
  }

  html {
    height: 100%;
    -webkit-text-size-adjust: 100%;
  }

  body {
    min-height: 100dvh;
    height: 100dvh;
    overflow: hidden;
    overscroll-behavior: none;
    -webkit-tap-highlight-color: transparent;
  }

  .viewport {
    min-height: 100dvh;
    height: 100dvh;
    width: 100%;
    padding: 0;
    justify-content: flex-start;
  }

  .viewport-label {
    display: none;
  }

  .viewport .phone,
  .phone {
    width: 100%;
    height: 100dvh;
    max-width: none;
    max-height: none;
    border-radius: 0;
    box-shadow: none;
    outline: none;
  }

  /* 실제 기기 상태바와 겹치지 않도록 데모용 상단바 축소 */
  .iphone-top-bar {
    height: var(--top-bar-h);
    min-height: var(--top-bar-h);
  }

  .iphone-top-bar__inner {
    display: none;
  }

  .screen-wrap {
    padding-top: calc(var(--top-bar-h) + 8px);
    padding-left: calc(var(--pad-x) + env(safe-area-inset-left, 0px));
    padding-right: calc(var(--pad-x) + env(safe-area-inset-right, 0px));
    padding-bottom: 16px;
  }

  .screen-wrap.has-nav {
    padding-bottom: calc(var(--nav-h) + var(--wave-h) + env(safe-area-inset-bottom, 0px) + 28px);
  }

  .screen-home {
    padding-top: 16px;
  }

  .loading-screen {
    min-height: calc(100dvh - var(--top-bar-h) - var(--nav-h) - env(safe-area-inset-bottom, 0px) - 40px);
    padding-left: calc(20px + env(safe-area-inset-left, 0px));
    padding-right: calc(20px + env(safe-area-inset-right, 0px));
  }

  .screen-celebrate {
    min-height: calc(100dvh - var(--top-bar-h) - var(--nav-h) - env(safe-area-inset-bottom, 0px) - 60px);
  }

  .bottom-nav {
    left: calc(12px + env(safe-area-inset-left, 0px));
    right: calc(12px + env(safe-area-inset-right, 0px));
    bottom: calc(var(--wave-h) + env(safe-area-inset-bottom, 0px) + 6px);
  }

  .iphone-bottom-wave {
    height: calc(var(--wave-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-sizing: border-box;
  }

  .iphone-bottom-wave img {
    height: var(--wave-h);
  }

  .toast {
    left: calc(16px + env(safe-area-inset-left, 0px));
    right: calc(16px + env(safe-area-inset-right, 0px));
    bottom: calc(var(--nav-h) + var(--wave-h) + env(safe-area-inset-bottom, 0px) + 20px);
    max-width: none;
    transform: translateY(20px);
  }

  .toast.show {
    transform: translateY(0);
  }

  .greet h1 {
    font-size: clamp(22px, 6.5vw, 26px);
  }

  .feedback-preview-card__img {
    width: min(104px, 26vw);
    height: min(104px, 26vw);
  }
}

/* 가로 모드 — 높이가 낮을 때 스크롤 여유 */
@media (max-width: 920px) and (max-height: 500px) and (pointer: coarse) {
  .phone {
    height: 100dvh;
  }

  .loading-screen {
    min-height: auto;
    padding-top: 16px;
    padding-bottom: 24px;
  }

  .screen-celebrate .celebrate-hero {
    padding-top: 20px;
    padding-bottom: 12px;
  }
}