/* =========================================================
  简洁模式（完整）
  - 目标：一键“清爽阅读”
  - 隐藏：装饰、头部、樱花、左侧 hero
  - 保留：左下角按钮、画廊区可点击跳转
  - 移动端：公告区也隐藏
  - 关键修复：section2 三张卡在移动端简洁模式下不再向上补位
========================================================= */

body.style-off *{
  animation: none !important;
  transition: none !important;
}

body.style-off{
  --header-h: 0px;
}

/* 隐藏头部 */
body.style-off header{
  display: none !important;
}

/* 隐藏背景装饰层 */
body.style-off::before{
  display: none !important;
}
body.style-off::after{
  display: none !important;
}

/* 隐藏樱花 */
body.style-off #canvas_sakura{
  display: none !important;
}

/* 默认禁用链接点击 */
body.style-off a,
body.style-off a *{
  pointer-events: none !important;
}

/* 放行：左下角按钮 */
body.style-off #toggleStyleBtn,
body.style-off #changeBgBtn,
body.style-off #toggleThemeBtn{
  pointer-events: auto !important;
}

/* 放行：画廊区域链接 */
body.style-off .section3 .pictures .parent a,
body.style-off .section3 .pictures .parent a *{
  pointer-events: auto !important;
}

/* 隐藏左侧 hero */
body.style-off .section1 .left,
body.style-off .section1 .left.hero-panel{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* 不在全局强行隐藏 section2
   因为 enhance-core.js 会保留三张卡显示 */
body.style-off .section2,
body.style-off #features{
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* =========================================================
   移动端简洁模式
   - 公告隐藏
   - 保留 section1 原有占位，避免 section2 三卡往上顶
========================================================= */
@media (max-width: 768px){

  /* 右侧公告隐藏 */
  body.style-off .section1 .right,
  body.style-off .section1 .right > div,
  body.style-off .section1 .right .notice,
  body.style-off .section1 .right .rule,
  body.style-off .section1 .right .card,
  body.style-off .section1 .right .box,
  body.style-off .section1 .right .contact{
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 关键修复：
     不压缩 section1 的高度，不让 section2 顶上来
     只把 section1 变成透明占位层 */
  body.style-off .section1{
    display: block !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;

    /* 保持原本首屏占位 */
    height: auto !important;
    min-height: calc(var(--mobile-vh, 1vh) * 100 - 90px) !important;
    padding-top: 18px !important;
    padding-bottom: 18px !important;
    margin: 0 !important;
    overflow: hidden !important;

    /* 视觉上不显示 */
    background: none !important;
    border: none !important;
    box-shadow: none !important;
  }

  body.style-off .section1::before,
  body.style-off .section1::after{
    display: none !important;
    content: none !important;
  }

  /* section1 里的所有块都不可见，但占位由 section1 自己保留 */
  body.style-off .section1 > *{
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 三张卡保留原位置，不额外往上拉 */
  body.style-off .section2,
  body.style-off #features{
    margin-top: 0 !important;
    padding-top: 0 !important;
    min-height: auto !important;
  }

  body.style-off .section2 .row{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.style-off .section2 .row .box,
  body.style-off .section2 .row .s-box{
    transform: none !important;
  }
}

/* 系统减少动态 */
@media (prefers-reduced-motion: reduce){
  *{
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }

  body::before{
    animation: none !important;
  }
}