/* Fullscreen 按钮：大号 + 居中 */
.wpgf-btn {
  display: block;
  margin: 20px auto 0 auto;
  padding: 14px 28px;
  border: none;
  border-radius: 12px;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  background: #111;
  color: #fff;
}
.wpgf-btn:hover { background: #333; }

/* 退出全屏按钮（容器内可拖动浮层） */
.wpgf-exit {
  position: absolute;
  z-index: 10000;
  padding: 8px 12px;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  cursor: grab;
  background: rgba(0,0,0,.45);
  color: #fff;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;          /* 避免触摸滚动干扰拖动 */
  will-change: left, top;
}
.wpgf-exit.wpgf-dragging { cursor: grabbing; }

/* Add to Home / Bookmark 按钮 */
.wpgf-a2hs-btn {
  display: block;
  margin: 12px auto 0 auto;
  padding: 12px 22px;
  border: none;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  background: #0a7;
  color: #fff;
}
.wpgf-a2hs-btn:hover { background: #0c9; }

/* 确保容器是定位上下文（为了 absolute 子元素） */
.wpgf-embed {
  position: relative;
}

/* 全屏状态：容器背景黑、iframe 填满 */
.wpgf-embed:fullscreen,
.wpgf-embed:-webkit-full-screen { background: #000; }
.wpgf-embed:fullscreen iframe,
.wpgf-embed:-webkit-full-screen iframe {
  width: 100% !important;
  height: 100% !important;
}

/* iOS 引导蒙层 */
.wpgf-ios-tip {
  position: fixed; inset: 0; background: rgba(0,0,0,.6);
  z-index: 100000; display: none; align-items: center; justify-content: center; padding: 20px;
}
.wpgf-ios-tip__box { background:#fff; max-width:520px; width:92%; border-radius:16px; padding:20px; text-align:left; line-height:1.6; }
.wpgf-ios-tip__box h3 { margin:0 0 8px 0; font-size:18px; }
.wpgf-ios-tip__box p { margin:8px 0; }
.wpgf-ios-tip__icon { width:64px; height:64px; border-radius:12px; object-fit:cover; margin-right:12px; border:1px solid #eee; }
.wpgf-ios-tip__row { display:flex; align-items:center; }
.wpgf-ios-tip__close { margin-top:12px; display:inline-block; padding:8px 12px; border-radius:10px; background:#111; color:#fff; text-decoration:none; cursor:pointer; }

/* 桌面书签提示气泡 */
.wpgf-bm-tip {
  position: fixed; bottom:20px; left:50%; transform:translateX(-50%);
  background:#111; color:#fff; padding:10px 14px; border-radius:10px; z-index:100000; display:none;
}

/* 按钮并排布局 */
.wpgf-actions{
  display:flex;
  gap:12px;
  margin:12px auto 0;
  max-width:720px;
}
.wpgf-actions .wpgf-btn,
.wpgf-actions .wpgf-a2hs-btn{
  flex:1 1 50%;
  width:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0 !important;
  padding:14px 20px;
  font-size:16px;
  line-height:1.2;
  border-radius:12px;
  min-height:56px;
  box-sizing:border-box;
}
.wpgf-actions .wpgf-btn::before,
.wpgf-actions .wpgf-a2hs-btn::before{
  content:"";
  display:inline-block;
  width:1.2em; height:1.2em;
  background-repeat:no-repeat; background-position:center; background-size:contain;
}
.wpgf-actions .wpgf-btn::before{
  background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 4H4V9M20 9V4H15M15 20H20V15M4 15V20H9" stroke="%23ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}
.wpgf-actions .wpgf-a2hs-btn::before{
  background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path opacity="0.5" d="M3 14.25C3.41421 14.25 3.75 14.5858 3.75 15C3.75 16.4354 3.75159 17.4365 3.85315 18.1919C3.9518 18.9257 4.13225 19.3142 4.40901 19.591C4.68577 19.8678 5.07435 20.0482 5.80812 20.1469C6.56347 20.2484 7.56459 20.25 9 20.25H15C16.4354 20.25 17.4365 20.2484 18.1919 20.1469C18.9257 20.0482 19.3142 19.8678 19.591 19.591C19.8678 19.3142 20.0482 18.9257 20.1469 18.1919C20.2484 17.4365 20.25 16.4354 20.25 15C20.25 14.5858 20.5858 14.25 21 14.25C21.4142 14.25 21.75 14.5858 21.75 15V15.0549C21.75 16.4225 21.75 17.5248 21.6335 18.3918C21.5125 19.2919 21.2536 20.0497 20.6517 20.6516C20.0497 21.2536 19.2919 21.5125 18.3918 21.6335C17.5248 21.75 16.4225 21.75 15.0549 21.75H8.94513C7.57754 21.75 6.47522 21.75 5.60825 21.6335C4.70814 21.5125 3.95027 21.2536 3.34835 20.6517C2.74643 20.0497 2.48754 19.2919 2.36652 18.3918C2.24996 17.5248 2.24998 16.4225 2.25 15.0549C2.25 15.0366 2.25 15.0183 2.25 15C2.25 14.5858 2.58579 14.25 3 14.25Z" fill="%23ffffff"/><path d="M12 16.75C12.21 16.75 12.411 16.662 12.554 16.506L16.554 12.131C16.833 11.825 16.812 11.351 16.506 11.072C16.2 10.792 15.726 10.813 15.446 11.119L12.75 14.068V3C12.75 2.586 12.414 2.25 12 2.25C11.586 2.25 11.25 2.586 11.25 3V14.068L8.554 11.119C8.274 10.813 7.8 10.792 7.494 11.072C7.188 11.351 7.167 11.825 7.446 12.131L11.446 16.506C11.589 16.662 11.789 16.75 12 16.75Z" fill="%23ffffff"/></svg>');
}

/* 退出确认弹窗 */
.wpgf-exit-mask{
  position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:100001;
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.wpgf-exit-dialog{
  background:#fff; width:min(92%,420px); border-radius:14px; padding:18px; box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.wpgf-exit-dialog h3{ margin:0 0 8px 0; font-size:18px; }
.wpgf-exit-dialog p{ margin:6px 0 14px 0; color:#444; }
.wpgf-exit-actions{ display:flex; gap:10px; }
.wpgf-exit-actions button{
  flex:1 1 50%; padding:10px 14px; border:none; border-radius:10px; font-weight:600;
}
.wpgf-exit-cancel{ background:#e9ecef; color:#111; }
.wpgf-exit-ok{ background:#111; color:#fff; }

/* 弹窗期间禁用容器内 iframe 的点击，避免穿透 */
.wpgf-embed[data-wpgf-modal="1"] iframe{
  pointer-events: none !important;
}

.wpgf-exit-dialog .wpgf-exit-tip{
  font-size: 12px;   /* 按需改：12px/13px/14px */
  line-height: 1.5;
  color: #333;       /* 可选：比正文更浅一点 */
  font-weight: 600;
}

/* —— iOS/不支持原生全屏的“伪全屏”回退 —— */
.wpgf-embed.wpgf-pseudo-fs{
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: #000 !important;
  z-index: 100000; /* 高于容器内其它元素 */
}
.wpgf-embed.wpgf-pseudo-fs iframe{
  width: 100% !important;
  height: 100% !important;
}

/* 伪全屏期间禁用滚动条，避免橡皮筋回弹 */
html.wpgf-noscroll, body.wpgf-noscroll{
  overflow: hidden !important;
  height: 100% !important;
  touch-action: none !important;
}

/* —— 横屏提醒遮罩层 —— */
.wpgf-landscape-reminder {
  position: absolute; /* 改为 absolute，相对于全屏容器定位 */
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.85);
  z-index: 10001; /* 高于退出按钮 (10000) 和 iframe */
  padding: 20px;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.3s ease, transform 0.3s ease;
  pointer-events: none;
}

.wpgf-landscape-reminder.wpgf-lr-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.wpgf-lr-content {
  max-width: 600px;
  margin: 0 auto;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 40px; /* 为关闭按钮留空间 */
}

.wpgf-lr-text {
  margin: 0;
  color: #fff;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
}

.wpgf-lr-close {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background 0.2s ease;
}

.wpgf-lr-close:hover {
  background: rgba(255, 255, 255, 0.3);
}

.wpgf-lr-close:active {
  background: rgba(255, 255, 255, 0.4);
}

/* 小屏幕优化 */
@media (max-width: 480px) {
  .wpgf-landscape-reminder {
    padding: 16px;
  }
  
  .wpgf-lr-text {
    font-size: 14px;
  }
  
  .wpgf-lr-content {
    padding-right: 36px;
  }
  
  .wpgf-lr-close {
    width: 28px;
    height: 28px;
    font-size: 20px;
  }
}

/* —— 横屏游戏提示标签（iframe 下方） —— */
.wpgf-landscape-notice {
  margin: -10px 0 0 0;
  padding: 5px 14px;
  background: #3b82f6;
  color: #fff;
  border-radius: 4px;
  font-size: 14px;
  text-align: center;
  line-height: 1.5;
}

/* 响应式 */
@media (max-width: 600px) {
  .wpgf-landscape-notice {
    font-size: 13px;
    padding: 5px 12px;
    margin: -10px 0 0 0;
  }
}

/* —— PWA 中的安装提示弹窗 —— */
.wpgf-pwa-tip {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.wpgf-pwa-tip__box {
  background: #fff;
  max-width: 420px;
  width: 92%;
  border-radius: 16px;
  padding: 24px;
  text-align: center;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.wpgf-pwa-tip__box h3 {
  margin: 0 0 12px 0;
  font-size: 20px;
  font-weight: 600;
  color: #111;
}

.wpgf-pwa-tip__box p {
  margin: 0 0 20px 0;
  font-size: 15px;
  line-height: 1.6;
  color: #555;
}

.wpgf-pwa-tip__actions {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.wpgf-pwa-tip__copy {
  flex: 1;
  max-width: 160px;
  padding: 12px 20px;
  border: none;
  border-radius: 10px;
  background: #3b82f6;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
}

.wpgf-pwa-tip__copy:hover {
  background: #2563eb;
}

.wpgf-pwa-tip__copy:active {
  background: #1d4ed8;
}

.wpgf-pwa-tip__close {
  flex: 1;
  max-width: 120px;
  padding: 12px 20px;
  border-radius: 10px;
  background: #e5e7eb;
  color: #111;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.wpgf-pwa-tip__close:hover {
  background: #d1d5db;
}

/* 响应式 */
@media (max-width: 480px) {
  .wpgf-pwa-tip__box {
    padding: 20px;
  }
  
  .wpgf-pwa-tip__box h3 {
    font-size: 18px;
  }
  
  .wpgf-pwa-tip__box p {
    font-size: 14px;
  }
  
  .wpgf-pwa-tip__actions {
    flex-direction: column;
  }
  
  .wpgf-pwa-tip__copy,
  .wpgf-pwa-tip__close {
    max-width: none;
  }
}