:root{--viewer-credit-width:322.8px;--viewer-credit-padding:14px;--viewer-max-media-width:1177.2px;--viewer-max-height:860px;--viewer-safe-gap:32px;--viewer-fit-height:min(var(--viewer-max-height),calc(100dvh - var(--viewer-safe-gap)));--viewer-fit-media-width:min(var(--viewer-max-media-width),calc(100vw - var(--viewer-credit-width) - var(--viewer-safe-gap)))}
#viewer{position:fixed;inset:0;z-index:20;display:none;align-items:center;justify-content:center;background:#000e;overflow:hidden}
#viewer.show{display:flex!important}
.vbox{display:grid;flex:none;background:#15191f;border-radius:10px;overflow:hidden;transform-origin:center center}
.media{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#000}
.media>[hidden]{display:none!important}
.media video,.media iframe,.media img{display:block;border:0;width:100%;height:100%;object-fit:contain;background:#000}
.credits{box-sizing:border-box;padding:var(--viewer-credit-padding);overflow-x:hidden;overflow-y:auto;background:#15191f}
.vtitle{margin:0 0 24px;font-family:Arial,sans-serif;overflow-wrap:anywhere}
.credit,.kv-credits,.kv-description{min-width:0;max-width:100%;box-sizing:border-box;font-family:Arial,sans-serif;font-size:14px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
.credit p,.credit div,.kv-credits p,.kv-credits div,.kv-description p,.kv-description div{margin:0;padding:0;line-height:inherit}
.credit a,.vtitle a{text-decoration:underline;text-underline-offset:2px;cursor:pointer}.credit a[data-auto-mention="1"],.vtitle a[data-auto-mention="1"]{color:inherit}
.x,.prev,.next{position:absolute;z-index:30;border:0;border-radius:50%;width:42px;height:42px;background:#252a31;color:#fff;font-size:27px}
.x{right:22px;top:20px}.prev{left:1.5vw}.next{right:1.5vw}
.popup-home,.popup-close{display:none}
@media(min-width:761px){
  #viewer .vbox{max-width:none!important;max-height:none!important;overflow:visible!important;transform:none!important}
  .vbox.server-media,.vbox.image-media,.vbox.embed-media{grid-template-columns:auto var(--viewer-credit-width);width:max-content;height:max-content;max-width:none!important;max-height:none!important}
  .vbox.server-media .media,.vbox.image-media .media{
    width:min(calc(var(--viewer-fit-height) * var(--media-ratio,1.7777777778)),var(--viewer-fit-media-width));
    height:auto;
    max-height:var(--viewer-fit-height);
    aspect-ratio:var(--media-ratio,1.7777777778);
  }
  .vbox.embed-media .media{
    width:min(calc(var(--viewer-fit-height) * var(--embed-ratio,1.7777777778)),var(--viewer-fit-media-width));
    height:auto;
    max-height:var(--viewer-fit-height);
    aspect-ratio:var(--embed-ratio,1.7777777778);
  }
  .vbox.server-media .credits,.vbox.image-media .credits,.vbox.embed-media .credits{
    width:var(--viewer-credit-width);
    min-width:var(--viewer-credit-width);
    height:100%;
    min-height:0;
    max-height:var(--viewer-fit-height);
  }
}
@media(max-width:760px){
  #viewer{display:none;place-items:stretch;padding-top:44px;background:#000}
  #viewer.show{display:block!important}
  .vbox,.vbox.server-media,.vbox.image-media,.vbox.embed-media{display:flex;width:100vw!important;height:calc(100dvh - 44px)!important;max-width:100vw!important;max-height:calc(100dvh - 44px)!important;flex-direction:column;border:0;border-radius:0;overflow-y:auto;transform:none!important}
  .media,.vbox.server-media .media,.vbox.image-media .media,.vbox.embed-media .media{flex:0 0 auto;width:100vw!important;height:auto!important;max-height:72dvh;aspect-ratio:var(--media-ratio,var(--embed-ratio,1.7778))}
  .media video,.media img{width:100%;height:auto;max-height:72dvh;object-fit:contain}
  .media iframe{width:100%;height:100%;min-height:0}
  .credits,.vbox .credits{display:block;flex:1 0 auto;width:100%!important;min-width:0!important;max-width:100vw!important;min-height:28dvh;padding:22px 18px 48px;box-sizing:border-box;overflow-x:hidden;overflow-y:visible}
  .credit,.kv-credits,.kv-description{display:block;width:100%;min-width:0;max-width:100%}
  .prev,.next,.x{display:none!important}
  .popup-home{display:flex;position:fixed;z-index:250;left:10px;top:max(8px,env(safe-area-inset-top));height:34px;align-items:center;gap:1px;color:#fff;text-decoration:none;font:700 13px/1 Arial,sans-serif}
  .popup-home img{width:34px;height:34px;object-fit:contain}
  .popup-close{display:grid;place-items:center;position:fixed;z-index:260;right:10px;top:max(8px,env(safe-area-inset-top));width:34px;height:34px;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#171b21;color:#fff;font:400 24px/1 Arial,sans-serif}
}

