/* Theme variables reconstructed from the captured theme.js (blue / glow). */
:root{
  --theme_COLOR:#4B7EFA;
  --theme_COLOR_RGB:75,126,250;
  --theme_BACKGROUND:#eaf4ff;
  --theme_BUTTON_GRADIENT_BACKGROUND:linear-gradient(90deg,#89AAFF 0.68%,#4B7EFA 98.65%);
  --common_theme:#4B7EFA;
  --common_Theme:#597EF7;
  --common_normal:#6C6C89;
  --text-normal:#6C6C89;
  --text-button-white-normal:#fff;
  --theme_SUB_COLOR:#586B91;
  --theme_SUB_COLOR2:#647EB2;
  --iconArrowLeft:none;
  --iconArrowRight:none;
}
/* Desktop H5 frame: keep the original mobile layout centered at a phone width. */
html,body{min-height:100%;}
html{background:#e9ebf0;}
body{width:100%;max-width:451px;margin:0 auto;min-height:100vh;overflow-x:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.08);background:#f7f8ff;}
body[data-platform="ios"]{max-width:413px;}
@media(min-width:700px){body{min-height:100vh;box-shadow:0 0 0 1px rgba(0,0,0,.12),0 8px 36px rgba(0,0,0,.08);}}
#app{width:100%;min-height:100vh;}
/* FIX: original siteMobile.css hides #download_component by default. This reconstruction renders locally, so the root must be visible. */
#download_component{display:block!important;visibility:visible!important;}

#download_component,#download_component #download{min-height:100vh;}
#download_component #download{background-color:#f7f8ff;}
.download .remind.newSite .logo_box{margin-top:.34rem;}
.download .remind.newSite .logo_right_img{height:.48rem;max-width:70%;object-fit:contain;}
.download .remind.newSite .contentImg{display:none!important;}
.download .remind.newSite .intro_img_box{display:block;height:8.7rem;}
.download_sweiper_container{overflow:hidden;}
.download_sweiper_container .download_swiper_wrapper{display:flex;width:100%;height:100%;transition:transform .35s ease;will-change:transform;}
.download_sweiper_container .download_swiper_wrapper .swiper-slide{display:block;flex:0 0 100%;width:100%;height:100%;float:none;}
.download_sweiper_container .download_swiper_wrapper .swiper-slide img{width:100%;height:100%;object-fit:contain;object-position:center top;}
.intro_img_box .download_swiper_pagination{position:relative;bottom:auto;left:0;width:100%;height:.16rem;display:flex;align-items:center;justify-content:center;gap:.08rem;transform:none;margin-top:.08rem;}
.intro_img_box .download_swiper_pagination .swiper-pagination-bullet{display:block;width:.16rem;height:.08rem;margin:0;border-radius:.1rem;background:#8fa0aa;opacity:.28;cursor:pointer;}
.intro_img_box .download_swiper_pagination .swiper-pagination-bullet-active{width:.32rem;opacity:1;}
#sign_off_wrap{position:absolute;right:0;top:8.2rem;z-index:5;cursor:pointer;}
#sign_off_wrap img{width:1.35rem;height:auto;}
#page_403_component{display:none!important;}
#tips_alert{z-index:2000;}
#download_box_official,#download_box_sign_off{cursor:pointer;}
#download_box_sign_off_box{cursor:pointer;}
#download_box_sign_off_box .modal_download{cursor:pointer;}
.header img{cursor:pointer;}
.tutorials_bg_img{display:block;height:auto;}
#download_component .downloadWrap{background:#f8f8f8;}
.local-maintenance{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:.4rem;background:#f2f2f6;}
.maintenance-card{width:100%;padding:.5rem .4rem;background:#fff;border-radius:.24rem;text-align:center;color:#27334a;}
.maintenance-card h2{font-size:.36rem;margin:0 0 .25rem;}
.maintenance-card p{font-size:.26rem;line-height:1.6;margin:0 0 .35rem;}
.maintenance-card button{border:0;border-radius:.5rem;padding:.18rem .6rem;background:#4b7efa;color:#fff;font-size:.28rem;}
@media(prefers-reduced-motion:reduce){.download_swiper_wrapper{transition:none!important;}}

#global-toast{position:fixed;z-index:3000;left:50%;bottom:12%;transform:translate(-50%,12px);max-width:86%;padding:.18rem .28rem;border-radius:.18rem;background:rgba(0,0,0,.72);color:#fff;font-size:.24rem;line-height:1.5;text-align:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s ease;}
#global-toast.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0);}


/* Mobile full-bleed mode: iPhone/iPad and Android must not show a simulated phone frame.
   Desktop keeps the centered H5 canvas defined above. */
@media (max-width:699px){
  html,body{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    padding-left:0;
    padding-right:0;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    box-shadow:none!important;
  }
  html{
    overflow-x:hidden;
    background:#f7f8ff;
  }
  body{
    min-height:100vh;
    min-height:100dvh;
    overflow-x:hidden;
    border-left:0!important;
    border-right:0!important;
  }
}