/* muban2 游戏弹窗样式 */
.game-modal-wrap { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 12px; }
.game-modal-mask { position: absolute; inset: 0; background: rgba(0,0,0,.65); }
.game-modal { position: relative; width: 92vw; max-width: 420px; max-height: 100%; background: radial-gradient(circle at 10% 0, #2b2545 0, #161327 40%, #090713 100%); color: #fff; border-radius: 16px; box-shadow: 0 18px 45px rgba(0,0,0,.7); overflow: hidden auto; transform: scale(.94); opacity: 0; animation: game-modal-pop .22s cubic-bezier(.21,1.02,.35,1) forwards; font-size: 14px; line-height: 1.4; /* 响应式尺寸变量 */ --wheel-size: clamp(220px, 72vw, 340px); }
.game-header { padding: 14px 18px 12px; text-align: center; background-image: linear-gradient(90deg, #ff3b30, #ff2d55, #c000ff); border-radius: 16px 16px 0 0; box-shadow: 0 4px 12px rgba(0,0,0,.45); }
.game-header-title { font-size: 17px; font-weight: 700; letter-spacing: 2px; }
.game-header-sub { margin-top: 4px; font-size: 12px; opacity: .86; }
.game-body { padding: 14px 16px 8px; }

.game-wheel-wrapper { position: relative; width: var(--wheel-size); height: var(--wheel-size); margin: 0 auto 12px; display: flex; align-items: center; justify-content: center; }
.game-wheel-pointer { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-width: clamp(14px, 4vw, 20px) clamp(8px, 3vw, 12px) 0; border-style: solid; border-color: #ffd54f transparent transparent; filter: drop-shadow(0 2px 4px rgba(0,0,0,.6)); z-index: 3; }
.game-wheel { position: relative; width: 100%; height: 100%; border-radius: 50%; background: #ffca28; box-shadow: 0 0 0 8px rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.7); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.game-wheel-slices { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; border-radius: 50%; }
.game-wheel-slice { position: absolute; top: 0; left: 50%; width: 0; height: 50%; transform-origin: 50% 100%; }
.game-wheel-slice:before { display: none; }
.game-wheel-slice:nth-child(2n):before { display: none; }
.game-wheel-slice-label { position: absolute; top: 16px; left: 0; transform: translateX(-50%); font-size: clamp(12px, 3.5vw, 16px); font-weight: 700; color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,.9); white-space: nowrap; pointer-events: none; }
.wheel-center { position: absolute; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: clamp(68px, 24vw, 96px); height: clamp(68px, 24vw, 96px); border-radius: 50%; border: none; background-image: radial-gradient(circle at 30% 20%, #fff9e6 0, #ffcc80 40%, #ff7043 100%); color: #5a2400; font-weight: 700; letter-spacing: 1px; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(0,0,0,.55); cursor: pointer; z-index: 20; animation: wheel-center-pulse 1.4s ease-in-out infinite; }
.wheel-center:after { content: ""; position: absolute; inset: 6px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); box-shadow: 0 0 0 1px rgba(255,255,255,.1); }

.game-status { text-align: center; font-size: 12px; line-height: 1.5; color: #f5f5f5; padding: 0 8px; }
.game-status-main { margin-bottom: 4px; font-size: 13px; font-weight: 500; }
.game-status-sub { color: #ffd54f; }

.game-actions { display: flex; gap: 10px; padding: 10px 14px 14px; align-items: center; justify-content: center; }
.game-btn { flex: 1; min-height: 44px; padding: 0 14px; border: none; border-radius: 999px; background-image: linear-gradient(90deg, #ff3b30, #ff2d55, #c000ff); color: #fff; font-size: 14px; font-weight: 600; box-shadow: 0 6px 16px rgba(0,0,0,.45); cursor: pointer; text-align: center; }
.game-btn.ghost { background-image: none; background: rgba(255,255,255,.06); color: #f0f0f0; box-shadow: none; }
.game-btn.is-disabled { opacity: .6; cursor: default; box-shadow: none; }
/* 交互状态与可访问性 */
.game-btn:hover:not(.is-disabled) { filter: brightness(1.08); }
.game-btn:active:not(.is-disabled) { transform: translateY(1px); }
.game-btn:focus-visible { outline: 3px solid #ffd54f; outline-offset: 2px; box-shadow: 0 0 0 3px rgba(255,213,79,.35); }
.wheel-center:focus-visible { outline: 3px solid #ffd54f; outline-offset: 4px; box-shadow: 0 0 0 3px rgba(255,213,79,.35), 0 6px 16px rgba(0,0,0,.55); }

/* Overlay styles for Result */
.game-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.85); z-index: 50; border-radius: 50%; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); animation: fadeIn 0.3s ease; }
.game-overlay-content { text-align: center; color: #fff; width: 80%; }
.game-overlay-icon { font-size: 32px; margin-bottom: 8px; }
.game-overlay-title { font-size: 18px; font-weight: 700; margin-bottom: 6px; color: #ffd54f; }
.game-overlay-text { font-size: 13px; line-height: 1.4; opacity: 0.9; margin-bottom: 10px; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* Full Screen Ad Overlay */
.game-ad-overlay { position: fixed; inset: 0; z-index: 20000; background: #000; display: flex; flex-direction: column; }
.game-ad-content { position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.game-ad-media { width: 100%; height: 100%; background: #000; display: flex; align-items: center; justify-content: center; }
.game-ad-media img, .game-ad-media video { max-width: 100%; max-height: 100%; object-fit: contain; }
.game-ad-ui { position: absolute; top: 20px; right: 20px; z-index: 10; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.game-ad-timer-badge { background: rgba(0,0,0,0.6); color: #fff; padding: 8px 16px; border-radius: 24px; font-size: 14px; font-weight: 600; border: 1px solid rgba(255,255,255,0.2); backdrop-filter: blur(4px); line-height: 1.4; display: inline-block; }
.game-ad-text { position: absolute; bottom: 20px; width: 100%; text-align: center; color: rgba(255,255,255,0.8); font-size: 12px; pointer-events: none; }

/* Toast 样式 */
.game-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); max-width: 88vw; padding: 10px 14px; border-radius: 12px; color: #fff; font-size: 13px; line-height: 1.4; box-shadow: 0 8px 24px rgba(0,0,0,.45); z-index: 10001; backdrop-filter: saturate(120%); animation: toast-pop .18s ease-out forwards; }
.game-toast--success { background: linear-gradient(90deg, #00c853, #64dd17); }
.game-toast--error { background: linear-gradient(90deg, #d50000, #ff1744); }
.game-toast--info { background: rgba(0,0,0,.75); }
@keyframes toast-pop { from { transform: translateX(-50%) translateY(8px); opacity: 0; } to { transform: translateX(-50%) translateY(0); opacity: 1; } }

/* 屏幕很小的优化 */
@media (max-width: 360px) {
  .game-header-title { font-size: 16px; }
  .game-header-sub { font-size: 11px; }
}

@keyframes game-modal-pop {
  0% { transform: scale(.88); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

@keyframes wheel-center-pulse {
  0% { transform: scale(1); box-shadow: 0 6px 16px rgba(0,0,0,.55); }
  50% { transform: scale(1.06); box-shadow: 0 10px 22px rgba(0,0,0,.7); }
  100% { transform: scale(1); box-shadow: 0 6px 16px rgba(0,0,0,.55); }
}

/* Custom Confirmation Modal */
.game-confirm-mask { position: fixed; inset: 0; z-index: 21000; background: rgba(0,0,0,0.8); display: flex; align-items: center; justify-content: center; opacity: 0; animation: fadeIn 0.2s forwards; }
.game-confirm-modal { width: 85vw; max-width: 320px; background: #1a1a2e; border-radius: 12px; padding: 20px; text-align: center; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 10px 30px rgba(0,0,0,0.8); transform: scale(0.9); animation: popIn 0.2s forwards; }
.game-confirm-title { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 10px; }
.game-confirm-text { font-size: 14px; color: rgba(255,255,255,0.8); margin-bottom: 20px; line-height: 1.5; }
.game-confirm-actions { display: flex; gap: 10px; justify-content: center; }
.game-confirm-btn { flex: 1; padding: 10px; border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; border: none; transition: all 0.2s; }
.game-confirm-btn.cancel { background: rgba(255,255,255,0.1); color: #fff; }
.game-confirm-btn.confirm { background: linear-gradient(90deg, #ff3b30, #ff2d55); color: #fff; }
.game-confirm-btn:active { transform: scale(0.96); }

@keyframes popIn {
  from { transform: scale(0.9); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}