/* ════════════════════════════════════════════════════════════
   烂笔头 · 移动 H5 官网  视觉系统 v3
   墨黑底 · 香槟金唯一强调 · 中文衬线 editorial · 移动优先
   规范来源：DESIGN-TOKENS.md + CLAUDE.md（全中文标题 / 无装饰英文）
   ════════════════════════════════════════════════════════════ */
:root{
  /* 色 —— 严格取自 token */
  --ink:        #0A0A0A;
  --ink-2:      #070707;
  --obsidian:   #111110;
  --surf-1:     #161513;
  --surf-1-hi:  #1c1a16;
  --surf-2:     #1d1b16;
  --surf-3:     #2a261d;

  --champagne:  #C9A961;
  --champagne-d:#BD9C53;
  --burnished:  #8F7843;
  --gold-soft:  rgba(201,169,97,0.55);
  --gold-hint:  rgba(201,169,97,0.30);
  --gold-faint: rgba(201,169,97,0.14);
  --gold-mist:  rgba(201,169,97,0.05);

  --ivory:      #F5F2EA;
  --bone:       #E3DECF;
  --stone:      #C9C3B2;
  --ash:        #847d6a;
  --ash-d:      #545040;

  --crimson:    #A33A3A;
  --crimson-soft:rgba(163,58,58,0.42);
  --crimson-mist:rgba(163,58,58,0.10);

  --line:        rgba(245,242,234,0.07);
  --line-strong: rgba(245,242,234,0.13);
  --line-inset:  rgba(255,255,255,0.035);

  --serif-cjk:'Noto Serif SC','Songti SC',serif;
  --serif-latin:'Playfair Display','Noto Serif SC',serif;
  --mono:'JetBrains Mono','SF Mono',monospace;
  --sans:-apple-system,'PingFang SC',system-ui,sans-serif;

  /* 间距 4x */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:22px;--s6:32px;--s7:48px;--s8:56px;--s9:80px;

  /* 阅读列宽（移动优先；桌面也用这个列宽，居中 + 侧栏装饰） */
  --col: 480px;
  --pad: 24px;

  --r-sm:4px;--r-md:8px;--r-lg:14px;--r-pill:999px;
}

*{box-sizing:border-box;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ink);color:var(--ivory);
  font-family:var(--serif-cjk);font-weight:300;line-height:1.85;
  overflow-x:hidden;
}
::selection{background:rgba(201,169,97,0.22);color:var(--ivory)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.mono{font-family:var(--mono);font-feature-settings:"tnum";font-weight:500}
.num{font-family:var(--mono);font-weight:500;color:var(--champagne);font-feature-settings:"tnum"}
.em{color:var(--champagne)}

/* 阅读列 —— 全站内容统一在这个居中列内 */
.col{width:100%;max-width:var(--col);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.band{position:relative;padding-top:clamp(72px,15vw,116px);padding-bottom:clamp(72px,15vw,116px)}
.band.tight{padding-top:clamp(48px,9vw,72px);padding-bottom:clamp(48px,9vw,72px)}
.bg-ink{background:var(--ink)}
.bg-obs{background:var(--obsidian)}

/* 章节眉标：罗马序号 · 中文（无英文装饰标题） */
.eyebrow{
  display:flex;align-items:center;gap:12px;margin-bottom:var(--s5);
}
.eyebrow .rn{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.22em;color:var(--champagne)}
.eyebrow .nm{font-family:var(--serif-cjk);font-size:12px;font-weight:400;letter-spacing:.32em;color:var(--burnished)}
.eyebrow::after{content:'';flex:1;height:.5px;background:var(--line-strong)}

/* ════════════════════════════════════════════════════════════
   三秒电影感开屏（复刻 GLB-01：logo → LANBITOU 字距渐开 → 金线 → 烂笔头）
   ════════════════════════════════════════════════════════════ */
#intro{
  position:fixed;inset:0;z-index:200;background:var(--ink-2);
  display:flex;align-items:center;justify-content:center;
  transition:opacity .6s cubic-bezier(.4,0,.2,1);
}
#intro.gone{opacity:0;pointer-events:none}
.intro-stack{display:flex;flex-direction:column;align-items:center;gap:46px;transform:translateY(-6px)}
.intro-logo{
  width:96px;height:96px;object-fit:contain;
  opacity:0;transform:scale(.96);
  animation:introLogo 1.2s cubic-bezier(.2,0,0,1) .4s forwards;
}
.intro-lock{display:flex;flex-direction:column;align-items:center;gap:22px}
.intro-word{
  font-family:var(--serif-latin);font-weight:500;font-size:34px;line-height:1;
  color:var(--ivory);opacity:0;
  letter-spacing:.25em;padding-left:.25em;
  animation:introWord 1.2s cubic-bezier(.2,0,0,1) 1.2s forwards;
}
.intro-rule{
  width:84px;height:.5px;background:var(--champagne);
  transform:scaleX(0);transform-origin:center;
  animation:introRule .8s cubic-bezier(.4,0,.2,1) 1.8s forwards;
}
.intro-cjk{
  font-family:var(--serif-cjk);font-weight:300;font-size:15px;line-height:1.4;
  color:var(--ivory);opacity:0;
  letter-spacing:.4em;padding-left:.4em;
  animation:introWord 1s cubic-bezier(.2,0,0,1) 2.2s forwards;
}
.intro-skip{
  position:absolute;bottom:34px;left:50%;transform:translateX(-50%);
  font-family:var(--serif-cjk);font-size:12px;letter-spacing:.2em;color:var(--ash);
  opacity:0;animation:introFade 1s ease 2.6s forwards;background:none;border:none;cursor:pointer;
}
@keyframes introLogo{to{opacity:1;transform:scale(1)}}
@keyframes introWord{from{opacity:0;letter-spacing:.25em}to{opacity:1;letter-spacing:.9em;padding-left:.9em}}
@keyframes introRule{to{transform:scaleX(1)}}
@keyframes introFade{to{opacity:.8}}

/* ════════════════════════════════════════════════════════════
   顶栏（开屏后浮现）
   ════════════════════════════════════════════════════════════ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:90;height:58px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--pad);
  opacity:0;transform:translateY(-8px);
  transition:opacity .6s ease,transform .6s ease,background .4s ease,border-color .4s ease;
  border-bottom:.5px solid transparent;
}
.nav.show{opacity:1;transform:none}
.nav.scrolled{background:rgba(10,10,10,0.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:.5px solid var(--line)}
.nav .brand{display:flex;align-items:center;gap:11px}
.nav .brand .logo{width:24px;height:24px;object-fit:contain;flex-shrink:0}
.nav .brand .lock{display:flex;align-items:baseline;gap:9px}
.nav .brand .lock .en{font-family:var(--serif-latin);font-size:17px;font-weight:500;letter-spacing:.2em;color:var(--ivory)}
.nav .brand .lock .cn{font-family:var(--serif-cjk);font-size:13px;font-weight:400;letter-spacing:.16em;color:var(--champagne)}
.nav .cta{
  font-family:var(--serif-cjk);font-size:13px;font-weight:400;letter-spacing:.12em;color:var(--ink);
  background:var(--champagne);padding:8px 18px;border-radius:var(--r-pill);
  transition:background .25s ease,transform .2s ease;
}
.nav .cta:active{transform:scale(.96)}

/* ════════════════════════════════════════════════════════════
   HERO
   ════════════════════════════════════════════════════════════ */
.hero{
  position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;
  padding-top:96px;padding-bottom:92px;overflow:hidden;
}
.hero-eyebrow{
  font-family:var(--serif-cjk);font-weight:400;font-size:13px;letter-spacing:.3em;
  color:var(--burnished);margin-bottom:var(--s6);
  display:flex;align-items:center;gap:11px;
}
.hero-eyebrow::before{content:'';width:26px;height:.5px;background:var(--burnished)}
.hero-h1{
  font-family:var(--serif-cjk);font-weight:500;
  font-size:clamp(42px,13.5vw,72px);line-height:1.12;letter-spacing:.01em;
  color:var(--ivory);margin:0;text-wrap:balance;
}
.hero-h1 .em{color:var(--champagne)}
.hero-sub{
  margin:var(--s6) 0 0;font-family:var(--serif-cjk);font-weight:300;
  font-size:clamp(16px,4.6vw,19px);line-height:2;letter-spacing:.03em;
  color:var(--stone);max-width:30ch;text-wrap:pretty;
}
.hero-actions{margin-top:var(--s7);display:flex;align-items:center;gap:18px;flex-wrap:wrap}
/* 美业行业图标排 */
.hero-trades{
  margin-top:var(--s7);display:grid;grid-template-columns:repeat(5,1fr);gap:6px;
  padding-top:var(--s6);border-top:.5px solid var(--line);
}
.hero-trades .ht{display:flex;flex-direction:column;align-items:center;gap:11px}
.hero-trades .ht .ic{width:34px;height:34px}
.hero-trades .ht .ic .icn{stroke-width:1.1}
.hero-trades .ht .nm{font-family:var(--serif-cjk);font-weight:300;font-size:13px;letter-spacing:.08em;color:var(--stone)}
.btn-primary{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--serif-cjk);font-weight:400;font-size:15px;letter-spacing:.1em;
  padding:14px 28px;border-radius:var(--r-pill);
  background:var(--champagne);color:var(--ink);border:.5px solid var(--champagne);
  transition:transform .2s ease,background .25s ease;
}
.btn-primary:active{transform:scale(.97)}
.btn-primary .ic{width:16px;height:16px}
.btn-primary .ic path,.btn-primary .ic line,.btn-primary .ic polyline{stroke:var(--ink);stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.hero-meta{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--ash)}

/* hero 氛围图（可拖拽替换） */
.hero-stage{position:relative;margin-top:var(--s8);height:clamp(300px,64vw,420px)}
.hero-atmo{position:absolute;inset:0;border-radius:var(--r-md);overflow:hidden}
/* 生产图片：hero 氛围图 + 成片 */
.hero-atmo-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  border-radius:var(--r-md);box-shadow:inset 0 0 0 .5px var(--gold-hint)}
.work-img{width:140px;height:186px;flex-shrink:0;object-fit:cover;border-radius:6px;
  border:.5px solid var(--line);scroll-snap-align:start}

.scroll-cue{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;color:var(--ash);
}
.scroll-cue .ln{width:.5px;height:34px;background:linear-gradient(var(--gold-soft),transparent);
  animation:cueDrop 2.4s ease-in-out infinite}
@keyframes cueDrop{0%,100%{transform:scaleY(.4);opacity:.4;transform-origin:top}50%{transform:scaleY(1);opacity:1;transform-origin:top}}

/* ════════════════════════════════════════════════════════════
   痛点 · 论点
   ════════════════════════════════════════════════════════════ */
.statement{
  font-family:var(--serif-cjk);font-weight:400;
  font-size:clamp(25px,7.6vw,38px);line-height:1.6;letter-spacing:.01em;
  color:var(--ivory);margin:0;text-wrap:balance;
}
.statement .em{color:var(--champagne)}
.statement .muted{color:var(--ash)}

/* 横滑卡片公用容器：左侧与正文对齐（不贴边），右侧出血引导滑动 */
.hscroll{
  display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  margin:0 calc(var(--pad) * -1) 0 0;padding:0 var(--pad) var(--s2) 0;
  scroll-padding-left:0;
}
.hscroll::-webkit-scrollbar{display:none}
.hscroll-hint{display:flex;align-items:center;gap:8px;margin-top:var(--s4);
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--ash)}
.hscroll-hint .dots{display:flex;gap:5px}
.hscroll-hint .dots i{width:5px;height:5px;border-radius:50%;background:var(--ash-d);transition:background .3s,width .3s}
.hscroll-hint .dots i.on{background:var(--champagne);width:14px;border-radius:3px}

.paincard{
  flex:0 0 78%;max-width:320px;scroll-snap-align:start;
  background:var(--surf-1);border:.5px solid var(--line-strong);border-radius:var(--r-md);
  padding:26px 24px 22px;display:flex;flex-direction:column;min-height:248px;
  box-shadow:inset 0 1px 0 var(--line-inset);
}
.paincard .ic{width:34px;height:34px;margin-bottom:var(--s5)}
.icn{fill:none;stroke:var(--champagne);stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.paincard h3{
  font-family:var(--serif-cjk);font-weight:500;font-size:21px;line-height:1.45;
  letter-spacing:.02em;color:var(--ivory);margin:0;text-wrap:balance;
}
.paincard p{margin:auto 0 0;padding-top:var(--s4);
  font-family:var(--serif-cjk);font-weight:300;font-size:14px;line-height:1.85;
  color:var(--stone);letter-spacing:.01em;text-wrap:pretty}

/* 行业 · 五职业 */
.trades-h{
  font-family:var(--serif-cjk);font-weight:400;font-size:clamp(17px,5vw,21px);
  color:var(--bone);letter-spacing:.05em;margin:0 0 var(--s5);
  display:flex;align-items:center;gap:13px;
}
.trades-h::after{content:'';flex:1;height:.5px;background:var(--line-strong)}
.trade{
  flex:0 0 70%;max-width:280px;scroll-snap-align:start;
  background:var(--surf-1);border:.5px solid var(--line);border-radius:var(--r-md);
  padding:22px 22px 18px;display:flex;flex-direction:column;min-height:210px;
}
.trade .top{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s4)}
.trade .ic{width:30px;height:30px}
.trade .verdict{font-family:var(--serif-cjk);font-weight:500;font-size:14px;color:var(--champagne);letter-spacing:.06em}
.trade p{margin:0;font-family:var(--serif-cjk);font-weight:300;font-size:13.5px;line-height:1.8;
  color:var(--stone);letter-spacing:.01em;text-wrap:pretty}
.trade p b{color:var(--bone);font-weight:400}
.trade .who{margin-top:auto;padding-top:var(--s4);border-top:.5px solid var(--line);
  font-family:var(--serif-cjk);font-size:12px;color:var(--ash);letter-spacing:.08em}

/* ════════════════════════════════════════════════════════════
   章节过渡 · 怎么帮你（四支柱索引）
   ════════════════════════════════════════════════════════════ */
.turn{text-align:left}
.turn-h{
  font-family:var(--serif-cjk);font-weight:500;
  font-size:clamp(30px,9vw,46px);line-height:1.3;letter-spacing:.02em;color:var(--ivory);
  margin:0 0 var(--s7);text-wrap:balance;
}
.turn-h .em{color:var(--champagne)}
.idx{display:flex;flex-direction:column}
.idx a{
  display:flex;align-items:baseline;gap:16px;padding:18px 0;
  border-top:.5px solid var(--line);transition:padding-left .3s ease;
}
.idx a:last-child{border-bottom:.5px solid var(--line)}
.idx a:active{padding-left:8px}
.idx .rn{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.1em;color:var(--burnished);width:20px;flex-shrink:0}
.idx .nm{font-family:var(--serif-cjk);font-weight:400;font-size:24px;letter-spacing:.1em;color:var(--ivory)}
.idx .dz{flex:1;text-align:right;font-family:var(--serif-cjk);font-weight:300;font-size:13px;color:var(--ash);letter-spacing:.04em}
.idx .ar{color:var(--champagne);font-size:16px}

/* ════════════════════════════════════════════════════════════
   四支柱
   ════════════════════════════════════════════════════════════ */
.pillar-head{display:flex;align-items:center;gap:14px;margin-bottom:var(--s6)}
.pillar-head .pic{width:44px;height:44px;flex-shrink:0;
  border:.5px solid var(--gold-hint);border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--gold-mist)}
.pillar-head .pic svg{width:22px;height:22px}
.pillar-head .lbl{display:flex;flex-direction:column;gap:4px}
.pillar-head .rn{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.2em;color:var(--champagne)}
.pillar-head .nm{font-family:var(--serif-cjk);font-weight:400;font-size:15px;letter-spacing:.3em;color:var(--burnished)}
.pillar-h{
  font-family:var(--serif-cjk);font-weight:500;
  font-size:clamp(28px,8.4vw,42px);line-height:1.32;letter-spacing:.01em;
  color:var(--ivory);margin:0 0 var(--s5);text-wrap:balance;
}
.pillar-pain{
  font-family:var(--serif-cjk);font-style:italic;font-weight:300;
  font-size:15px;line-height:1.9;color:var(--ash);letter-spacing:.02em;
  padding-left:16px;border-left:1px solid var(--crimson-soft);margin:0 0 var(--s5);max-width:40ch;
}
.pillar-body{
  font-family:var(--serif-cjk);font-weight:300;font-size:16px;line-height:2.05;
  color:var(--stone);letter-spacing:.02em;margin:0;max-width:42ch;text-wrap:pretty;
}
.pillar-body b{color:var(--bone);font-weight:400}
.pillar-payoff{
  margin:var(--s6) 0 0;font-family:var(--serif-cjk);font-weight:400;
  font-size:clamp(17px,5vw,20px);line-height:1.65;color:var(--champagne);
  letter-spacing:.03em;text-wrap:balance;
  padding-top:var(--s6);border-top:.5px solid var(--line);
}
.pillar-phone{display:flex;justify-content:center;margin-top:var(--s8)}

/* ════════════════════════════════════════════════════════════
   下载
   ════════════════════════════════════════════════════════════ */
.download{text-align:center}
.dl-h{
  font-family:var(--serif-cjk);font-weight:500;
  font-size:clamp(30px,9vw,50px);line-height:1.28;letter-spacing:.02em;
  color:var(--ivory);margin:0 0 var(--s5);text-wrap:balance;
}
.dl-h .em{color:var(--champagne)}
.dl-sub{font-family:var(--serif-cjk);font-weight:300;font-size:15px;line-height:1.9;
  color:var(--stone);letter-spacing:.03em;margin:0 auto var(--s8);max-width:26ch}
.dl-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:420px;margin:0 auto}
.dl-tile{
  background:var(--surf-1);border:.5px solid var(--line-strong);border-radius:var(--r-md);
  padding:22px 16px;display:flex;flex-direction:column;align-items:center;gap:10px;
  box-shadow:inset 0 1px 0 var(--line-inset);transition:border-color .3s ease,transform .2s ease;
}
.dl-tile:active{transform:scale(.98)}
.dl-tile .ic{width:26px;height:26px}
.dl-tile .ic path,.dl-tile .ic rect,.dl-tile .ic line{fill:none;stroke:var(--bone);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.dl-tile .os{font-family:var(--mono);font-size:12px;letter-spacing:.16em;color:var(--bone)}
.dl-tile .st{font-family:var(--serif-cjk);font-weight:300;font-size:12.5px;color:var(--ash);letter-spacing:.06em}
.dl-qr{grid-column:1 / -1;display:flex;align-items:center;gap:18px;
  background:var(--surf-1);border:.5px solid var(--gold-hint);border-radius:var(--r-md);padding:18px}
.dl-qr .box{width:84px;height:84px;flex-shrink:0;background:var(--ink-2);border:.5px solid var(--gold-hint);border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;color:var(--ash);letter-spacing:.1em}
.dl-qr .txt{text-align:left}
.dl-qr .txt .a{font-family:var(--serif-cjk);font-size:15px;color:var(--ivory);letter-spacing:.04em}
.dl-qr .txt .b{font-family:var(--serif-cjk);font-weight:300;font-size:12.5px;color:var(--stone);margin-top:6px;letter-spacing:.02em}

/* ════════════════════════════════════════════════════════════
   页脚
   ════════════════════════════════════════════════════════════ */
.foot{border-top:.5px solid var(--line);padding-top:var(--s8);padding-bottom:var(--s7)}
.foot .fm{display:flex;align-items:center;gap:13px;margin-bottom:var(--s6)}
.foot .fm .logo{width:36px;height:36px;object-fit:contain;flex-shrink:0}
.foot .fm .lock{display:flex;align-items:baseline;gap:13px}
.foot .fm .lock .en{font-family:var(--serif-latin);font-size:24px;font-weight:500;letter-spacing:.18em;color:var(--ivory);line-height:1}
.foot .fm .lock .cn{font-family:var(--serif-cjk);font-size:17px;font-weight:400;letter-spacing:.14em;color:var(--champagne);line-height:1}
.foot .links{display:flex;gap:24px;margin-bottom:var(--s6);
  font-family:var(--serif-cjk);font-weight:300;font-size:14px;color:var(--stone);letter-spacing:.06em}
.foot .links a:active{color:var(--champagne)}
.foot .legal{font-family:var(--serif-cjk);font-weight:300;font-size:12px;color:var(--ash);line-height:2;letter-spacing:.03em}
.foot .legal .mono{font-family:var(--mono);font-weight:400;font-size:11px}

/* ════════════════════════════════════════════════════════════
   桌面自适应：阅读列居中 + 侧栏装饰 + 进度
   ════════════════════════════════════════════════════════════ */
.railL,.railR{display:none}
@media (min-width:980px){
  :root{--col:520px}
  /* 把内容列当成杂志页，两侧 hairline */
  .page{position:relative;max-width:var(--col);margin:0 auto;
    border-left:.5px solid var(--line);border-right:.5px solid var(--line)}
  .nav{padding-left:max(var(--pad),calc(50vw - var(--col)/2 - 60px));
       padding-right:max(var(--pad),calc(50vw - var(--col)/2 - 60px))}
  /* 左侧竖排品牌 */
  .railL{display:flex;position:fixed;left:0;top:0;bottom:0;width:calc(50vw - var(--col)/2);
    flex-direction:column;align-items:center;justify-content:space-between;
    padding:32px 0;z-index:50;pointer-events:none}
  .railL .vmark{writing-mode:vertical-rl;font-family:var(--serif-cjk);font-size:13px;
    letter-spacing:.5em;color:var(--burnished)}
  .railL .yr{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--ash);writing-mode:vertical-rl}
  /* 右侧章节进度 */
  .railR{display:flex;position:fixed;right:0;top:0;bottom:0;width:calc(50vw - var(--col)/2);
    flex-direction:column;align-items:center;justify-content:center;gap:14px;z-index:50}
  .railR a{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10px;
    letter-spacing:.14em;color:var(--ash);transition:color .3s}
  .railR a .d{width:6px;height:6px;border:.5px solid var(--ash-d);border-radius:50%;transition:all .3s}
  .railR a.on{color:var(--champagne)}
  .railR a.on .d{background:var(--champagne);border-color:var(--champagne)}
  .hero{min-height:96svh}
}
@media (min-width:1280px){:root{--col:560px}}

/* 顶部滚动进度（移动也显示） */
.progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--champagne);z-index:95;
  transition:width .12s linear;opacity:0}
.progress.show{opacity:1}

/* 滚动揭示 */
/* image-slot 空状态适配深色（组件默认是浅底，需重新着色） */
image-slot{background:var(--surf-1);box-shadow:inset 0 0 0 .5px var(--gold-hint);border-radius:var(--r-md)}
image-slot::part(empty){color:var(--stone)}
image-slot::part(frame){background:rgba(245,242,234,0.015)}
.hero-atmo{box-shadow:inset 0 0 0 .5px var(--gold-hint)}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.2,0,0,1),transform .9s cubic-bezier(.2,0,0,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  #intro{display:none}
  .scroll-cue .ln,.cueDrop{animation:none}
}