/* VW_WATCH_TOGETHER_PM_GIF_VIDEO_PREMIUM_POLISH_V3_15R5R1_R8_COOP
   Built from V3.15A12 real-geometry proof.

   Scope:
   - keep R4R1 Player bottom sheet unchanged;
   - PM visible video becomes a responsive compact lane;
   - GIF mode gets an even smaller SAME player lane;
   - real #gifTray becomes a fixed lane below video and above composer;
   - GIF topbar/tabs/categories stay visible and clickable;
   - PM header/composer/media chrome gets restrained premium polish;
   - existing keyboard/VisualViewport ownership is preserved.
*/

:root{
  --vw-r5-ease:cubic-bezier(.2,.82,.18,1);
  --vw-r5-line:rgba(255,255,255,.075);
  --vw-r5-purple:rgba(119,104,255,.22);
}

/* ---------- Normal PM: compact video, more room for messages ---------- */
@media(max-width:980px){
  body.vw-android-room-shell.vw-r5-premium-layout-ready:not(.vw-pm-single-owner-ready).vw-private-messages-open.vw-private-thread-open:not(.vw-gif-tray-open):not(.vw-premium-video-hidden):not(.vw-android-keyboard-open):not(.vw-android-ime-session) .stage{
    height:var(--vw-r5-pm-video-h,168px)!important;
    min-height:var(--vw-r5-pm-video-h,168px)!important;
    max-height:var(--vw-r5-pm-video-h,168px)!important;
    transition:
      height .28s var(--vw-r5-ease),
      max-height .28s var(--vw-r5-ease),
      opacity .20s ease,
      transform .30s var(--vw-r5-ease)!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready:not(.vw-pm-single-owner-ready).vw-private-messages-open.vw-private-thread-open:not(.vw-gif-tray-open):not(.vw-premium-video-hidden):not(.vw-android-keyboard-open):not(.vw-android-ime-session) #videoWrap{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready:not(.vw-pm-single-owner-ready).vw-private-messages-open.vw-private-thread-open:not(.vw-gif-tray-open):not(.vw-premium-video-hidden):not(.vw-android-keyboard-open):not(.vw-android-ime-session) .private-messages-surface{
    top:var(--vw-r5-pm-top,172px)!important;
    bottom:auto!important;
    height:var(--vw-r5-pm-height,calc(100dvh - 250px))!important;
    max-height:none!important;
    transition:
      top .28s var(--vw-r5-ease),
      height .28s var(--vw-r5-ease),
      opacity .18s ease!important;
  }

  /* ---------- PM header: one-row, calmer premium hierarchy ---------- */
  body.vw-android-room-shell.vw-private-thread-open .private-thread-head.vw-premium-clean-thread-head{
    min-height:54px!important;
    padding-top:5px!important;
    padding-bottom:5px!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    background:
      linear-gradient(180deg,rgba(9,14,23,.985),rgba(7,11,18,.985))!important;
    box-shadow:0 7px 22px rgba(0,0,0,.18)!important;
  }

  body.vw-android-room-shell .vw-premium-pm-actions{
    gap:4px!important;
  }

  body.vw-android-room-shell .vw-premium-pm-icon{
    border-color:rgba(255,255,255,.075)!important;
    background:rgba(255,255,255,.035)!important;
    box-shadow:none!important;
  }

  body.vw-android-room-shell .vw-premium-pm-actions .private-thread-close{
    border-color:rgba(255,255,255,.075)!important;
    background:rgba(255,255,255,.035)!important;
  }

  body.vw-android-room-shell .private-thread-title small{
    opacity:.82;
  }

  /* ---------- GIF dedicated mode: compact player + full, clickable browser ---------- */
  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open:not(.vw-premium-video-hidden) .stage{
    height:var(--vw-r5-gif-video-h,104px)!important;
    min-height:var(--vw-r5-gif-video-h,104px)!important;
    max-height:var(--vw-r5-gif-video-h,104px)!important;
    border-radius:0 0 13px 13px!important;
    transition:
      height .26s var(--vw-r5-ease),
      max-height .26s var(--vw-r5-ease),
      opacity .18s ease!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open:not(.vw-premium-video-hidden) #videoWrap{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    aspect-ratio:auto!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray{
    box-sizing:border-box!important;
    position:fixed!important;
    left:6px!important;
    right:6px!important;
    top:var(--vw-r5-gif-top,108px)!important;
    bottom:auto!important;
    width:auto!important;
    height:var(--vw-r5-gif-height,calc(100dvh - 184px))!important;
    min-height:180px!important;
    max-height:none!important;
    margin:0!important;
    padding:6px 0 0!important;
    overflow:hidden!important;
    z-index:2147482650!important;
    border:1px solid rgba(255,255,255,.07)!important;
    border-radius:16px!important;
    background:
      radial-gradient(circle at 16% 0%,rgba(119,104,255,.08),transparent 28%),
      #080c13!important;
    box-shadow:0 14px 34px rgba(0,0,0,.34)!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-tray-handle{
    width:32px!important;
    height:3px!important;
    margin:0 auto 5px!important;
    opacity:.68!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-compact-topbar{
    position:sticky!important;
    top:0!important;
    z-index:12!important;
    min-height:34px!important;
    margin-bottom:4px!important;
    padding:0 1px!important;
    background:#080c13!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-tabs{
    position:sticky!important;
    top:38px!important;
    z-index:11!important;
    margin-bottom:4px!important;
    background:#0b1018!important;
    box-shadow:0 4px 10px rgba(0,0,0,.14)!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-category-bar{
    position:sticky!important;
    top:76px!important;
    z-index:10!important;
    margin-bottom:4px!important;
    padding:1px 0!important;
    background:#080c13!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    padding:0 1px 5px!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-search-box{
    background:#101620!important;
    border-color:rgba(255,255,255,.075)!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-messages-btn,
  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-upload-head{
    border-color:rgba(128,105,255,.30)!important;
    background:rgba(119,104,255,.10)!important;
  }

  /* ---------- Unified composer ---------- */
  body.vw-android-room-shell.vw-private-thread-open #chatForm{
    border:1px solid rgba(119,104,255,.18)!important;
    border-radius:18px!important;
    background:
      linear-gradient(180deg,rgba(10,14,23,.97),rgba(7,10,17,.985))!important;
    box-shadow:
      0 10px 28px rgba(0,0,0,.28),
      inset 0 1px 0 rgba(255,255,255,.025)!important;
  }

  body.vw-android-room-shell.vw-private-thread-open #chatForm .gif-picker-btn{
    border-color:rgba(255,255,255,.07)!important;
    background:rgba(255,255,255,.03)!important;
  }

  body.vw-android-room-shell.vw-private-thread-open #chatForm input,
  body.vw-android-room-shell.vw-private-thread-open #chatForm textarea{
    background:rgba(4,8,14,.45)!important;
    border-color:rgba(255,255,255,.07)!important;
  }

  /* ---------- Media cards: let the media, not purple chrome, dominate ---------- */
  body.vw-private-thread-open .private-thread-messages .msg-image,
  body.vw-private-thread-open .private-thread-messages .private-media-image-card,
  body.vw-private-thread-open .private-thread-messages .private-media-video-card,
  body.vw-private-thread-open .private-thread-messages .private-media-card{
    border-style:solid!important;
    border-width:1px!important;
    border-color:rgba(119,104,255,.17)!important;
    box-shadow:0 7px 20px rgba(0,0,0,.16)!important;
  }
}

@media(max-width:380px){
  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray{
    left:5px!important;
    right:5px!important;
    border-radius:14px!important;
  }

  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-category-chip,
  body.vw-android-room-shell.vw-r5-premium-layout-ready.vw-gif-tray-open #gifTray .gif-category-more{
    height:26px!important;
    padding-left:7px!important;
    padding-right:7px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.vw-android-room-shell.vw-r5-premium-layout-ready .stage,
  body.vw-android-room-shell.vw-r5-premium-layout-ready .private-messages-surface{
    transition:none!important;
  }
}
