/* 모바일 세로 뷰 — 820px 이하에서만 켜진다. deck-mobile.js 가 html.mv-on 을 붙인다. */
@media (max-width:820px) {
  html.mv-on, html.mv-on body { overflow:hidden; height:100%; }
  /* 원본 슬라이드·크롬은 셸이 대신 보여준다 */
  html.mv-on body > *:not(#mv-shell) { display:none !important; }

  #mv-shell { position:fixed; inset:0; display:flex; flex-direction:column; background:var(--bg); }

  #mv-stage {
    position:relative; width:100%; aspect-ratio:16/9;
    background:var(--panel); border-bottom:1px solid var(--border);
    overflow:hidden; flex:0 0 auto;
  }
  #mv-frame {
    position:absolute; top:0; left:0; width:1280px; height:720px; border:0;
    transform-origin:top left;
    /* 제스처를 부모 #mv-stage 로 통과시켜 스와이프·탭줌이 먹게 한다 */
    pointer-events:none;
  }
  #mv-stage.zoom {
    position:fixed; inset:0; z-index:200; aspect-ratio:auto;
    display:flex; align-items:center; justify-content:center; background:var(--fg);
  }

  .mv-pager {
    position:absolute; left:0; right:0; bottom:0;
    display:flex; align-items:center; justify-content:center; gap:16px;
    padding:6px 10px; font-size:14px;
    background:linear-gradient(transparent, rgb(0 0 0 / .35)); color:#fff;
  }
  .mv-pager button {
    border:0; background:rgb(255 255 255 / .18); color:#fff;
    width:34px; height:34px; border-radius:999px; font-size:18px; cursor:pointer;
  }

  #mv-panel { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; }
  .mv-tabs { display:flex; border-bottom:1px solid var(--border); }
  .mv-tab {
    flex:1; border:0; background:transparent; color:var(--muted);
    padding:12px; font:inherit; font-size:15px; font-weight:600; cursor:pointer;
  }
  .mv-tab.on { color:var(--accent); box-shadow:inset 0 -2px 0 var(--accent); }
  .mv-body { flex:1 1 auto; min-height:0; overflow-y:auto; padding:14px 16px; }
  #mv-notes { font-size:16px; line-height:1.7; color:var(--fg); }
  #mv-notes p { margin-bottom:10px; }
  #mv-notes code { font-size:.9em; }
  .mv-empty { color:var(--muted); }
  .mv-memo-hint { color:var(--muted); font-size:12px; margin-bottom:8px; }
  #mv-memo {
    width:100%; min-height:40vh; resize:vertical;
    background:var(--panel); color:var(--fg);
    border:1px solid var(--border); border-radius:var(--radius);
    padding:10px; font:inherit; font-size:15px;
  }
}
