/* 移动端全屏样式修复 - 保持卡片原始大小，按钮位置调整 */

/* 重写移动端全屏卡片容器样式 */
body.mobile-fullscreen .card-container {
  width: min(520px, 92vw) !important;
  transform: scale(1.0) !important;
  box-shadow: 
    0 50px 100px -20px var(--shadow-strong),
    0 25px 50px -15px var(--shadow-soft) !important;
  transition: all 0.5s ease !important;
  margin: 0 auto !important;
  position: relative !important;
}

/* 重写移动端全屏按钮位置 */
body.mobile-fullscreen .controls-toolbar {
  position: fixed !important;
  bottom: 100px !important; /* 按钮往上调整 */
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  transition: all 0.3s ease !important;
  z-index: 10000 !important;
}

/* 响应式调整 */
@media (max-width: 768px) {
  body.mobile-fullscreen .controls-toolbar {
    bottom: 90px !important; /* 小屏幕下按钮位置 */
  }
  
  body.mobile-fullscreen .card-container {
    width: min(520px, 90vw) !important;
    transform: scale(1.0) !important;
  }
  
  body.mobile-fullscreen .preview {
    padding: 20px 20px 140px 20px !important; /* 为按钮留出更多空间 */
  }
}

@media (max-width: 480px) {
  body.mobile-fullscreen .controls-toolbar {
    bottom: 80px !important; /* 超小屏幕下按钮位置 */
  }
  
  body.mobile-fullscreen .card-container {
    width: min(520px, 95vw) !important;
    transform: scale(1.0) !important;
  }
  
  body.mobile-fullscreen .preview {
    padding: 20px 20px 130px 20px !important;
  }
}