/* ============================================================
 * 首页全屏入场语句：这个世界错了，但吃药的是我
 * 入场：逐字浮现；文字出完后主句下方出现「进入网站」按钮
 * 必须点击才进入；点击任意处 / 空格 / 回车 / Esc 均可
 * ============================================================ */

.intro-overlay{
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1200px 800px at 50% 42%,#1b2b34 0%,#0d181e 58%,#070f13 100%);
  opacity:0;transition:opacity .4s ease;
  -webkit-tap-highlight-color:transparent;
  cursor:pointer;
}
.intro-overlay.show{opacity:1}
.intro-overlay.bye{opacity:0;pointer-events:none}

/* 极细的呼吸感光晕，避免死板 */
.intro-overlay::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 45% at 50% 50%,rgba(120,170,190,.10),rgba(0,0,0,0) 70%);
  animation:intro-breathe 7s ease-in-out infinite;
}
@keyframes intro-breathe{
  0%,100%{opacity:.55;transform:scale(1)}
  50%{opacity:1;transform:scale(1.06)}
}

.intro-inner{
  position:relative;z-index:1;
  padding:0 26px;text-align:center;
  max-width:760px;
}

/* 句子：每个字一个 span，逐字浮现 */
.intro-line{
  margin:0;
  font-size:clamp(26px,5.4vw,50px);
  line-height:1.5;
  font-weight:700;
  letter-spacing:.02em;
  color:#eef5f7;
  text-shadow:0 2px 26px rgba(0,0,0,.5);
}
.intro-line .ch{
  display:inline-block;
  opacity:0;
  transform:translateY(16px);
  filter:blur(6px);
  animation:intro-ch-in .5s cubic-bezier(.22,.9,.28,1) forwards;
  animation-delay:var(--d,0ms);
}
@keyframes intro-ch-in{
  to{opacity:1;transform:translateY(0);filter:blur(0)}
}

/* 「进入网站」按钮：主句正下方（原副句位置），文字出完后才浮现 */
.intro-cta{
  margin-top:38px;
  display:flex;justify-content:center;
  opacity:0;transform:translateY(14px);
  transition:opacity .55s ease,transform .55s ease;
  pointer-events:none;
}
.intro-overlay.ready .intro-cta{opacity:1;transform:translateY(0)}
.cta-btn{
  pointer-events:auto;
  padding:13px 40px;border-radius:999px;
  border:1px solid rgba(160,215,235,.55);
  background:rgba(120,190,220,.10);
  color:#e6f4f9;font-family:inherit;
  font-size:clamp(14px,1.7vw,16px);font-weight:600;letter-spacing:.16em;
  cursor:pointer;
  animation:cta-breathe 2.1s ease-in-out infinite;
  box-shadow:0 6px 26px rgba(0,0,0,.28);
  transition:background .18s,border-color .18s;
}
.cta-btn:hover{background:rgba(120,190,220,.24);border-color:rgba(180,230,245,.8)}
@keyframes cta-breathe{
  0%,100%{box-shadow:0 6px 26px rgba(0,0,0,.28),0 0 0 0 rgba(127,208,230,.34);background:rgba(120,190,220,.10)}
  50%{box-shadow:0 6px 26px rgba(0,0,0,.28),0 0 0 14px rgba(127,208,230,0);background:rgba(120,190,220,.20)}
}

/* 出场：整块上浮淡出 */
.intro-overlay.bye .intro-inner{
  transform:translateY(-26px);
  opacity:0;
  transition:transform .6s cubic-bezier(.5,0,.75,0),opacity .6s ease;
}

@media (prefers-reduced-motion:reduce){
  .intro-overlay::after{animation:none}
  .intro-line .ch{animation-duration:.01ms;animation-delay:0ms!important;opacity:1;transform:none;filter:none}
  .cta-btn{animation:none}
  .intro-cta{transition-duration:.01ms}
}