/* Pulse Phase 58: one media conversation viewer + Profile Atmospheres. */

/* --------------------------------------------------------------------------
   Immersive media conversation
   Desktop: media never scrolls away; only the right conversation scrolls.
   Mobile: media remains anchored in the top pane while comments scroll below.
   -------------------------------------------------------------------------- */
body.phase32-media-open{overflow:hidden!important}
.phase32-media-modal.phase58-fixed-media-stage,
.phase32-media-modal{overflow:hidden!important}
.phase32-media-modal-body{height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;overscroll-behavior:none!important;scrollbar-gutter:auto!important}
.phase47-media-viewer{height:100dvh!important;min-height:0!important;max-height:100dvh!important;overflow:hidden!important;align-items:stretch!important}
.phase47-media-stage{position:relative!important;top:auto!important;height:100dvh!important;min-height:0!important;max-height:100dvh!important;overflow:hidden!important;align-self:stretch!important}
.phase47-media-panel{height:100dvh!important;min-height:0!important;max-height:100dvh!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;align-self:stretch!important}
.phase47-media-panel-head{position:relative!important;top:auto!important;flex:0 0 auto!important;overflow:visible!important}
.phase47-media-conversation{display:flex!important;flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;flex-direction:column!important}
.phase47-media-comments-title{position:relative!important;top:auto!important;flex:0 0 auto!important}
.phase48-media-comment-flow,.phase47-media-comment-scroll{display:block!important;flex:1 1 auto!important;min-height:0!important;height:auto!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;padding:1rem 1rem 1.4rem!important;scrollbar-width:thin!important;scrollbar-gutter:stable!important}
.phase47-media-composer{position:relative!important;bottom:auto!important;flex:0 0 auto!important;z-index:8!important}
.phase32-media-comment,.phase32-media-comment-body{overflow:visible!important}
.phase47-media-stage img,.phase47-media-stage video{max-height:calc(100dvh - 6rem)!important}

@media(min-width:821px){
  .phase47-media-viewer{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(390px,460px)!important}
  .phase47-media-stage{padding:4.5rem 1.5rem 1.5rem!important}
  .phase47-media-panel{border-left:1px solid rgba(255,255,255,.1)!important;border-top:0!important}
}

@media(max-width:820px){
  .phase32-media-modal-body{height:100dvh!important}
  .phase47-media-viewer.phase58-mobile-split,.phase47-media-viewer{display:flex!important;flex-direction:column!important;height:100dvh!important;min-height:0!important;overflow:hidden!important}
  .phase47-media-stage{position:relative!important;flex:0 0 43dvh!important;width:100%!important;height:43dvh!important;min-height:43dvh!important;max-height:43dvh!important;padding:3.7rem .45rem .45rem!important}
  .phase47-media-stage img,.phase47-media-stage video,.phase44-photo-zoom-wrap img.phase44-zoom-target{max-height:37dvh!important}
  .phase47-media-panel{flex:1 1 auto!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;border-left:0!important;border-top:1px solid rgba(255,255,255,.1)!important}
  .phase47-media-panel-head{padding:.72rem .8rem .6rem!important}
  .phase47-media-caption{max-height:56px!important}
  .phase47-media-conversation{min-height:0!important}
  .phase48-media-comment-flow,.phase47-media-comment-scroll{min-height:0!important;max-height:none!important;overflow-y:auto!important;padding:.7rem .8rem 1rem!important}
  .phase47-media-composer{padding:.6rem .8rem calc(.7rem + env(safe-area-inset-bottom))!important}
  .phase47-media-composer form{grid-template-columns:minmax(0,1fr) auto!important}
  .phase47-media-composer button[type="submit"]{width:auto!important}
}
@media(max-width:520px){
  .phase47-media-stage{flex-basis:39dvh!important;height:39dvh!important;min-height:39dvh!important;max-height:39dvh!important}
  .phase47-media-stage img,.phase47-media-stage video,.phase44-photo-zoom-wrap img.phase44-zoom-target{max-height:33dvh!important}
  .phase47-media-owner h2{font-size:.98rem!important}
  .phase47-media-panel-head .phase47-media-caption{font-size:.82rem!important}
}

/* --------------------------------------------------------------------------
   Profile Atmosphere
   -------------------------------------------------------------------------- */
.phase58-profile-page{position:relative;isolation:isolate;margin:-.35rem;padding:.35rem;border-radius:30px;min-height:60vh;--phase58-motion:18s}
.phase58-profile-page.motion-off{--phase58-motion:0s}.phase58-profile-page.motion-lively{--phase58-motion:8s}
.phase58-profile-page>.phase58-profile-bg-layer,.phase58-profile-page>.phase58-profile-ambient{position:absolute;inset:0;border-radius:30px;pointer-events:none;z-index:-2;overflow:hidden}
.phase58-profile-page>.phase58-profile-bg-layer{background-image:var(--phase58-profile-bg-image,none);background-position:center;background-repeat:no-repeat;background-size:cover;opacity:.9}
.phase58-profile-page.bgmode-soft_focus>.phase58-profile-bg-layer{filter:blur(16px) saturate(1.12);transform:scale(1.035);opacity:.68}
.phase58-profile-page.bgmode-dim>.phase58-profile-bg-layer{filter:saturate(.82) brightness(.48);opacity:.92}
.phase58-profile-page.bgmode-tile>.phase58-profile-bg-layer{background-size:360px auto;background-repeat:repeat;background-position:top left;opacity:.58}
.phase58-profile-page.has-custom-bg::after{content:"";position:absolute;inset:0;border-radius:30px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(7,8,18,.18),rgba(7,8,18,.58) 34%,rgba(7,8,18,.78));}
.phase58-profile-page>.card,.phase58-profile-page>.phase30-profile-hub,.phase58-profile-page>.phase48-profile-feed-layout,.phase58-profile-page>.grid{position:relative;z-index:1}

.phase58-profile-page.scene-aurora>.phase58-profile-ambient{background:radial-gradient(circle at 20% 16%,color-mix(in srgb,var(--profile-accent,#8b5cf6) 38%,transparent),transparent 30%),radial-gradient(circle at 76% 30%,rgba(34,211,238,.2),transparent 28%),radial-gradient(circle at 55% 82%,rgba(236,72,153,.16),transparent 26%);filter:blur(10px);animation:phase58Aurora var(--phase58-motion) ease-in-out infinite alternate}
.phase58-profile-page.scene-stars>.phase58-profile-ambient{background-image:radial-gradient(circle,rgba(255,255,255,.72) 0 1px,transparent 1.7px),radial-gradient(circle,rgba(167,139,250,.72) 0 1px,transparent 1.8px);background-size:48px 48px,83px 83px;background-position:0 0,21px 17px;opacity:.32;animation:phase58Drift var(--phase58-motion) linear infinite}
.phase58-profile-page.scene-pulse_rings>.phase58-profile-ambient{background:repeating-radial-gradient(circle at 50% 18%,transparent 0 44px,color-mix(in srgb,var(--profile-accent,#8b5cf6) 24%,transparent) 46px 48px,transparent 50px 88px);opacity:.42;animation:phase58Pulse var(--phase58-motion) ease-in-out infinite}
.phase58-profile-page.scene-neon_grid>.phase58-profile-ambient{background-image:linear-gradient(color-mix(in srgb,var(--profile-accent,#8b5cf6) 18%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--profile-accent,#8b5cf6) 18%,transparent) 1px,transparent 1px),linear-gradient(180deg,transparent,rgba(3,5,15,.8));background-size:46px 46px,46px 46px,100% 100%;transform-origin:50% 0;opacity:.38;animation:phase58Grid var(--phase58-motion) ease-in-out infinite alternate}
.phase58-profile-page.scene-embers>.phase58-profile-ambient{background-image:radial-gradient(circle,rgba(251,146,60,.72) 0 2px,transparent 3px),radial-gradient(circle,rgba(244,63,94,.55) 0 1px,transparent 2px);background-size:64px 92px,91px 121px;background-position:9px 100%,41px 96%;opacity:.36;animation:phase58Embers var(--phase58-motion) linear infinite}
.phase58-profile-page.motion-off>.phase58-profile-ambient{animation:none!important}
@keyframes phase58Aurora{to{transform:translate3d(3%,-2%,0) scale(1.05);filter:blur(14px) hue-rotate(14deg)}}
@keyframes phase58Drift{to{background-position:48px 96px,104px 183px}}
@keyframes phase58Pulse{50%{opacity:.22;transform:scale(1.035)}100%{opacity:.5;transform:scale(1)}}
@keyframes phase58Grid{to{transform:perspective(700px) rotateX(3deg) translateY(12px);opacity:.52}}
@keyframes phase58Embers{to{background-position:9px -92px,41px -121px}}
@media(prefers-reduced-motion:reduce){.phase58-profile-page>.phase58-profile-ambient{animation:none!important}}

.phase58-now-signal{display:inline-flex;align-items:center;gap:.55rem;margin-top:.55rem;padding:.48rem .68rem;border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--profile-accent,#8b5cf6) 15%,rgba(255,255,255,.06)),rgba(255,255,255,.045));border:1px solid color-mix(in srgb,var(--profile-accent,#8b5cf6) 28%,rgba(255,255,255,.1));box-shadow:0 10px 30px rgba(0,0,0,.12);max-width:min(100%,500px)}
.phase58-now-signal>span{display:grid;place-items:center;min-width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.08);font-size:1.12rem}.phase58-now-signal>div{min-width:0}.phase58-now-signal small{display:block;color:#c4b5fd;font-size:.61rem;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.phase58-now-signal strong{display:block;margin-top:.08rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.82rem}

/* Profile editor cleanup + live atmosphere preview. */
.phase58-atmosphere-studio{margin-top:1rem!important;border:1px solid color-mix(in srgb,var(--phase58-preview-accent,#8b5cf6) 30%,rgba(255,255,255,.1))!important;background:linear-gradient(145deg,rgba(139,92,246,.1),rgba(255,255,255,.03))!important}
.phase58-atmosphere-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}.phase58-atmosphere-head h2{margin:0}.phase58-atmosphere-head p{margin:.28rem 0 0}
.phase58-atmosphere-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:1rem;align-items:start}
.phase58-atmosphere-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.phase58-atmosphere-controls .phase58-wide{grid-column:1/-1}
.phase58-atmosphere-preview{position:sticky;top:84px;min-height:300px;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:radial-gradient(circle at 20% 15%,color-mix(in srgb,var(--phase58-preview-accent,#8b5cf6) 35%,transparent),transparent 13rem),linear-gradient(145deg,#171a32,#080a17);box-shadow:0 22px 60px rgba(0,0,0,.28);isolation:isolate}
.phase58-atmosphere-preview::before{content:"";position:absolute;inset:0;background-image:var(--phase58-preview-image,none);background-size:cover;background-position:center;opacity:.42;z-index:-2}.phase58-atmosphere-preview::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(5,7,17,.8));z-index:-1}
.phase58-preview-orbit{position:absolute;width:220px;height:220px;border-radius:50%;border:1px solid color-mix(in srgb,var(--phase58-preview-accent,#8b5cf6) 42%,transparent);left:-80px;top:-60px;box-shadow:0 0 50px color-mix(in srgb,var(--phase58-preview-accent,#8b5cf6) 16%,transparent)}
.phase58-preview-card{position:absolute;left:1rem;right:1rem;bottom:1rem;padding:1rem;border-radius:20px;background:rgba(10,12,27,.78);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(16px)}
.phase58-preview-card b{display:block;font-size:1.05rem}.phase58-preview-card span{display:block;margin-top:.25rem;color:rgba(255,255,255,.7);font-size:.8rem}.phase58-preview-status{display:inline-flex!important;margin-top:.7rem!important;padding:.35rem .55rem;border-radius:999px;background:color-mix(in srgb,var(--phase58-preview-accent,#8b5cf6) 18%,rgba(255,255,255,.05));border:1px solid color-mix(in srgb,var(--phase58-preview-accent,#8b5cf6) 28%,rgba(255,255,255,.08));color:#fff!important}
@media(max-width:780px){.phase58-atmosphere-grid{grid-template-columns:1fr}.phase58-atmosphere-preview{position:relative;top:auto;min-height:230px}.phase58-atmosphere-controls{grid-template-columns:1fr}.phase58-atmosphere-controls .phase58-wide{grid-column:auto}}