@charset "utf-8";
.header{display:none !important;}
.Footer{display:none !important;}

/* ---------- 1. 全屏容器 ---------- */
.tea-loader{
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:99999;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  overflow:hidden;
  background:#0a3d18;
  background-image:
    radial-gradient(120% 90% at 15% 10%, rgba(27,94,32,.95) 0%, rgba(27,94,32,0) 62%),
    radial-gradient(110% 100% at 88% 92%, rgba(15,77,42,.95) 0%, rgba(15,77,42,0) 60%),
    linear-gradient(150deg, #061f0d 0%, #0d4f1c 42%, #12562a 72%, #061f0d 100%);
  color:#fff;
  -webkit-font-smoothing:antialiased;
  font-family:Arial, "Helvetica Neue", "Microsoft YaHei", sans-serif;
  transition:opacity .6s ease, visibility .6s ease;
}
.tea-loader.is-done{ opacity:0; visibility:hidden; pointer-events:none; }
html.tea-lock, html.tea-lock body{ overflow:hidden !important; height:100%; }

/* 背景暗角 */
.tea-loader__veil{
  position:absolute; top:0; left:0; right:0; bottom:0; pointer-events:none;
  box-shadow:inset 0 0 22vmin rgba(0,0,0,.5);
}

/* ---------- 2. 背景光斑（缓慢漂移） ---------- */
.tea-loader__glow{ position:absolute; border-radius:50%; pointer-events:none; }
.tea-loader__glow--a{
  width:52vmin; height:52vmin; left:-12vmin; top:-14vmin;
  background:radial-gradient(circle, rgba(102,187,106,.42) 0%, rgba(102,187,106,0) 68%);
  animation:teaDrift 14s ease-in-out infinite;
}
.tea-loader__glow--b{
  width:46vmin; height:46vmin; right:-10vmin; bottom:-12vmin;
  background:radial-gradient(circle, rgba(82,183,136,.36) 0%, rgba(82,183,136,0) 68%);
  animation:teaDrift 17s ease-in-out infinite reverse;
}
.tea-loader__glow--c{
  width:38vmin; height:38vmin; right:16%; top:5%;
  background:radial-gradient(circle, rgba(167,232,161,.24) 0%, rgba(167,232,161,0) 70%);
  animation:teaDrift 21s ease-in-out infinite;
}
@keyframes teaDrift{
  0%,100%{ transform:translate3d(0,0,0) scale(1); }
  50%    { transform:translate3d(3vmin,-3vmin,0) scale(1.12); }
}

/* ---------- 3. 飘落的茶叶（纯 CSS 叶形） ---------- */
.tea-loader__leaves{ position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden; pointer-events:none; }
.tea-leaf{
  position:absolute; bottom:-10%; width:26px; height:26px;
  border-radius:0 100% 0 100%;
  background:linear-gradient(135deg, rgba(190,240,180,.55) 0%, rgba(102,187,106,.10) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
  opacity:0;
  animation:teaLeaf 12s linear infinite;
}
.tea-leaf::after{ /* 叶脉 */
  content:""; position:absolute; left:14%; top:14%; width:74%; height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.5), rgba(255,255,255,0));
  transform:rotate(45deg); transform-origin:0 50%;
}
@keyframes teaLeaf{
  0%  { transform:translate3d(0,0,0) rotate(0deg) scale(.8); opacity:0; }
  10% { opacity:.55; }
  78% { opacity:.32; }
  100%{ transform:translate3d(6vmin,-118vh,0) rotate(230deg) scale(1.05); opacity:0; }
}
.tea-leaf:nth-child(1){ left:6%;  animation-duration:13s; animation-delay:0s;   }
.tea-leaf:nth-child(2){ left:21%; animation-duration:16s; animation-delay:2.2s; width:18px; height:18px; }
.tea-leaf:nth-child(3){ left:37%; animation-duration:11s; animation-delay:1.1s; width:22px; height:22px; }
.tea-leaf:nth-child(4){ left:58%; animation-duration:15s; animation-delay:3.4s; }
.tea-leaf:nth-child(5){ left:74%; animation-duration:12s; animation-delay:.8s;  width:16px; height:16px; }
.tea-leaf:nth-child(6){ left:89%; animation-duration:17s; animation-delay:4.6s; width:20px; height:20px; }

/* ---------- 4. 主体 ---------- */
.tea-loader__inner{
  position:relative; z-index:2;
  display:flex; flex-direction:column; align-items:center;
  padding:0 24px; text-align:center;
}

/* 站标 */
.tea-loader__logo{ margin:0 0 clamp(26px,4vmin,52px); }
.tea-loader__logo img{ display:block; width:clamp(230px,30vmin,430px); height:auto; }

/* 环形进度 */
.tea-loader__ring{
  position:relative;
  width:clamp(120px,14vmin,200px); height:clamp(120px,14vmin,200px);
}
.tea-loader__gauge{ width:100%; height:100%; display:block; transform:rotate(-90deg); }
.tea-loader__track{ fill:none; stroke:rgba(255,255,255,.14); stroke-width:3; }
.tea-loader__arc{
  fill:none; stroke:url(#teaGrad); stroke-width:4; stroke-linecap:round;
  stroke-dasharray:326.73; stroke-dashoffset:326.73;
  transition:stroke-dashoffset .25s linear;
}
.tea-loader__spin{
  fill:none; stroke:rgba(217,242,200,.42); stroke-width:1.6; stroke-linecap:round;
  stroke-dasharray:90 274.4;
  transform-origin:60px 60px;
  animation:teaSpin 3.4s linear infinite;
}
@keyframes teaSpin{ to{ transform:rotate(360deg); } }

/* 环心百分比 */
.tea-loader__num{
  position:absolute; top:0; left:0; right:0; bottom:0;
  display:flex; align-items:center; justify-content:center;
  font-family:Georgia, "Times New Roman", serif; line-height:1;
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}
.tea-loader__num span{
  font-size:clamp(26px,3.4vmin,44px); letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
}
.tea-loader__num i{
  font-style:normal; font-size:clamp(11px,1.15vmin,15px);
  opacity:.6; margin-left:2px; transform:translateY(-.4em);
}

/* 状态提示 */
.tea-loader__tip{
  margin:clamp(20px,3vmin,38px) 0 0;
  font-size:clamp(11px,1.05vmin,14px); letter-spacing:.28em; text-transform:uppercase;
  color:rgba(255,255,255,.72);
  display:flex; align-items:center; justify-content:center;
}
.tea-loader__tip b{ font-weight:normal; }
.tea-loader__dots{ display:inline-flex; align-items:flex-end; margin-left:6px; height:1em; }
.tea-loader__dots i{
  width:3px; height:3px; border-radius:50%; background:rgba(255,255,255,.8);
  margin:0 2px; animation:teaDot 1.2s ease-in-out infinite;
}
.tea-loader__dots i:nth-child(2){ animation-delay:.15s; }
.tea-loader__dots i:nth-child(3){ animation-delay:.3s; }
@keyframes teaDot{
  0%,100%{ transform:translateY(0); opacity:.45; }
  40%    { transform:translateY(-.4em); opacity:1; }
}

/* 进入站点按钮（进度到 100% 后出现） */
.tea-loader__enter{
  margin-top:clamp(18px,2.6vmin,34px);
  display:inline-flex; align-items:center; gap:.6em;
  padding:.78em 2.1em; border:1px solid rgba(255,255,255,.55); border-radius:999px;
  color:#fff; font-size:clamp(12px,1.1vmin,14px); letter-spacing:.2em; text-transform:uppercase;
  text-decoration:none;
  background:rgba(255,255,255,.06);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .5s ease, visibility .5s ease, transform .5s ease, background .3s ease;
}
.tea-loader__enter:hover{ background:rgba(255,255,255,.16); color:#fff; }
.tea-loader.is-ready .tea-loader__enter{ opacity:1; visibility:visible; transform:translateY(0); }
.tea-loader__enter i{ font-style:normal; transition:transform .3s ease; }
.tea-loader__enter:hover i{ transform:translateX(4px); }

/* ---------- 5. 底部进度条 ---------- */
.tea-loader__bar{
  position:absolute; left:0; right:0; bottom:0; height:3px;
  background:rgba(255,255,255,.12); z-index:3;
}
.tea-loader__bar span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg, #66bb6a 0%, #a7e8a1 55%, #d9f2c8 100%);
  box-shadow:0 0 12px rgba(167,232,161,.7);
  transition:width .25s linear;
}
.tea-loader__foot{
  position:absolute; right:0; bottom:14px; z-index:3;
  padding:0 22px;
  font-size:11px; letter-spacing:.12em; color:rgba(255,255,255,.38);
}

/* ---------- 6. 低动效偏好 / 移动端 ---------- */
@media (prefers-reduced-motion: reduce){
  .tea-loader__glow, .tea-leaf, .tea-loader__spin, .tea-loader__dots i,
  .tea-loader__num span.is-tick{ animation:none !important; }
  .tea-leaf{ display:none; }
  .tea-loader__arc, .tea-loader__bar span{ transition:none; }
}
@media (max-width:640px){
  .tea-loader__foot{ display:none; }
  .tea-loader__logo img{ width:240px; }
  .tea-loader__ring{ width:132px; height:132px; }
  .tea-loader__num span{ font-size:30px; }
  .tea-loader__tip{ font-size:11px; letter-spacing:.2em; }
}

/* ---------- 7. 数字跳动 ----------
   百分比数值变化时由 loading.js 加上 is-tick 类，让数字轻微弹一下，
   便于肉眼确认加载在推进（每次变化都会重新触发一次动画）。 */
.tea-loader__num span.is-tick{ animation:teaTick .42s cubic-bezier(.2,.9,.3,1.25); }
@keyframes teaTick{
  0%  { transform:scale(1);    opacity:1; }
  35% { transform:scale(1.18); opacity:.72; }
  100%{ transform:scale(1);    opacity:1; }
}