/* VR_ROOM_R65_R3_SHARED_MODE_COLOR_CONSUMER */
/*
 * VELVET ROOM — SHARED PROFILE / APP SHELL V1
 * Ecosystem profile grammar with Velvet Room persona atmospheres.
 */
:root{
  --vr-shell-h:76px;
  --vr-shell-card:rgba(10,9,17,.88);
  --vr-shell-border:rgba(255,255,255,.13);
  --vr-shell-muted:rgba(255,255,255,.60);
  --vr-shell-accent:var(--vr-social-1);
  --vr-shell-accent-rgb:var(--vr-social-rgb);
  --vr-shell-accent2:var(--vr-social-2);
}
html,body{min-height:100%}
body.vr-app-shell{
  padding-bottom:calc(var(--vr-shell-h) + 22px + env(safe-area-inset-bottom)) !important;
}
body.vr-mode-social{
  --vr-shell-accent:var(--vr-social-1);
  --vr-shell-accent-rgb:var(--vr-social-rgb);
  --vr-shell-accent2:var(--vr-social-2);
}
body.vr-mode-friends{
  --vr-shell-accent:var(--vr-friends-1);
  --vr-shell-accent-rgb:var(--vr-friends-rgb);
  --vr-shell-accent2:var(--vr-friends-2);
}
body.vr-mode-work{
  --vr-shell-accent:var(--vr-work-1);
  --vr-shell-accent-rgb:var(--vr-work-rgb);
  --vr-shell-accent2:var(--vr-work-2);
}

#vrEcosystemHeader{
  position:sticky;
  top:0;
  z-index:8200;
  min-height:66px;
  padding:calc(8px + env(safe-area-inset-top)) 14px 8px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  background:linear-gradient(180deg,rgba(5,4,10,.96),rgba(7,6,12,.88));
  border-bottom:1px solid rgba(var(--vr-shell-accent-rgb),.24);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
  box-shadow:0 10px 32px rgba(0,0,0,.22);
}
#vrEcosystemHeader .vrEcosystemBack,
#vrEcosystemHeader .vrEcosystemHeaderAction{
  width:44px;height:44px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid var(--vr-shell-border);
  background:rgba(255,255,255,.035);
  color:#fff;text-decoration:none;
  font:700 22px/1 system-ui,-apple-system,sans-serif;
}
#vrEcosystemHeader .vrEcosystemHeaderAction{font-size:18px}
#vrEcosystemHeader .vrEcosystemTitle{text-align:center;min-width:0}
#vrEcosystemHeader .vrEcosystemTitle strong{
  display:block;
  font:800 15px/1.1 system-ui,-apple-system,sans-serif;
  letter-spacing:.20em;color:#fff;
}
#vrEcosystemHeader .vrEcosystemTitle span{
  display:block;margin-top:5px;
  font:700 10px/1 system-ui,-apple-system,sans-serif;
  text-transform:uppercase;letter-spacing:.13em;
  color:var(--vr-shell-accent);
}
#vrEcosystemHeader .vrEcosystemHeaderTools{display:flex;gap:7px;justify-content:flex-end}

body.vr-surface-profile .heroBtn,
body.vr-surface-profile .heroMiniBtn,
body.vr-surface-channel button{
  border-radius:17px !important;
}
body.vr-surface-profile .heroQuickActions{gap:8px !important}
body.vr-surface-profile [data-vr-mode-switch][hidden],
body.vr-surface-channel [data-vr-mode-switch][hidden]{
  display:none !important;
}
body.vr-surface-profile [data-vr-mode-switch],
body.vr-surface-channel [data-vr-mode-switch]{
  transition:opacity .18s ease,transform .18s ease,border-color .18s ease;
}
body.vr-surface-profile [data-vr-mode-authorized="1"],
body.vr-surface-channel [data-vr-mode-authorized="1"]{
  border-color:rgba(var(--vr-shell-accent-rgb),.36) !important;
}

#vrOwnerProfileHub{
  width:min(100% - 28px,760px);
  margin:22px auto 30px;
  position:relative;z-index:5;
}
#vrOwnerProfileHub .vrOwnerSection{margin:0 0 22px}
#vrOwnerProfileHub .vrOwnerHeading{
  margin:0 0 10px 7px;
  font:800 12px/1 system-ui,-apple-system,sans-serif;
  color:rgba(var(--vr-shell-accent-rgb),.92);
  text-transform:uppercase;letter-spacing:.18em;
}
#vrOwnerProfileHub .vrOwnerGrid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;
}
#vrOwnerProfileHub .vrOwnerTile{
  min-height:100px;padding:16px;border-radius:22px;
  border:1px solid rgba(var(--vr-shell-accent-rgb),.24);
  background:
    linear-gradient(145deg,rgba(var(--vr-shell-accent-rgb),.075),rgba(7,7,13,.88) 56%),
    var(--vr-shell-card);
  color:#fff;text-decoration:none;
  display:flex;align-items:center;gap:14px;
  box-shadow:0 14px 38px rgba(0,0,0,.22);
}
#vrOwnerProfileHub .vrOwnerTile:active{transform:scale(.985)}
#vrOwnerProfileHub .vrOwnerIcon{
  width:46px;height:46px;flex:0 0 46px;border-radius:16px;
  display:grid;place-items:center;
  border:1px solid rgba(var(--vr-shell-accent-rgb),.26);
  background:rgba(var(--vr-shell-accent-rgb),.09);
  color:var(--vr-shell-accent);font-size:22px;
}
#vrOwnerProfileHub .vrOwnerCopy{min-width:0}
#vrOwnerProfileHub .vrOwnerCopy b{
  display:block;font:800 16px/1.15 system-ui,-apple-system,sans-serif;
}
#vrOwnerProfileHub .vrOwnerCopy span{
  display:block;margin-top:5px;color:var(--vr-shell-muted);
  font:600 12px/1.35 system-ui,-apple-system,sans-serif;
}

#vrAppDock{
  position:fixed;z-index:9000;left:0;right:0;bottom:0;
  height:calc(var(--vr-shell-h) + env(safe-area-inset-bottom));
  padding:7px 8px env(safe-area-inset-bottom);
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  background:rgba(5,5,9,.94);
  border-top:1px solid rgba(var(--vr-shell-accent-rgb),.24);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  box-shadow:0 -16px 42px rgba(0,0,0,.38);
}
#vrAppDock .vrDockItem{
  border:0;background:transparent;color:rgba(255,255,255,.58);
  text-decoration:none;min-width:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  border-radius:18px;font-family:system-ui,-apple-system,sans-serif;
}
#vrAppDock .vrDockItem .vrDockIcon{
  height:30px;display:grid;place-items:center;font-size:24px;line-height:1;
}
#vrAppDock .vrDockItem .vrDockLabel{
  font-size:10px;font-weight:800;line-height:1;white-space:nowrap;
}
#vrAppDock .vrDockItem.is-active{
  color:var(--vr-shell-accent);
  background:linear-gradient(180deg,rgba(var(--vr-shell-accent-rgb),.13),rgba(var(--vr-shell-accent-rgb),.025));
}
#vrAppDock #vrDockCreate .vrDockIcon{
  width:48px;height:48px;margin-top:-22px;border-radius:50%;
  font-size:31px;color:white;
  background:radial-gradient(circle at 40% 35%,var(--vr-shell-accent),var(--vr-shell-accent2) 62%,#28103d);
  border:5px solid rgba(5,5,9,.96);
  box-shadow:0 0 0 1px rgba(var(--vr-shell-accent-rgb),.32),0 0 28px rgba(var(--vr-shell-accent-rgb),.34);
}
#vrAppDock #vrDockMe .vrDockIcon{
  width:30px;height:30px;border-radius:50%;overflow:hidden;
  border:1px solid rgba(var(--vr-shell-accent-rgb),.42);
}
#vrAppDock #vrDockMe .vrDockIcon img{
  width:100%;height:100%;object-fit:cover;display:block;
}

#vrCreateBackdrop{
  position:fixed;inset:0;z-index:9040;background:rgba(0,0,0,.58);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
}
#vrCreateSheet{
  position:fixed;z-index:9050;left:12px;right:12px;
  bottom:calc(var(--vr-shell-h) + 10px + env(safe-area-inset-bottom));
  width:min(calc(100% - 24px),620px);margin:auto;
  border:1px solid rgba(var(--vr-shell-accent-rgb),.28);
  border-radius:26px;
  background:
    radial-gradient(circle at 85% 0%,rgba(var(--vr-shell-accent-rgb),.14),transparent 260px),
    rgba(10,9,17,.97);
  box-shadow:0 20px 60px rgba(0,0,0,.42);
  padding:14px;
}
#vrCreateSheet .vrCreateGrab{
  width:42px;height:4px;border-radius:99px;margin:2px auto 12px;background:rgba(255,255,255,.20);
}
#vrCreateSheet .vrCreateTitle{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 2px 12px;
}
#vrCreateSheet .vrCreateTitle strong{
  font:800 18px/1.2 system-ui,-apple-system,sans-serif;
}
#vrCreateSheet .vrCreateClose{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--vr-shell-border);
  background:rgba(255,255,255,.04);color:#fff;font-size:22px;
}
#vrCreateSheet .vrCreateGrid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;
}
#vrCreateSheet .vrCreateAction{
  min-height:92px;padding:15px;border-radius:20px;
  border:1px solid var(--vr-shell-border);background:rgba(255,255,255,.035);
  color:#fff;text-decoration:none;display:flex;gap:12px;align-items:center;
}
#vrCreateSheet .vrCreateAction .vrCreateIcon{
  width:42px;height:42px;flex:0 0 42px;border-radius:15px;
  display:grid;place-items:center;background:rgba(var(--vr-shell-accent-rgb),.10);
  border:1px solid rgba(var(--vr-shell-accent-rgb),.24);font-size:22px;
}
#vrCreateSheet .vrCreateAction b{
  display:block;font:800 15px/1.15 system-ui,-apple-system,sans-serif;
}
#vrCreateSheet .vrCreateAction span{
  display:block;margin-top:4px;color:var(--vr-shell-muted);
  font:600 11px/1.3 system-ui,-apple-system,sans-serif;
}

@media(max-width:430px){
  #vrEcosystemHeader{grid-template-columns:44px minmax(0,1fr) auto;padding-left:10px;padding-right:10px}
  #vrOwnerProfileHub{width:calc(100% - 20px)}
  #vrOwnerProfileHub .vrOwnerGrid{gap:9px}
  #vrOwnerProfileHub .vrOwnerTile{padding:13px;min-height:92px}
  #vrAppDock{padding-left:4px;padding-right:4px}
}

/* VR_ROOM_R39_SHARED_CHROME_DENSITY
   Existing shared app-shell authority only.
   Purpose: compact common chrome without changing routes, IDs, listeners,
   mode identity, post/profile content, or surface-specific presentation. */
:root{
  --vr-shell-h:64px;
}
#vrEcosystemHeader{
  min-height:58px;
  padding:calc(6px + env(safe-area-inset-top)) 12px 6px;
}
#vrEcosystemHeader .vrEcosystemBack,
#vrEcosystemHeader .vrEcosystemHeaderAction{
  width:40px;
  height:40px;
}
#vrEcosystemHeader .vrEcosystemTitle span{
  margin-top:2px;
}
#vrAppDock{
  min-height:64px;
  padding-top:5px;
  padding-bottom:calc(5px + env(safe-area-inset-bottom));
}
#vrAppDock .vrDockItem{
  min-height:50px;
}
#vrAppDock .vrDockIcon{
  line-height:1;
}
#vrAppDock .vrDockLabel{
  line-height:1.05;
}

/* VR_ROOM_R50_PROFILE_PREMIUM_OWNER_SURFACE */
body.vr-surface-profile #vrOwnerProfileHub{width:min(100% - 24px,760px);margin:14px auto 22px}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerSection{margin:0 0 12px}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerHeading{margin:0 0 7px 3px;font-size:10px;letter-spacing:.16em;opacity:.78}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerTile{min-height:58px;padding:9px 10px;border-radius:15px;gap:8px;box-shadow:0 8px 22px rgba(0,0,0,.18)}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerIcon{width:32px;height:32px;flex:0 0 32px;border-radius:11px;font-size:16px}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerCopy b{font-size:12px;line-height:1.1}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerCopy span{display:none}
@media(max-width:430px){
 body.vr-surface-profile #vrOwnerProfileHub{width:calc(100% - 18px);margin-top:10px}
 body.vr-surface-profile #vrOwnerProfileHub .vrOwnerGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 body.vr-surface-profile #vrOwnerProfileHub .vrOwnerTile{min-height:54px;padding:8px 7px;justify-content:center}
 body.vr-surface-profile #vrOwnerProfileHub .vrOwnerCopy b{font-size:11px}
}
/* VR_ROOM_R54_OWNER_HUB_PURPLE — Profile only */
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerTile:focus-visible{outline:1px solid rgba(155,77,255,.72)!important;outline-offset:-2px!important}
body.vr-surface-profile #vrOwnerProfileHub .vrOwnerIcon{background:rgba(155,77,255,.12)!important;border-color:rgba(155,77,255,.22)!important}