/* 랜딩 폰 손보기 — 첫 화면 · 뷰어 껍데기(왼쪽 위 런처 알약) · 프로젝트 고르는 판(공통 바닥 시트).
   deploy/fix_mobile_landing_koos.sh 가 /assets/css/mobile.css 로 올리고 app.css 뒤에 건다(CSP: 외부 파일만).
   넓은 화면(> 760px, 손가락 아닌 포인터)은 건드리지 않는다. */

/* ── 프로젝트 판 = 바닥 시트 (≤ 760px · 가로로 눕힌 폰) ─────── */
@media (max-width:760px), (max-height:500px) and (max-width:960px){
  .lnch-scrim{ display:none !important; }                 /* 막·바깥 누르기는 시트가 맡는다 */
  .lnch-menu.u21s{
    --u21m-bg:#0d131c;
    background:#0d131c !important;
    padding-left:8px !important; padding-right:8px !important;
    gap:2px; border:0 !important; border-top:1px solid rgba(255,255,255,.14) !important;
    box-sizing:border-box;
  }
  .lnch-menu.u21s .lnch-x{ display:none !important; }
  .lnch-menu.u21s .lnch-home{ min-height:48px; padding:6px 12px 6px 12px; }
  .lnch-menu.u21s .lnch-home b{ font-size:15px; }
  .lnch-menu.u21s .lnch-grp{ font-size:12px; padding-top:10px; }
  .lnch-menu.u21s .switch button{ min-height:54px; padding:7px 12px; }
  .lnch-menu.u21s .switch button b{ font-size:15px; }
  .lnch-menu.u21s .switch button i{ font-size:12.5px; white-space:normal; }
  .lnch-menu.u21s .lnch-lang{ padding:10px 6px 4px; font-size:13px; }
  .lnch-menu.u21s .lnch-lang a,
  .lnch-menu.u21s .lnch-lang span{ height:40px; min-width:60px; }
}

/* ── 런처 알약 (≤ 640px): 높이 46px · 폭 ≤ 200px — 뷰어들이 이 자리를 비워 둔다 ── */
@media (max-width:640px){
  .launcher{
    top:calc(8px + env(safe-area-inset-top, 0px)); left:calc(8px + env(safe-area-inset-left, 0px));
    height:46px; box-sizing:border-box; max-width:200px;
    padding:3px; gap:2px;
    /* 살아 있는 지도 위의 흐림은 폰에서 프레임을 먹는다 — 바탕을 채우고 흐림은 끈다 */
    background:rgba(12,18,28,.95);
    -webkit-backdrop-filter:none; backdrop-filter:none;
  }
  .lnch-btn{ height:40px; min-width:46px; padding:0 7px; align-self:center; }
  .lnch-btn img{ height:14px; }
  .lnch-now{ height:40px; margin-left:0; padding:0 8px 0 9px; gap:5px; min-width:0; max-width:132px; }
  .lnch-now b{ font-size:13px; }
  .lnch-coach{ font-size:13px; left:2px; }

  /* 첫 화면: 글자 바닥 12px */
  .intro-foot .models, .intro-foot .models b, .intro-foot .models span{ font-size:12px; }
  .foot-end{ font-size:12px; }
  .pick-cat, :lang(en) .pick-cat{ font-size:12px; }
  /* 카드 전체가 단추다 — 눌린 느낌을 준다(폰에는 hover 가 없다) */
  .pick:active{ transform:scale(.985); transition:transform .08s; }
  .loading .loading-sub{ font-size:12.5px; }
}

/* ── 손가락으로 쓰는 기기(가로 폰 포함): 누르는 자리 40px ───────── */
@media (pointer:coarse){
  .intro-lang a, .intro-lang span{ min-width:44px; min-height:40px; display:grid; place-items:center; }
  .lnch-lang a, .lnch-lang span{ height:40px; }
  .lnch-btn, .lnch-now{ min-height:40px; }
  /* 노치·홈 막대: 뷰어(iframe) 안에서는 env() 가 0 이라 껍데기가 대신 비켜 준다 */
  .stage{ margin:0 env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px); }
}

/* ── 낮은 화면(가로 폰): 떠 있는 프로젝트 판이 화면보다 길어 아래 항목·언어 단추에 닿을 수 없었다 ── */
@media (max-height:560px){
  .lnch-menu:not(.u21s){
    max-height:calc(100vh - 66px); max-height:calc(100dvh - 66px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
  }
  .lnch-menu:not(.u21s) .switch{ flex:none; }
}

/* ── 두 번 톡 확대·300ms 지연 없애기 (누르는 것 전부) ──────────── */
@media (pointer:coarse){
  .pick, .intro-lang a, .lnch-btn, .lnch-now, .lnch-menu button, .lnch-menu a, .loading-act button{ touch-action:manipulation; }
  .pick, .lnch-btn, .lnch-now, .lnch-menu button{ -webkit-tap-highlight-color:transparent; }
}