/* BlackBar Gaming V3.40.3.4 — mobile-refined visual guide viewer */
:root{
  --nhq-viewer-bg:#020812;
  --nhq-viewer-panel:#07182a;
  --nhq-viewer-line:#218bca;
  --nhq-viewer-text:#eef8ff;
  --nhq-viewer-muted:#a9c0cf;
}
html.nhq-viewer-open,body.nhq-viewer-open{overflow:hidden!important;overscroll-behavior:none!important;background:#020812!important}
.nhq-visual-lightbox{position:fixed;inset:0;z-index:99999;display:none;background:var(--nhq-viewer-bg);color:var(--nhq-viewer-text);box-sizing:border-box;overflow:hidden}
.nhq-visual-lightbox[data-open="true"]{display:block;animation:nhqViewerFade .16s ease-out}
@keyframes nhqViewerFade{from{opacity:0}to{opacity:1}}
.nhq-viewer-stage{position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:flex;align-items:center;justify-content:center;background:#020812;touch-action:pan-x pan-y;scrollbar-width:none}
.nhq-viewer-stage::-webkit-scrollbar{display:none}
.nhq-viewer-stage::before{content:"";position:fixed;inset:-36px;background-image:var(--nhq-viewer-backdrop,none);background-size:cover;background-position:center;filter:blur(34px) saturate(.7) brightness(.36);opacity:.38;transform:scale(1.08);pointer-events:none}
.nhq-viewer-stage::after{content:"";position:fixed;inset:0;background:linear-gradient(180deg,rgba(2,8,18,.72),rgba(2,8,18,.38) 42%,rgba(2,8,18,.72));pointer-events:none}
.nhq-viewer-canvas{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;min-width:100%;min-height:100%;padding:max(64px,calc(env(safe-area-inset-top) + 48px)) max(8px,env(safe-area-inset-right)) max(82px,calc(env(safe-area-inset-bottom) + 70px)) max(8px,env(safe-area-inset-left));box-sizing:border-box}
.nhq-viewer-image{display:block;width:100%;height:auto;max-width:calc(100vw - max(16px,env(safe-area-inset-left) + env(safe-area-inset-right)));object-fit:contain;border-radius:10px;box-shadow:0 22px 72px rgba(0,0,0,.58),0 0 0 1px rgba(73,181,239,.28);user-select:none;-webkit-user-drag:none;background:#03102a;transform-origin:top left}
.nhq-visual-lightbox[data-zoomed="true"] .nhq-viewer-canvas{width:max-content;min-width:max-content;min-height:max-content;align-items:flex-start;justify-content:flex-start}
.nhq-visual-lightbox[data-zoomed="true"] .nhq-viewer-image{max-width:none}

/* Close is independent from the zoom dock so it can never be pushed offscreen. */
.nhq-viewer-close{position:fixed;z-index:4;top:max(10px,calc(env(safe-area-inset-top) + 8px));right:max(10px,calc(env(safe-area-inset-right) + 8px));appearance:none;border:1px solid rgba(91,196,255,.7);background:rgba(8,28,47,.94);color:#f4fbff;border-radius:50%;width:46px;height:46px;display:flex;align-items:center;justify-content:center;font:800 29px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 9px 28px rgba(0,0,0,.42);cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.nhq-viewer-close:hover,.nhq-viewer-close:focus-visible{outline:none;border-color:#75d0ff;background:#103654}

/* Compact floating controls sit at the bottom center instead of competing for header width. */
.nhq-viewer-controls{position:fixed;z-index:4;left:50%;bottom:max(12px,calc(env(safe-area-inset-bottom) + 10px));transform:translateX(-50%);display:flex;align-items:center;gap:7px;padding:7px;border:1px solid rgba(58,160,219,.38);border-radius:18px;background:rgba(4,18,33,.9);box-shadow:0 12px 36px rgba(0,0,0,.42);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.nhq-viewer-btn{appearance:none;border:1px solid rgba(64,177,241,.55);background:#0a2138;color:#edf9ff;border-radius:12px;min-width:44px;height:42px;padding:0 11px;display:inline-flex;align-items:center;justify-content:center;font:800 18px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer}
.nhq-viewer-btn:hover,.nhq-viewer-btn:focus-visible{border-color:#5bc4ff;background:#10304f;outline:none}
.nhq-viewer-zoom-label{min-width:64px;font-size:15px}
.nhq-viewer-fit{font-size:13px;letter-spacing:.03em;min-width:50px}

.nhq-viewer-rotate-hint{position:fixed;z-index:3;left:50%;top:max(12px,calc(env(safe-area-inset-top) + 12px));transform:translateX(-50%);max-width:calc(100vw - 130px);padding:8px 12px;border:1px solid rgba(78,170,225,.28);border-radius:999px;background:rgba(3,15,28,.72);color:var(--nhq-viewer-muted);font:700 12px/1.15 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;pointer-events:none;transition:opacity .16s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.nhq-visual-lightbox[data-show-rotate="true"] .nhq-viewer-rotate-hint{opacity:1}

@media(max-width:640px){
  .nhq-viewer-image{max-width:calc(100vw - max(12px,env(safe-area-inset-left) + env(safe-area-inset-right)));border-radius:7px}
  .nhq-viewer-canvas{padding-top:max(60px,calc(env(safe-area-inset-top) + 46px));padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right));padding-bottom:max(78px,calc(env(safe-area-inset-bottom) + 66px))}
  .nhq-viewer-close{width:44px;height:44px;font-size:27px}
  .nhq-viewer-controls{gap:5px;padding:6px;border-radius:16px}
  .nhq-viewer-btn{height:40px;min-width:40px;border-radius:11px;padding:0 9px}
  .nhq-viewer-zoom-label{min-width:58px;font-size:14px}
  .nhq-viewer-fit{min-width:46px;font-size:12px}
}
@media(orientation:landscape) and (max-height:540px){
  .nhq-viewer-canvas{padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(10px,env(safe-area-inset-bottom));padding-left:max(66px,calc(env(safe-area-inset-left) + 56px));padding-right:max(66px,calc(env(safe-area-inset-right) + 56px))}
  .nhq-viewer-image{width:auto;max-width:calc(100vw - 132px);max-height:calc(100dvh - 20px)}
  .nhq-viewer-controls{left:auto;right:max(10px,calc(env(safe-area-inset-right) + 8px));bottom:max(10px,env(safe-area-inset-bottom));transform:none;flex-direction:column}
  .nhq-viewer-close{top:max(10px,env(safe-area-inset-top));right:max(10px,calc(env(safe-area-inset-right) + 8px))}
  .nhq-viewer-rotate-hint{display:none}
}
@media(prefers-reduced-motion:reduce){.nhq-visual-lightbox[data-open="true"]{animation:none}.nhq-viewer-rotate-hint{transition:none}}
