/* =========================================================
   贤菜 炉石传说电竞计划（2026 / 2027 双页共用）
   静态单页 / PC 左右分栏 + 移动端沉浸式首屏
   主题：body.theme-red（暗红，2027）· body.theme-amber（暗橙，2026）
   ========================================================= */

:root{
  --bg-0:#150204;
  --gold:#d8b26a;
  --gold-2:#f0d9a3;
  --gold-deep:#b8863a;
  --ink:#f6e7cf;
  --paper:#f8f2e5;
  --paper-2:#eee2c9;
  --paper-ink:#33271c;

  /* 背景主题（默认暗红，.theme-amber 覆盖） */
  --bg-grad:linear-gradient(158deg, #1b0307 0%, #33060b 34%, #4d0b12 64%, #25040a 100%);
  --bg-wash-a:rgba(158,28,34,.55);
  --bg-wash-b:rgba(126,18,26,.62);
  --bg-wash-c:rgba(96,16,22,.40);
  --vignette:rgba(8,0,2,.74);
  --glow-warm:rgba(178,50,31,.40);
  --link-ink:#b2321f;          /* 底部外链长条的红色字 */

  --serif:"Songti SC","STSong","Noto Serif SC","Source Han Serif SC","SimSun",serif;
  --kai:"Kaiti SC","STKaiti","KaiTi","Songti SC","STSong",serif;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;

  --stage-w:48vw;          /* PC 左栏宽度 */
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* 2026：暗橙主题 */
body.theme-amber{
  --bg-0:#1e0b02;
  --bg-grad:linear-gradient(158deg, #240c02 0%, #4a1a03 34%, #6d2c05 64%, #2c1002 100%);
  --bg-wash-a:rgba(206,104,20,.52);
  --bg-wash-b:rgba(160,66,10,.60);
  --bg-wash-c:rgba(122,52,10,.42);
  --vignette:rgba(12,4,0,.74);
  --glow-warm:rgba(206,110,26,.42);
  --link-ink:#a83c10;
}


*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg-0);
  color:var(--ink);
  font-family:var(--sans);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; }
a{ color:inherit; text-decoration:none; }

/* ---------- 背景：主题渐变 / 光晕 / 颗粒 / 浮尘 ---------- */
.bg{
  position:fixed; inset:0; z-index:0; overflow:hidden;
  background:
    radial-gradient(115% 78% at 14% 6%, var(--bg-wash-a), transparent 60%),
    radial-gradient(95% 72% at 88% 94%, var(--bg-wash-b), transparent 62%),
    radial-gradient(70% 58% at 52% 46%, var(--bg-wash-c), transparent 72%),
    var(--bg-grad);
}
.bg::after{ /* 暗角 */
  content:""; position:absolute; inset:0;
  background:radial-gradient(122% 100% at 50% 42%, transparent 40%, var(--vignette) 100%);
}
.glow{ position:absolute; border-radius:50%; filter:blur(90px); will-change:transform; }
.glow-a{ width:48vmax; height:48vmax; left:-14vmax; top:-12vmax;
  background:radial-gradient(circle, rgba(216,178,106,.24), transparent 66%); }
.glow-b{ width:54vmax; height:54vmax; right:-18vmax; bottom:-20vmax;
  background:radial-gradient(circle, var(--glow-warm), transparent 68%); }
.noise{ position:absolute; inset:0; opacity:.15; mix-blend-mode:overlay;
  background-image:var(--noise); background-size:220px 220px; }
.dust{ position:absolute; inset:0; }
.dust span{
  position:absolute; bottom:-4vh; border-radius:50%;
  background:radial-gradient(circle, rgba(240,217,163,.95) 0%, rgba(240,217,163,0) 70%);
  animation:rise linear infinite;
}
@keyframes rise{
  0%{ transform:translate3d(0,0,0) scale(.6); opacity:0; }
  12%{ opacity:.75; }
  80%{ opacity:.5; }
  100%{ transform:translate3d(3vw,-112vh,0) scale(1.1); opacity:0; }
}

/* ---------- 布局骨架 ---------- */
.page{ position:relative; z-index:1; }

/* 左侧：定妆照栏（PC 固定在视口，不随滚动） */
.stage{
  position:fixed; left:0; top:0; width:var(--stage-w);
  height:100vh; height:100dvh;
  display:flex; align-items:flex-end; justify-content:center;
  pointer-events:none;
}
.aura{
  position:absolute; left:46%; bottom:8%; width:76%; aspect-ratio:1;
  transform:translateX(-50%); border-radius:50%; filter:blur(56px);
  background:radial-gradient(circle, rgba(216,178,106,.30) 0%, rgba(190,60,40,.24) 44%, transparent 72%);
}
.portrait{
  position:relative; display:block; height:min(93vh,96dvh); width:auto; max-width:100%;
  margin-bottom:-1px;
  object-fit:contain; object-position:bottom center;
  filter:drop-shadow(0 26px 48px rgba(0,0,0,.6));
  -webkit-mask-image:linear-gradient(to bottom, #000 84%, rgba(0,0,0,.45) 95%, transparent 100%);
  mask-image:linear-gradient(to bottom, #000 84%, rgba(0,0,0,.45) 95%, transparent 100%);
  animation:breathe 9s ease-in-out infinite;
}
@keyframes breathe{
  0%,100%{ transform:translateY(0) scale(1); }
  50%{ transform:translateY(-10px) scale(1.012); }
}
.caption{
  position:absolute; left:clamp(1.6rem,4.5vw,3.6rem); bottom:clamp(1.6rem,5.5vh,3.2rem); margin:0;
}
.cap-line{
  display:block; width:2.6rem; height:1px; margin-bottom:.85rem;
  background:linear-gradient(90deg, var(--gold), transparent);
}
.cap-motto{
  display:block; font-family:var(--serif); line-height:1.95;
  font-size:clamp(.82rem,1vw,.95rem); letter-spacing:.22em;
  color:rgba(240,217,163,.86); text-shadow:0 2px 16px rgba(0,0,0,.6);
}

/* 右侧：内容栏 */
.content{
  margin-left:var(--stage-w); width:calc(100% - var(--stage-w));
  padding:0 clamp(1.6rem,4.6vw,4.6rem) 0;
}
.wrap{ width:100%; max-width:44rem; margin-inline:auto; }

/* ---------- 首屏 ---------- */
.hero{
  min-height:92vh; min-height:92svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding-bottom:clamp(3rem,9vh,7rem);
}
.title{ margin:0; font-family:var(--serif); font-weight:600; line-height:1.24; }
.title-line{
  display:block; font-size:clamp(1.68rem,4.6vw,3.05rem); letter-spacing:.08em;
  background:linear-gradient(178deg,#fdf3da 0%,#e9c887 48%,#b3853b 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 8px 26px rgba(0,0,0,.5));
}
.title-line + .title-line{ margin-top:.36em; }
.title-year{ letter-spacing:.02em; }
.rule{ display:flex; align-items:center; gap:.8rem; margin:1.7rem 0 1.1rem; max-width:19rem; }
.rule i{ flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(216,178,106,.65),transparent); }
.rule b{ font-size:.6rem; color:var(--gold); line-height:1; }
.rule-sm{ max-width:11rem; margin:0 auto 1.1rem; }
.hero-note{ margin:0; font-size:.9rem; letter-spacing:.12em; color:rgba(246,231,207,.6); }
.scroll-hint{
  display:inline-flex; align-items:center; gap:.5rem; margin-top:2.6rem; align-self:flex-start;
  font-size:.76rem; letter-spacing:.28em; color:rgba(216,178,106,.85);
  transition:opacity .4s ease, color .3s ease;
}
.scroll-hint span{ animation:bob 1.9s ease-in-out infinite; }
.scroll-hint:hover{ color:var(--gold-2); }
.scroll-hint.gone{ opacity:0; pointer-events:none; }
@keyframes bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(5px); } }

/* ---------- 纸张 ---------- */
.section{ padding-block:clamp(2.5rem,7vh,5rem); }
.paper{
  position:relative; overflow:hidden;
  padding:clamp(2rem,4.6vw,3.6rem) clamp(1.5rem,3.8vw,3.2rem) clamp(2rem,4vw,3rem);
  color:var(--paper-ink);
  border-radius:3px;
  background:
    radial-gradient(120% 90% at 8% 0%, #fdf9f0 0%, transparent 55%),
    linear-gradient(163deg, #fbf6ea 0%, var(--paper) 42%, var(--paper-2) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 2px 0 rgba(0,0,0,.22),
    0 34px 62px -22px rgba(0,0,0,.68);
}
.paper::before{ /* 纸纤维 */
  content:""; position:absolute; inset:0; opacity:.32; mix-blend-mode:multiply;
  background-image:var(--noise); background-size:180px 180px; pointer-events:none;
}
.paper::after{ /* 左侧装订阴影 */
  content:""; position:absolute; left:0; top:0; bottom:0; width:14px;
  background:linear-gradient(90deg, rgba(120,90,50,.16), transparent); pointer-events:none;
}
.paper-frame{ /* 内嵌细边框：必须保持绝对定位，不能被下面的 .paper > * 覆盖 */
  position:absolute; inset:.72rem; border:1px solid rgba(140,42,32,.16);
  border-radius:2px; pointer-events:none;
}
/* 正文内容抬到纸纤维/装订阴影之上（内框除外） */
.paper > *:not(.paper-frame){ position:relative; }
.paper-frame + .paper-h{ margin-top:0; }
.paper p{
  margin:0 0 1.15rem; text-indent:2em;
  font-family:var(--kai); font-size:clamp(1rem,1.28vw,1.12rem);
  line-height:2.06; letter-spacing:.015em; color:#3a2c20;
}
.paper p:last-of-type{ margin-bottom:0; }
.paper-h{
  display:flex; align-items:center; gap:.7rem; margin:2.4rem 0 1.05rem;
  font-family:var(--serif); font-size:clamp(1.05rem,1.5vw,1.25rem);
  font-weight:600; letter-spacing:.16em; color:#8c2a20;
}
.paper-h span{
  flex:0 0 auto; width:1.9em; height:1.9em; display:grid; place-items:center;
  border:1px solid rgba(140,42,32,.5); border-radius:50%;
  font-size:.78em; letter-spacing:0;
}
.paper-h::after{
  content:""; flex:1; height:1px;
  background:linear-gradient(90deg, rgba(140,42,32,.35), transparent);
}
.sign{ display:flex; flex-direction:column; align-items:flex-end; gap:.55rem; margin-top:3rem; }
.sign-name{ font-family:var(--serif); font-size:1.45rem; letter-spacing:.24em; }
.sign-date{ font-size:.8rem; letter-spacing:.1em; color:rgba(58,44,32,.6); }

/* ---------- 目标清单 ---------- */
.section-head{ margin-bottom:1.6rem; }
.section-kicker{
  margin:0 0 .7rem; font-size:.72rem; letter-spacing:.36em; color:rgba(216,178,106,.72);
}
.section-title{
  margin:0 0 .8rem; font-family:var(--serif); font-weight:600;
  font-size:clamp(1.7rem,2.7vw,2.3rem); letter-spacing:.12em;
  background:linear-gradient(178deg,#fdf3da,#e9c887 55%,#b3853b);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.4));
}
.progress{ display:flex; align-items:center; gap:.9rem; margin-top:1.5rem; }
.progress-bar{ flex:1; height:3px; border-radius:99px; background:rgba(255,255,255,.1); overflow:hidden; }
.progress-bar i{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold-2));
  box-shadow:0 0 12px rgba(216,178,106,.55);
  transition:width .55s cubic-bezier(.2,.8,.2,1);
}
.progress-text{ font-size:.76rem; letter-spacing:.14em; color:rgba(216,178,106,.8); white-space:nowrap; }
.progress-text b{ color:var(--gold-2); font-weight:600; }
.progress-reset{
  border:0; background:none; padding:.2rem .1rem; cursor:pointer;
  font-family:inherit; font-size:.74rem; letter-spacing:.16em;
  color:rgba(246,231,207,.45); border-bottom:1px solid rgba(246,231,207,.25);
  transition:color .25s;
}
.progress-reset:hover{ color:var(--gold-2); }

.goals{ list-style:none; margin:0; padding:0; display:grid; gap:.7rem; counter-reset:goal; }
.goal{
  counter-increment:goal;
  position:relative; display:flex; align-items:flex-start; gap:1rem;
  padding:1rem 2.9rem 1rem 1.25rem;
  border:1px solid rgba(216,178,106,.16); border-radius:3px;
  background:linear-gradient(90deg, rgba(255,255,255,.062), rgba(255,255,255,.018) 58%, rgba(255,255,255,.045));
  backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);
  transition:border-color .3s ease, transform .3s ease, background .3s ease, box-shadow .3s ease;
}
.goal::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px; border-radius:3px 0 0 3px;
  background:linear-gradient(180deg, rgba(216,178,106,.55), rgba(216,178,106,.06));
  transition:background .3s ease, box-shadow .3s ease;
}
.goal:hover{
  transform:translateX(4px); border-color:rgba(216,178,106,.42);
  background:linear-gradient(90deg, rgba(255,255,255,.1), rgba(255,255,255,.03) 58%, rgba(255,255,255,.06));
  box-shadow:0 12px 28px -16px rgba(0,0,0,.8);
}
.goal:hover::before{ background:linear-gradient(180deg,var(--gold-2),rgba(216,178,106,.25)); box-shadow:0 0 14px rgba(216,178,106,.5); }
.goal-index{
  position:absolute; right:1rem; top:50%; transform:translateY(-50%);
  font-family:var(--serif); font-size:1.5rem; line-height:1;
  color:rgba(216,178,106,.2); letter-spacing:.02em; pointer-events:none;
}
.goal-index::before{ content:counter(goal,decimal-leading-zero); }
.goal-text{
  font-family:var(--serif); font-size:clamp(.98rem,1.34vw,1.08rem);
  line-height:1.72; letter-spacing:.04em; color:var(--ink);
  background-image:linear-gradient(90deg, rgba(216,178,106,.6), rgba(216,178,106,.18));
  background-repeat:no-repeat; background-position:0 56%; background-size:0% 1px;
  transition:background-size .5s cubic-bezier(.3,.8,.2,1), color .35s ease;
}

/* 方框（待完成 → 已完成） */
.check{
  flex:0 0 auto; width:1.4rem; height:1.4rem; margin-top:.14rem; padding:0;
  display:grid; place-items:center; cursor:pointer;
  border:1.5px solid rgba(216,178,106,.55); border-radius:3px;
  background:rgba(10,0,2,.35);
  transition:background .3s ease, border-color .3s ease, box-shadow .3s ease, transform .18s ease;
}
.check:hover{ border-color:var(--gold-2); box-shadow:0 0 0 4px rgba(216,178,106,.1); }
.check:active{ transform:scale(.92); }
.check:focus-visible{ outline:2px solid var(--gold-2); outline-offset:3px; }
.check svg{ width:.85rem; height:.85rem; fill:none; stroke:var(--gold-2); stroke-width:2.6;
  stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:24; stroke-dashoffset:24;
  transition:stroke-dashoffset .4s ease .06s, stroke .3s ease; }
.goal.done .check{
  background:linear-gradient(158deg,#f0d9a3,#c9973f); border-color:transparent;
  box-shadow:0 0 0 4px rgba(216,178,106,.12), 0 4px 14px -4px rgba(216,178,106,.5);
}
.goal.done .check svg{ stroke:#3a2408; stroke-dashoffset:0; }
.goal.done .goal-text{ background-size:100% 1px; color:rgba(246,231,207,.46); }
.goal.done::before{ background:linear-gradient(180deg,var(--gold-2),rgba(216,178,106,.15)); }
.goal.done .goal-index{ color:rgba(216,178,106,.42); }

/* ---------- 页脚 ---------- */
.footer{ padding-block:clamp(3rem,9vh,6rem) clamp(1.5rem,4vh,3rem); text-align:center; }
.footer-main{ margin:0; font-family:var(--serif); font-size:1.05rem; letter-spacing:.34em; color:var(--gold-2); }
.footer-sub{ margin:.9rem 0 0; font-size:.8rem; letter-spacing:.14em; color:rgba(246,231,207,.5); }

/* ---------- 底部外链长条（白底红字，指向另一年的计划） ---------- */
.link-bar{ padding-bottom:clamp(4.5rem,10vh,7rem); }
.plan-link{
  position:relative; display:flex; align-items:center; gap:1.1rem;
  width:100%; padding:1.15rem 1.5rem;
  border-radius:4px; overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0%,#fdf7ef 100%);
  color:var(--link-ink);
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 14px 34px -14px rgba(0,0,0,.65),
    0 0 0 1px rgba(255,255,255,.28);
  transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease;
}
.plan-link::after{ /* 悬停扫光 */
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(105deg, transparent 38%, rgba(255,255,255,.75) 50%, transparent 62%);
  transform:translateX(-120%);
  transition:transform .75s ease;
}
.plan-link:hover{
  transform:translateY(-3px);
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 22px 44px -16px rgba(0,0,0,.7),
    0 0 0 1px rgba(255,255,255,.45);
}
.plan-link:hover::after{ transform:translateX(120%); }
.plan-link:active{ transform:translateY(-1px); }
.plan-link:focus-visible{ outline:3px solid var(--gold-2); outline-offset:3px; }
.plan-link-txt{ display:flex; flex-direction:column; gap:.35rem; min-width:0; }
.plan-link-label{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(1.02rem,1.6vw,1.22rem); letter-spacing:.14em;
}
.plan-link-sub{
  font-size:.74rem; letter-spacing:.1em; color:rgba(0,0,0,.42);
}
.plan-link-arrow{
  margin-left:auto; flex:0 0 auto;
  font-size:1.3rem; line-height:1; color:var(--link-ink);
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.plan-link:hover .plan-link-arrow{ transform:translateX(6px); }

/* ---------- 背景音乐按钮（默认折叠成圆点，悬停/点按展开显示曲名） ---------- */
.bgm{
  position:fixed; z-index:6;
  right:clamp(1rem,2.4vw,1.7rem);
  bottom:max(1.1rem, env(safe-area-inset-bottom));
}
.bgm-btn{
  position:relative; display:inline-flex; align-items:center;
  height:3rem; padding:0; overflow:hidden;
  border:1px solid rgba(216,178,106,.5); border-radius:999px;
  background:linear-gradient(180deg, rgba(48,8,12,.92), rgba(16,2,4,.94));
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  cursor:pointer;
  box-shadow:0 12px 28px -14px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.06);
  transition:border-color .3s ease, transform .2s ease, box-shadow .3s ease;
}
body.theme-amber .bgm-btn{
  background:linear-gradient(180deg, rgba(74,30,8,.92), rgba(26,10,2,.94));
}
.bgm-btn:hover{ border-color:var(--gold-2); box-shadow:0 16px 34px -14px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.1); }
.bgm-btn:active{ transform:scale(.96); }
.bgm-btn:focus-visible{ outline:2px solid var(--gold-2); outline-offset:3px; }

/* 曲名：折叠时宽度为 0，展开时向左推出 */
.bgm-title{
  max-width:0; opacity:0; padding-left:0; overflow:hidden; white-space:nowrap;
  font-size:.82rem; letter-spacing:.07em; color:var(--gold-2);
  transition:max-width .42s cubic-bezier(.2,.8,.2,1), opacity .26s ease,
             padding-left .42s cubic-bezier(.2,.8,.2,1);
}
.bgm.open .bgm-title{ max-width:13rem; opacity:1; padding-left:1.15rem; }

/* 图标槽：固定 3rem 见方，让折叠态就是个正圆 */
.bgm-icon{ flex:0 0 auto; width:3rem; height:3rem; display:grid; place-items:center; }

/* 三根跳动的金色音柱 */
.bgm-bars{ display:flex; align-items:flex-end; gap:2.5px; height:1.05rem; }
.bgm-bars i{
  display:block; width:2.5px; border-radius:2px;
  background:linear-gradient(180deg, var(--gold-2), var(--gold-deep));
  height:38%; opacity:.55;
  transition:height .3s ease, opacity .3s ease;
}
/* 播放中：音柱起伏 */
.bgm.playing .bgm-bars i{ opacity:1; animation:eq .95s ease-in-out infinite; }
.bgm.playing .bgm-bars i:nth-child(1){ animation-delay:-.2s; }
.bgm.playing .bgm-bars i:nth-child(2){ animation-delay:-.55s; }
.bgm.playing .bgm-bars i:nth-child(3){ animation-delay:-.8s; }
@keyframes eq{
  0%,100%{ height:30%; } 50%{ height:100%; }
}
/* 未播放且未展开：一圈轻轻外扩的光晕，提示可以点 */
.bgm:not(.playing):not(.open) .bgm-btn::after{
  content:""; position:absolute; inset:-1px; border-radius:999px;
  border:1px solid rgba(216,178,106,.55);
  animation:bgmPulse 2.6s ease-out infinite;
  pointer-events:none;
}
@keyframes bgmPulse{
  0%{ transform:scale(1); opacity:.7; }
  70%{ transform:scale(1.32); opacity:0; }
  100%{ transform:scale(1.32); opacity:0; }
}
@media (max-width:1023px){
  .bgm-btn{ height:2.75rem; }
  .bgm-icon{ width:2.75rem; height:2.75rem; }
  .bgm-bars{ height:.95rem; }
  .bgm-title{ font-size:.78rem; }
  .bgm.open .bgm-title{ max-width:11rem; padding-left:1rem; }
}
@media (prefers-reduced-motion:reduce){
  .bgm.playing .bgm-bars i{ animation:none; height:70%; }
  .bgm:not(.playing):not(.open) .bgm-btn::after{ animation:none; opacity:.35; }
}

/* ---------- 入场 ---------- */
.reveal{ opacity:0; transform:translateY(30px);
  transition:opacity .85s ease, transform .85s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* =========================================================
   移动端 / 平板：单栏，定妆照作为首屏半透明背景
   ========================================================= */
@media (max-width:1023px){
  .page{ position:relative; }
  .stage{
    position:absolute; left:0; top:0; right:0; width:auto;
    height:78svh; display:block;
  }
  .aura{ left:22%; bottom:22%; width:62%; filter:blur(48px); opacity:.85; }
  .portrait{
    height:100%; width:auto; max-width:none;
    margin-left:-8vw; object-position:left top;
    opacity:.42; filter:saturate(.92) drop-shadow(0 18px 34px rgba(0,0,0,.5));
    -webkit-mask-image:radial-gradient(112% 92% at 32% 26%, #000 22%, rgba(0,0,0,.55) 56%, transparent 78%);
    mask-image:radial-gradient(112% 92% at 32% 26%, #000 22%, rgba(0,0,0,.55) 56%, transparent 78%);
  }
  .caption{ left:clamp(1.4rem,5vw,2rem); bottom:auto; top:clamp(1.6rem,4vh,2.6rem); }
  .cap-line{ width:2rem; margin-bottom:.6rem; }
  .cap-motto{ font-size:.78rem; letter-spacing:.18em; line-height:1.85; }

  .content{ margin-left:0; width:100%; padding:0 clamp(1.25rem,5vw,2.4rem); }
  .hero{ min-height:88svh; padding-bottom:clamp(2.4rem,7vh,4.5rem); }
  .title-line{ font-size:clamp(1.6rem,7.4vw,2.1rem); }
  .scroll-hint{ margin-top:2rem; }

  .paper{ border-radius:2px; }
  .sign{ margin-top:2.4rem; }
  .goal{ padding:1rem 2.4rem 1rem 1.1rem; }
  .goal-index{ font-size:1.2rem; right:.85rem; }
  .plan-link{ padding:1rem 1.15rem; gap:.8rem; }
  .plan-link-sub{ font-size:.7rem; }
}

@media (max-width:420px){
  .cap-motto{ letter-spacing:.12em; }
  .goal-text{ font-size:.95rem; }
}

/* 横屏手机 / 矮屏：首屏别太高 */
@media (max-width:1023px) and (max-height:520px){
  .hero{ min-height:auto; padding-top:34svh; }
  .stage{ height:66svh; }
}

/* ---------- 无障碍 / 动效偏好 ---------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  .portrait,.scroll-hint span,.dust span{ animation:none; }
  .dust{ display:none; }
}