/* VR_OWNER_EDITING_PLACEMENT_O2_20260824 */

/* Profile Preview is viewer-facing, even when the owner previews themself. */
body[data-vr-owner-editing-o2-surface="profile"] :is(
  #editHeroBtn,#editAvatarBtn,#editProfileBtn,#ownerModeSwitchRow,
  #ownerMediaSaveBar,#saveAvatarBtn,#cancelAvatarBtn,#saveBannerBtn,#cancelBannerBtn,
  #vrOwnerProfileHub
){
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* Room owner editing: direct, compact, obvious. */
body[data-vr-owner-editing-o2-surface="room"] #hero .heroBanner,
body[data-vr-owner-editing-o2-surface="room"] #hero .avatarDock{
  position:relative !important;
}
body[data-vr-owner-editing-o2-surface="room"] .vrOwnerMediaEditO2,
body[data-vr-owner-editing-o2-surface="room"] .vrOwnerAvatarEditO2{
  appearance:none !important;
  position:absolute !important;
  z-index:80 !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:12px !important;
  background:rgba(5,5,7,.90) !important;
  color:#fff !important;
  font-size:18px !important;
  box-shadow:0 8px 22px rgba(0,0,0,.30) !important;
}
body[data-vr-owner-editing-o2-surface="room"] .vrOwnerMediaEditO2{
  right:14px !important;
  bottom:14px !important;
}
body[data-vr-owner-editing-o2-surface="room"] .vrOwnerAvatarEditO2{
  right:-8px !important;
  bottom:-8px !important;
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  min-height:36px !important;
  font-size:15px !important;
  border-radius:10px !important;
}

#vrRoomOwnerQuickEditO2{
  width:100% !important;
  margin:14px 0 0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  border-top:1px solid rgba(255,255,255,.10) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  background:#050507 !important;
}
#vrRoomOwnerQuickEditO2 > :is(button,a){
  min-width:0 !important;
  min-height:64px !important;
  padding:8px 4px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  border:0 !important;
  border-right:1px solid rgba(255,255,255,.10) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#fff !important;
  text-decoration:none !important;
  box-shadow:none !important;
}
#vrRoomOwnerQuickEditO2 > :last-child{border-right:0 !important}
#vrRoomOwnerQuickEditO2 span{font-size:18px !important;line-height:1 !important}
#vrRoomOwnerQuickEditO2 b{font-size:10px !important;line-height:1.12 !important;font-weight:900 !important}
#vrOwnerEditStatusO2{
  min-height:20px !important;
  padding:7px 2px 0 !important;
  color:rgba(255,255,255,.66) !important;
  font-size:11px !important;
}
#vrOwnerEditStatusO2.is-bad{color:#ff9aa9 !important}

/* Fix the cramped Room mode switch shown on phone. */
body[data-vr-owner-editing-o2-surface="room"] #ownerModeSwitchRow{
  width:100% !important;
  margin-top:12px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:0 !important;
  border-top:1px solid rgba(255,255,255,.10) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  background:#050507 !important;
  overflow:hidden !important;
  flex-wrap:nowrap !important;
}
body[data-vr-owner-editing-o2-surface="room"] #ownerModeSwitchRow[hidden]{display:none !important}
body[data-vr-owner-editing-o2-surface="room"] #ownerModeSwitchRow button{
  width:100% !important;
  min-width:0 !important;
  height:50px !important;
  padding:0 6px !important;
  border:0 !important;
  border-right:1px solid rgba(255,255,255,.10) !important;
  border-bottom:2px solid transparent !important;
  border-radius:0 !important;
  background:transparent !important;
  color:rgba(255,255,255,.68) !important;
  font-size:13px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}
body[data-vr-owner-editing-o2-surface="room"] #ownerModeSwitchRow button:last-child{border-right:0 !important}
body[data-vr-owner-editing-o2-surface="room"] #ownerModeSwitchRow button.is-active{
  color:#fff !important;
  border-bottom-color:var(--vr-u-accent,var(--mode-accent,#ff4fa3)) !important;
  background:rgba(255,255,255,.035) !important;
}

/* In-Room preview/media cards join platform unification and black-card doctrine. */
body[data-vr-owner-editing-o2-surface="room"] .libraryRow{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  overflow:visible !important;
}
body[data-vr-owner-editing-o2-surface="room"] .libraryTile{
  width:100% !important;
  height:auto !important;
  aspect-ratio:1/1 !important;
  flex:none !important;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:#050507 !important;
  box-shadow:none !important;
}
body[data-vr-owner-editing-o2-surface="room"] .channelPost{
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:#050507 !important;
  box-shadow:none !important;
}
body[data-vr-owner-editing-o2-surface="room"] .channelPost .postHead{
  background:#050507 !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
}

/* Owner identity sheet */
.vrOwnerSheetBackdropO2{
  position:fixed !important;
  inset:0 !important;
  z-index:100000 !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  padding:16px !important;
  background:rgba(0,0,0,.76) !important;
}
.vrOwnerSheetO2{
  width:min(100%,640px) !important;
  max-height:min(88dvh,760px) !important;
  overflow:auto !important;
  padding:18px !important;
  border:1px solid rgba(255,255,255,.13) !important;
  border-radius:18px !important;
  background:#08080b !important;
  color:#fff !important;
  box-shadow:0 28px 90px rgba(0,0,0,.60) !important;
}
.vrOwnerSheetHeadO2{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin-bottom:16px !important;
}
.vrOwnerSheetHeadO2 strong{display:block !important;font-size:20px !important}
.vrOwnerSheetHeadO2 small{display:block !important;margin-top:4px !important;color:rgba(255,255,255,.58) !important}
.vrOwnerSheetHeadO2 > button{
  width:40px !important;height:40px !important;border-radius:10px !important;
  border:1px solid rgba(255,255,255,.12) !important;background:#050507 !important;color:#fff !important;font-size:24px !important;
}
.vrOwnerSheetO2 > label:not(.vrOwnerToggleO2){display:grid !important;gap:6px !important;margin-top:12px !important;font-size:12px !important;font-weight:850 !important}
.vrOwnerSheetO2 input[type="text"],
.vrOwnerSheetO2 input:not([type]),
.vrOwnerSheetO2 textarea{
  width:100% !important;border:1px solid rgba(255,255,255,.14) !important;border-radius:10px !important;
  background:#050507 !important;color:#fff !important;padding:12px !important;font:inherit !important;
}
.vrOwnerToggleO2{
  display:flex !important;align-items:center !important;gap:10px !important;margin-top:14px !important;
  color:rgba(255,255,255,.86) !important;font-size:12px !important;font-weight:800 !important;
}
.vrOwnerToggleO2 input{width:18px !important;height:18px !important}
.vrOwnerSheetActionsO2{
  display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;margin-top:18px !important;
}
.vrOwnerSheetActionsO2 :is(button,a){
  min-height:46px !important;display:grid !important;place-items:center !important;border-radius:10px !important;
  border:1px solid rgba(255,255,255,.13) !important;background:#050507 !important;color:#fff !important;
  text-decoration:none !important;font-weight:900 !important;
}
.vrOwnerSheetActionsO2 button{border-color:var(--vr-u-accent,#ff4fa3) !important}
.vrOwnerSheetStatusO2{min-height:20px !important;margin-top:9px !important;color:rgba(255,255,255,.66) !important;font-size:11px !important}

/* Full profile editor: identity fields are first-class, not hidden in old settings. */
body[data-vr-owner-editing-o2-surface="profile-edit"] #vrProfileIdentityEditorO2{
  border-radius:14px !important;
  background:#08080b !important;
  box-shadow:none !important;
}
.vrO2EditorHead{
  display:flex !important;align-items:flex-start !important;justify-content:space-between !important;gap:12px !important;
}
.vrO2EditorHead h2{margin:0 !important}
.vrO2EditorHead p{margin:5px 0 0 !important;color:rgba(255,255,255,.58) !important;font-size:12px !important}
.vrO2EditorHead a{color:var(--vr-u-accent,#ff4fa3) !important;font-size:12px !important;font-weight:900 !important;text-decoration:none !important}
.vrO2PersonaTabs{
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;margin:16px 0 !important;
  border-top:1px solid rgba(255,255,255,.10) !important;border-bottom:1px solid rgba(255,255,255,.10) !important;
}
.vrO2PersonaTabs button{
  min-height:46px !important;border:0 !important;border-right:1px solid rgba(255,255,255,.10) !important;border-radius:0 !important;
  background:transparent !important;color:rgba(255,255,255,.62) !important;font-weight:900 !important;
}
.vrO2PersonaTabs button:last-child{border-right:0 !important}
.vrO2PersonaTabs button.is-active{color:#fff !important;border-bottom:2px solid var(--vr-u-accent,#ff4fa3) !important}
.vrO2MediaGrid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:12px !important}
.vrO2MediaField{display:grid !important;gap:8px !important}
.vrO2MediaField > span{font-size:11px !important;font-weight:900 !important;color:rgba(255,255,255,.68) !important}
.vrO2MediaField > button{
  min-height:42px !important;border-radius:10px !important;border:1px solid rgba(255,255,255,.12) !important;
  background:#050507 !important;color:#fff !important;font-weight:900 !important;
}
.vrO2AvatarPreview,.vrO2HeroPreview{
  width:100% !important;overflow:hidden !important;border:1px solid rgba(255,255,255,.10) !important;background:#050507 !important;
}
.vrO2AvatarPreview{aspect-ratio:1/1 !important;border-radius:14px !important}
.vrO2HeroPreview{aspect-ratio:16/9 !important;border-radius:12px !important}
.vrO2AvatarPreview img,.vrO2HeroPreview :is(img,video){width:100% !important;height:100% !important;object-fit:cover !important;display:block !important}
.vrO2Field{display:grid !important;gap:6px !important;margin-top:12px !important}
.vrO2Field label{font-size:11px !important;font-weight:900 !important;color:rgba(255,255,255,.68) !important}
.vrO2Field :is(input,textarea){
  width:100% !important;border-radius:10px !important;border:1px solid rgba(255,255,255,.14) !important;
  background:#050507 !important;color:#fff !important;padding:12px !important;
}
.vrO2EditorSaveRow{display:flex !important;align-items:center !important;gap:12px !important;margin-top:16px !important}
#vrO2EditorSave{
  min-height:46px !important;padding:0 18px !important;border-radius:10px !important;
  border:1px solid var(--vr-u-accent,#ff4fa3) !important;background:#050507 !important;color:#fff !important;font-weight:950 !important;
}
#vrO2EditorStatus{color:rgba(255,255,255,.66) !important;font-size:11px !important}

@media(max-width:430px){
  #vrRoomOwnerQuickEditO2{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  #vrRoomOwnerQuickEditO2 > :is(button,a){min-height:60px !important}
  .vrO2MediaGrid{grid-template-columns:1fr 1fr !important}
  .vrOwnerSheetBackdropO2{padding:8px !important}
  .vrOwnerSheetO2{border-radius:16px 16px 0 0 !important}
}

/* VR_OWNER_EDIT_SHEET_MOBILE_O4_20260824
   Keep the Room owner quick-edit sheet fully usable between the fixed app
   header and bottom navigation. The sheet scrolls internally; its action row
   remains reachable and no content is trapped behind the bottom dock.
*/
.vrOwnerSheetBackdropO2{
  box-sizing:border-box !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:
    max(84px, calc(env(safe-area-inset-top, 0px) + 72px))
    10px
    max(112px, calc(env(safe-area-inset-bottom, 0px) + 96px))
    !important;
  overflow:hidden !important;
  overscroll-behavior:contain !important;
  z-index:2147483000 !important;
}

.vrOwnerSheetO2{
  box-sizing:border-box !important;
  width:min(100%,640px) !important;
  max-height:
    calc(
      100dvh
      - max(84px, calc(env(safe-area-inset-top, 0px) + 72px))
      - max(112px, calc(env(safe-area-inset-bottom, 0px) + 96px))
    ) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  scroll-padding-top:82px !important;
  scroll-padding-bottom:92px !important;
  padding:0 18px 18px !important;
}

.vrOwnerSheetHeadO2{
  position:sticky !important;
  top:0 !important;
  z-index:5 !important;
  margin:0 -18px 12px !important;
  padding:16px 18px 12px !important;
  background:rgba(8,8,11,.985) !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
}

.vrOwnerSheetActionsO2{
  position:sticky !important;
  bottom:-1px !important;
  z-index:5 !important;
  margin:18px -18px -18px !important;
  padding:12px 18px 18px !important;
  background:rgba(8,8,11,.985) !important;
  border-top:1px solid rgba(255,255,255,.08) !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
}

.vrOwnerSheetStatusO2{
  position:sticky !important;
  bottom:70px !important;
  z-index:6 !important;
  margin:0 -18px !important;
  padding:6px 18px 0 !important;
  background:rgba(8,8,11,.985) !important;
}

@media(max-width:430px){
  .vrOwnerSheetBackdropO2{
    padding:
      max(72px, calc(env(safe-area-inset-top, 0px) + 62px))
      6px
      max(108px, calc(env(safe-area-inset-bottom, 0px) + 92px))
      !important;
  }

  .vrOwnerSheetO2{
    width:100% !important;
    max-height:
      calc(
        100dvh
        - max(72px, calc(env(safe-area-inset-top, 0px) + 62px))
        - max(108px, calc(env(safe-area-inset-bottom, 0px) + 92px))
      ) !important;
    border-radius:16px !important;
  }

  .vrOwnerSheetActionsO2{
    grid-template-columns:1fr 1fr !important;
  }
}