/* FOUNTAIN+ V11.9.54 · VERTICAL VIDEO SOCIAL-NATIVE LAW
   Trigger: portrait/vertical VIDEO media, not a Puppet Gang page type.
   Existing custom reel/player experiences remain authoritative; this layer enhances ordinary vertical media. */
:root{--fvv-bg:#050505;--fvv-fg:#fff;--fvv-gold:#f2bd4b;--fvv-edge:rgba(255,255,255,.16)}
[data-fplus-vertical-video]{position:relative;isolation:isolate}
.fvv-portrait-shell{position:relative;width:min(100%,460px);aspect-ratio:9/16;margin-inline:auto;overflow:hidden;background:var(--fvv-bg);border:1px solid var(--fvv-edge);border-radius:24px;box-shadow:0 24px 80px rgba(0,0,0,.34);color:var(--fvv-fg);-webkit-tap-highlight-color:transparent}
.fvv-portrait-shell>video,.fvv-portrait-shell>iframe,.fvv-portrait-shell>.fvv-media{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0!important;border:0!important;border-radius:0!important;object-fit:cover!important;background:#000!important}
.fvv-chrome{position:absolute;z-index:6;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.38),transparent 18%,transparent 63%,rgba(0,0,0,.54));}
.fvv-badge{position:absolute;z-index:8;top:max(12px,env(safe-area-inset-top));left:12px;display:inline-flex;align-items:center;gap:7px;min-height:30px;padding:0 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(0,0,0,.46);backdrop-filter:blur(12px);color:#fff;font:900 9px/1 ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.13em;text-transform:uppercase;pointer-events:none}
.fvv-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--fvv-gold);box-shadow:0 0 0 4px rgba(242,189,75,.14)}
.fvv-actions{position:absolute;z-index:9;right:10px;bottom:max(14px,env(safe-area-inset-bottom));display:grid;gap:9px;pointer-events:auto}
.fvv-action{width:48px;height:48px;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.50);backdrop-filter:blur(12px);color:#fff;cursor:pointer;touch-action:manipulation;box-shadow:0 8px 24px rgba(0,0,0,.22)}
.fvv-action svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.fvv-action:focus-visible{outline:2px solid var(--fvv-gold);outline-offset:2px}
.fvv-action.fvv-sound-on{background:var(--fvv-gold);color:#17110a;border-color:var(--fvv-gold)}
.fvv-tap-zone{position:absolute;z-index:7;inset:0;border:0;background:transparent;cursor:pointer;pointer-events:auto;touch-action:manipulation}
.fvv-pulse{position:absolute;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%) scale(.86);width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.52);border:1px solid rgba(255,255,255,.2);color:#fff;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;backdrop-filter:blur(10px)}
.fvv-pulse.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.fvv-pulse svg{width:28px;height:28px;fill:currentColor}
.fvv-portrait-shell.fvv-native video::-webkit-media-controls{display:none!important}
/* Existing purpose-built vertical players/reel apps are already the gold standard. The law identifies them without restyling their internal UI. */
.pg-reels-app,.fpv-overlay,[data-fplus-vertical-player],[data-fplus-reel-app]{--fvv-law-active:1}
@media(max-width:759px){
  .fvv-portrait-shell{width:100%;max-width:none;border-radius:18px;min-height:68svh;max-height:calc(100dvh - 92px)}
  .fvv-action{width:50px;height:50px}
  .fvv-badge{top:12px;left:10px}
}
@media(max-width:520px){
  .fvv-portrait-shell{border-left:0;border-right:0;border-radius:0;width:100%;aspect-ratio:9/16;max-height:100dvh}
}
@media(prefers-reduced-motion:reduce){.fvv-pulse{transition:none}}