/* Shared photographic surface. Theme composition may change; behavior does not. */
.memboux-media-card { border-radius:0!important; background:#e9e7e2!important; box-shadow:none!important; margin:0!important; }
.memboux-media-preview { background:#e9e7e2!important; }
.memboux-media-preview img { object-fit:cover; }
.memboux-media-card .lightbox-item { cursor:zoom-in; }
.memboux-media-card [data-type=video] { cursor:pointer; }
.memboux-media-card :is([data-media-like],[data-direct-media-download],[data-media-actions]>summary) { border:0!important; border-radius:3px!important; box-shadow:none!important; min-width:44px; min-height:44px; background:#ffffffed!important; color:#242421!important; transform:none!important; }
.memboux-media-card [data-like-heart] { color:inherit; }
[data-media-like][aria-pressed=true] [data-like-heart] { fill:#d65469!important; color:#d65469!important; }
@media (hover:hover) and (pointer:fine) {
  .memboux-media-card :is([data-media-like],[data-direct-media-download],[data-media-actions]) { opacity:0; transition:opacity 160ms ease; }
  .memboux-media-card:hover :is([data-media-like],[data-direct-media-download],[data-media-actions]),
  .memboux-media-card:is(:focus-visible,:has(:focus-visible)) :is([data-media-like],[data-direct-media-download],[data-media-actions]),
  .memboux-media-card [data-media-actions][open],.memboux-media-card [aria-pressed=true] { opacity:1; }
}
.memboux-brickwall { position:relative; display:block!important; gap:6px!important; }
.memboux-brickwall>.memboux-media-card { position:absolute; top:0; left:0; transition-property:background-color,border-color,box-shadow,opacity!important; }
.memboux-brickwall>.memboux-media-card .memboux-media-preview { aspect-ratio:auto!important; height:100%; }
.memboux-brickwall>.memboux-media-card>:is(.lightbox-item,a) { height:100%; }
.memboux-brickwall[data-gallery-preparing=true] { min-height:70svh; background:linear-gradient(90deg,#eeece7 49.4%,transparent 49.4% 50.6%,#eeece7 50.6%); }
.memboux-brickwall[data-gallery-preparing=true]>.memboux-media-card { visibility:hidden; }
.memboux-media-card[data-geometry-fallback=true] .memboux-media-preview img { object-fit:cover; }
#media-lightbox { position:fixed!important; inset:0!important; margin:0!important; width:100vw!important; height:100dvh!important; max-width:none!important; max-height:none!important; padding:0!important; border:0!important; border-radius:0!important; background:#121312!important; color:#fff; overflow:hidden; overscroll-behavior:none; }
#media-lightbox::backdrop { background:#121312; }
#lightbox-stage { position:relative; width:100%; height:100%; overflow:hidden; touch-action:none; user-select:none; }
#lightbox-content { position:absolute; inset:0; width:100%; height:100%; will-change:transform; }
.mv-slide { position:absolute; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.mv-image { display:block; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; transform-origin:center; will-change:transform; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.mv-video-surface { position:relative; width:100%; height:calc(100% - 112px); }
.mv-player { display:block; width:100%; height:100%; border:0; background:transparent; }
/* Canvas only: leave top chrome, the bottom control/seek/volume region and
   native center Play uncovered. The hole also keeps center taps native. */
.mv-video-gesture { position:absolute; inset:56px 0 112px; z-index:2; touch-action:pan-y; clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,calc(50% - 64px) calc(50% - 36px),calc(50% - 64px) calc(50% + 92px),calc(50% + 64px) calc(50% + 92px),calc(50% + 64px) calc(50% - 36px),calc(50% - 64px) calc(50% - 36px)); }
.mv-video-surface:is([data-playback=playing],[data-leaving=true]) .mv-video-gesture { clip-path:none; }
.mv-video-surface:fullscreen .mv-video-gesture { display:none; }
.mv-video-surface:-webkit-full-screen .mv-video-gesture { display:none; }
.mv-video-poster { position:absolute; width:100%; height:calc(100% - 112px); object-fit:contain; }
.mv-top,.mv-bottom { position:absolute; left:0; right:0; z-index:5; display:flex; align-items:center; gap:12px; padding:16px max(16px,env(safe-area-inset-right)) 16px max(16px,env(safe-area-inset-left)); pointer-events:none; }
.mv-top { top:0; padding-top:max(16px,env(safe-area-inset-top)); background:linear-gradient(#0007,transparent); }
.mv-bottom { bottom:0; padding-bottom:max(16px,env(safe-area-inset-bottom)); justify-content:center; background:linear-gradient(transparent,#0007); }
.mv-top>*:not(p),.mv-bottom>*:not(p) { pointer-events:auto; }
#media-lightbox :is(button,a) { min-height:44px; min-width:44px; border:0; border-radius:3px; background:#2229; color:#fff; display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; cursor:pointer; text-decoration:none; }
#media-lightbox :is(button,a):focus-visible { outline:2px solid #fff; outline-offset:3px; }
#media-lightbox :is(button,a):disabled { opacity:.2; cursor:default; }
#media-lightbox [hidden] { display:none!important; }
#lightbox-close { font-size:28px; }
#lightbox-download { margin-left:auto; gap:8px; font-size:12px; }
#lightbox-like { gap:6px; }
#lightbox-like svg { width:20px; height:20px; fill:transparent; }
#lightbox-title { max-width:50vw; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:12px; }
#lightbox-prev,#lightbox-next { position:absolute; z-index:5; top:calc(50% - 24px); font-size:28px; }
#lightbox-prev { left:max(12px,env(safe-area-inset-left)); }
#lightbox-next { right:max(12px,env(safe-area-inset-right)); }
#lightbox-zoom-controls { position:absolute; z-index:5; bottom:max(12px,env(safe-area-inset-bottom)); left:max(12px,env(safe-area-inset-left)); display:flex; }
#lightbox-count { font-size:12px; font-variant-numeric:tabular-nums; }
#lightbox-uploader { top:auto!important; bottom:max(70px,calc(env(safe-area-inset-bottom) + 58px)); font-size:11px; border:0!important; border-radius:0!important; background:transparent!important; }
#lightbox-report { top:68px!important; left:16px!important; font-size:11px; }
#lightbox-comments-button { top:68px!important; bottom:auto!important; right:16px!important; font-size:11px; }
#media-lightbox aside { color:#252723; background:#fff; }
#media-lightbox aside :is(button,a) { color:#252723; background:#eeece6; }
.mv-message { margin:32px; font-size:16px; }
.mv-top,.mv-bottom,#lightbox-prev,#lightbox-next,#lightbox-zoom-controls { transition:opacity 180ms ease; }
@media (hover:hover) { .mv-controls-idle :is(.mv-top,.mv-bottom,#lightbox-prev,#lightbox-next,#lightbox-zoom-controls) { opacity:0; } .mv-controls-idle :is(.mv-top,.mv-bottom,#lightbox-prev,#lightbox-next,#lightbox-zoom-controls):is(:focus-visible,:has(:focus-visible)) { opacity:1; } }
@media (max-width:640px) { #lightbox-title { display:none; } #lightbox-zoom-controls { bottom:max(64px,calc(env(safe-area-inset-bottom) + 52px)); } #lightbox-zoom-controls button { font-size:12px; min-width:40px; } #lightbox-prev,#lightbox-next { top:auto; bottom:max(12px,env(safe-area-inset-bottom)); } #lightbox-download span { display:none; } }
@media (prefers-reduced-motion:reduce) { #media-lightbox *, .memboux-media-card * { transition:none!important; } }

.mv-entitlement-note{font-size:11px;opacity:.7;max-width:24ch}.mv-top .mv-entitlement-note{margin-left:auto}#lightbox-comments-panel{touch-action:pan-y}
.mv-video-margin{position:absolute;top:64px;bottom:100px;width:18px;z-index:3;touch-action:none}.mv-video-margin-left{left:0}.mv-video-margin-right{right:0}

/* Quiet, coherent controls on the photographic canvas. */
#media-lightbox :is(button,a) { background:transparent; border-radius:0; }
#media-lightbox :is(button,a)>svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
#media-lightbox :is(button,a):active { background:#ffffff12; }
#lightbox-title { margin-right:auto; opacity:.7; }
#lightbox-like [data-like-count] { font-size:11px; opacity:.7; }
#lightbox-zoom-controls { border:1px solid #ffffff18; border-radius:2px; }
.mv-top { padding:12px max(8px,env(safe-area-inset-right)) 36px max(8px,env(safe-area-inset-left)); }
.mv-bottom { padding-bottom:max(18px,env(safe-area-inset-bottom)); }
.mv-controls-idle :is(.mv-top,.mv-bottom,#lightbox-prev,#lightbox-next,#lightbox-zoom-controls,#lightbox-uploader,#lightbox-report,#lightbox-comments-button) { opacity:0; pointer-events:none; }
.mv-controls-idle .mv-top>* { pointer-events:none; }
.mv-controls-idle .mv-top:has(:focus-visible)>* { pointer-events:auto; }
.mv-controls-idle :is(.mv-top,#lightbox-zoom-controls):is(:focus-visible,:has(:focus-visible)) { opacity:1; pointer-events:auto; }
@media(max-width:640px) {
  .memboux-media-card :is([data-media-like],[data-direct-media-download],[data-media-actions]>summary) { background:transparent!important; color:white!important; border:0!important; border-radius:0!important; box-shadow:none!important; backdrop-filter:none!important; filter:drop-shadow(0 1px 2px #0008); padding:10px; }
  .memboux-media-card [data-media-like] [data-like-count] { display:none; }
  .memboux-media-card [data-media-actions] { right:0; top:0; }
  .memboux-media-card [data-media-like] { right:0; bottom:0; }
  #lightbox-zoom-controls { left:50%; transform:translateX(-50%); bottom:max(56px,calc(env(safe-area-inset-bottom) + 44px)); border:0; }
  #lightbox-zoom-controls button { min-width:44px; padding:8px; font-size:11px; opacity:.6; }
  #lightbox-zoom-controls:is(:focus-visible,:has(:focus-visible)) button { opacity:1; }
  #lightbox-like { margin-left:auto; }
  #lightbox-count { font-size:11px; opacity:.7; }
  .mv-top { padding-top:max(8px,env(safe-area-inset-top)); }
}
