/* 考研研讯小程序浮动弹窗（正方形紧凑版） */
.miniapp-float { position: fixed; bottom: 20px; left: 20px; z-index: 9999; width: 182px; background: #fff; border-radius: 12px; box-shadow: 0 6px 24px rgba(0,0,0,.14), 0 2px 6px rgba(0,0,0,.07); overflow: hidden; transition: all .3s cubic-bezier(.34,1.56,.64,1); animation: miniappFloatIn .5s ease-out; cursor: pointer; border: 1px solid rgba(0,0,0,.06); }
@keyframes miniappFloatIn { from { opacity: 0; transform: translateY(20px) scale(.9); } to { opacity: 1; transform: translateY(0) scale(1); } }
.miniapp-float:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(0,0,0,.17), 0 3px 10px rgba(0,0,0,.09); }
.miniapp-float.collapsed { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.miniapp-float.collapsed .miniapp-body, .miniapp-float.collapsed .miniapp-close, .miniapp-float.collapsed .miniapp-header { display: none; }
.miniapp-float.collapsed .miniapp-icon-collapsed { display: flex; }
.miniapp-close { position: absolute; top: 7px; right: 7px; width: 19px; height: 19px; border-radius: 50%; background: rgba(0,0,0,.06); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #999; transition: all .2s; z-index: 10; line-height: 1; padding: 0; }
.miniapp-close:hover { background: rgba(0,0,0,.12); color: #666; }
.miniapp-header { height: 4px; background: linear-gradient(90deg, #1677ff 0%, #36cfc9 100%); }
.miniapp-body { padding: 11px 12px 13px; text-align: center; }
.miniapp-qr { width: 118px; height: 118px; margin: 0 auto 9px; background: #f8f9fa; border-radius: 8px; border: 1px dashed #d9d9d9; overflow: hidden; }
.miniapp-qr img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; display: block; }
.miniapp-title { font-size: 14px; font-weight: 600; color: #1a1a1a; margin-bottom: 5px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.miniapp-mini-icon { display: inline-flex; width: 20px; height: 20px; background: linear-gradient(135deg, #1677ff, #36cfc9); border-radius: 6px; align-items: center; justify-content: center; color: #fff; font-size: 12px; font-weight: bold; box-shadow: 0 2px 6px rgba(22,119,255,.3); }
.miniapp-scan-tip { font-size: 11px; color: #1677ff; font-weight: 500; }
.miniapp-icon-collapsed { display: none; width: 34px; height: 34px; background: linear-gradient(135deg, #1677ff, #36cfc9); border-radius: 50%; align-items: center; justify-content: center; color: #fff; font-size: 16px; font-weight: bold; box-shadow: 0 3px 9px rgba(22,119,255,.3); }
.miniapp-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.5); z-index: 10000; display: none; align-items: center; justify-content: center; opacity: 0; transition: opacity .3s; }
.miniapp-modal-overlay.active { display: flex; opacity: 1; }
.miniapp-modal { background: #fff; border-radius: 16px; padding: 22px; text-align: center; max-width: 270px; width: 88%; transform: scale(.9); transition: transform .3s cubic-bezier(.34,1.56,.64,1); box-shadow: 0 20px 60px rgba(0,0,0,.2); }
.miniapp-modal-overlay.active .miniapp-modal { transform: scale(1); }
.miniapp-modal .miniapp-icon { width: 42px; height: 42px; margin: 0 auto 8px; background: linear-gradient(135deg, #1677ff, #36cfc9); border-radius: 11px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; font-weight: bold; box-shadow: 0 3px 9px rgba(22,119,255,.3); }
.miniapp-modal .miniapp-title { font-size: 16px; margin: 0 0 4px; }
.miniapp-modal .miniapp-desc { font-size: 12px; color: #666; margin-bottom: 14px; line-height: 1.5; }
.miniapp-modal-qr { width: 156px; height: 156px; margin: 0 auto 12px; background: #f8f9fa; border-radius: 10px; border: 1px dashed #d9d9d9; overflow: hidden; }
.miniapp-modal-qr img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; display: block; }
.miniapp-modal-scan { font-size: 12px; color: #333; font-weight: 500; margin-bottom: 3px; }
.miniapp-modal-sub { font-size: 11px; color: #999; }
.miniapp-modal-close { margin-top: 14px; padding: 6px 26px; background: #f5f5f5; border: none; border-radius: 18px; color: #666; font-size: 12px; cursor: pointer; transition: background .2s; }
.miniapp-modal-close:hover { background: #e8e8e8; }
@media (max-width: 768px) {
  .miniapp-float { width: 152px; bottom: 12px; left: 12px; }
  .miniapp-float.collapsed { width: 44px; height: 44px; }
  .miniapp-float.collapsed .miniapp-icon-collapsed { width: 30px; height: 30px; font-size: 14px; }
  .miniapp-body { padding: 9px 10px 11px; }
  .miniapp-qr { width: 96px; height: 96px; margin-bottom: 7px; }
  .miniapp-title { font-size: 13px; }
  .miniapp-scan-tip { font-size: 10px; }
}
