/* ═══════════ 贴贴 Stickit 路演 v2 · overdrive ═══════════ */
@font-face{
  font-family:'ZCOOL KuaiLe';
  src:url('assets/ZCOOLKuaiLe-Regular.ttf') format('truetype');
  font-display:swap;
}
:root{
  --paper:#FBF8F2; --paper2:#FFFEFA;
  --ink:#2B251E; --ink2:#5A4B33; --ink3:#948366;
  --yellow:#FFD86B; --yellow-soft:#FFF3C9;
  --pink:#F2A0A8; --pink-soft:#FCE3E6;
  --purple:#8B7BE8; --purple-soft:#EFECFF;
  --blue:#6FB1E8;
  --green:#7FB88A; --green-deep:#4E8F5E; --green-soft:#E3F0E6;
  --red:#E5484D; --gold:#F2B84B;
  --kf:'ZCOOL KuaiLe',-apple-system,'PingFang SC','Noto Sans SC',sans-serif;
  --sf:-apple-system,'PingFang SC','Noto Sans SC',sans-serif;
  --card-shadow:0 14px 34px rgba(43,37,30,.13);
  --bounce:cubic-bezier(.34,1.56,.64,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sf);color:var(--ink);background:var(--paper);
  overflow-x:hidden;line-height:1.7;
  background-image:radial-gradient(circle, rgba(90,75,51,.065) 1.1px, transparent 1.4px);
  background-size:26px 26px;
}
::selection{background:var(--yellow);color:var(--ink)}
img,video{max-width:100%;display:block}

/* ── 光斑视差层 ── */
.blobs{position:fixed;inset:0;z-index:-1;pointer-events:none}
.blob{position:absolute;border-radius:50%;will-change:transform}
.blob.b1{width:56vmax;height:56vmax;left:-18vmax;top:-16vmax;background:radial-gradient(closest-side,rgba(255,216,107,.34),transparent 70%)}
.blob.b2{width:48vmax;height:48vmax;right:-16vmax;top:22vh;background:radial-gradient(closest-side,rgba(242,160,168,.26),transparent 70%)}
.blob.b3{width:52vmax;height:52vmax;left:8vmax;top:130vh;background:radial-gradient(closest-side,rgba(139,123,232,.16),transparent 70%)}
.blob.b4{width:46vmax;height:46vmax;right:-10vmax;top:260vh;background:radial-gradient(closest-side,rgba(127,184,138,.22),transparent 70%)}

/* ── 进度胶带 / 导航点 / 键盘提示 ── */
#bar{position:fixed;top:0;left:0;height:7px;width:0;z-index:90;
  background:linear-gradient(90deg,var(--green),var(--yellow),var(--pink),var(--purple));
  opacity:.85;border-radius:0 4px 4px 0;box-shadow:0 1px 4px rgba(43,37,30,.15)}
#dots{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:90;display:flex;flex-direction:column;gap:11px}
#dots a{width:12px;height:12px;border-radius:50%;background:#fff;border:2.5px solid rgba(90,75,51,.35);
  box-shadow:0 2px 6px rgba(43,37,30,.12);transition:.25s;position:relative}
#dots a.on{background:var(--green);border-color:#fff;transform:scale(1.35);box-shadow:0 2px 8px rgba(78,143,94,.5)}
#dots a:hover::after{content:attr(data-t);position:absolute;right:24px;top:50%;transform:translateY(-50%) rotate(-2deg);
  background:#fff;color:var(--ink2);font-size:12px;font-family:var(--kf);padding:3px 10px;border-radius:6px;
  white-space:nowrap;box-shadow:0 4px 12px rgba(43,37,30,.15)}
#kbd{position:fixed;left:22px;bottom:18px;z-index:90;font-size:12px;color:var(--ink3);
  background:rgba(255,254,250,.85);backdrop-filter:blur(6px);padding:6px 12px;border-radius:20px;
  box-shadow:0 3px 10px rgba(43,37,30,.08);transition:opacity .5s}
#kbd.hide{opacity:0;pointer-events:none}
#kbd b{font-family:var(--kf);color:var(--ink2);font-weight:normal}

/* ── 幕通用 ── */
.scene{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:9vh 6vw;position:relative}
.inner{width:min(1160px,100%);position:relative;z-index:2}
.tape-title{display:inline-block;font-family:var(--kf);font-size:clamp(17px,1.6vw,22px);color:var(--ink2);
  background:rgba(255,243,201,.92);padding:9px 26px;transform:rotate(-2deg);position:relative;
  box-shadow:0 4px 12px rgba(43,37,30,.1);margin-bottom:34px;letter-spacing:.06em;
  clip-path:polygon(0% 0%,100% 0%,98.6% 22%,100% 44%,98.7% 68%,100% 100%,0% 100%,1.4% 76%,0% 52%,1.3% 26%)}
.tape-title.g{background:rgba(227,240,230,.95)}
.tape-title.p{background:rgba(252,227,230,.95)}
.tape-title.v{background:rgba(239,236,255,.95)}
.tape-title.b{background:rgba(214,233,248,.95)}
.tape{position:absolute;height:26px;width:96px;opacity:.88;z-index:3;pointer-events:none;
  box-shadow:0 2px 5px rgba(43,37,30,.12);
  clip-path:polygon(0% 0%,100% 0%,97% 24%,100% 50%,97% 76%,100% 100%,0% 100%,3% 74%,0% 50%,3% 26%)}
.tape.ty{background:rgba(255,216,107,.62)}
.tape.tp{background:rgba(242,160,168,.55)}
.tape.tg{background:rgba(127,184,138,.5)}
.tape.tv{background:rgba(139,123,232,.4)}
.tape.tb{background:rgba(111,177,232,.45)}
.hl{background:linear-gradient(transparent 58%,rgba(127,184,138,.5) 58%,rgba(127,184,138,.5) 94%,transparent 94%);padding:0 .08em}
.hl-y{background:linear-gradient(transparent 58%,rgba(255,216,107,.66) 58%,rgba(255,216,107,.66) 94%,transparent 94%);padding:0 .08em}
.hl-p{background:linear-gradient(transparent 58%,rgba(242,160,168,.55) 58%,rgba(242,160,168,.55) 94%,transparent 94%);padding:0 .08em}

/* ── 入场动画 ── */
.rv{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1);transition-delay:var(--d,0s)}
.rv.on{opacity:1;transform:none}
.slap{opacity:0;transform:scale(1.4) rotate(calc(var(--rr,0deg) + 8deg));transition-delay:var(--d,0s)}
.slap.on{opacity:1;transform:scale(1) rotate(var(--rr,0deg));
  transition:transform .6s var(--bounce),opacity .22s ease;transition-delay:var(--d,0s)}
.pop-ch{display:inline-block;opacity:0;transform:translateY(.55em) scale(.7) rotate(-9deg)}
.on .pop-ch{opacity:1;transform:none;transition:transform .55s var(--bounce),opacity .3s ease;
  transition-delay:calc(var(--i)*.085s)}
/* 逐字渐染 */
.ink-ch{color:#CFC5B4;transition:color .5s ease,transform .5s var(--bounce);display:inline-block}
.on .ink-ch{color:inherit;transition-delay:calc(var(--i)*.03s)}
.float{animation:floaty 5.2s ease-in-out infinite;animation-delay:var(--fd,0s)}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(var(--rr,0deg))}50%{transform:translateY(-15px) rotate(calc(var(--rr,0deg) + 3.5deg))}}
.wiggle{animation:wig 3.4s ease-in-out infinite}
@keyframes wig{0%,100%{transform:rotate(-3.5deg)}50%{transform:rotate(3.5deg)}}
.pulse{animation:pul 1.8s ease-in-out infinite}
@keyframes pul{0%,100%{transform:scale(1) rotate(var(--rr,0deg))}50%{transform:scale(1.06) rotate(var(--rr,0deg))}}
.spin-slow{animation:spn 14s linear infinite}
@keyframes spn{to{transform:rotate(360deg)}}

/* ── S0 封面 ── */
#s0{text-align:center;overflow:hidden}
.event-badge{display:inline-flex;align-items:center;gap:8px;font-size:clamp(13px,1.25vw,16px);color:var(--ink2);
  background:#fff;padding:8px 22px;border-radius:30px;box-shadow:0 4px 14px rgba(43,37,30,.1);
  transform:rotate(-1.5deg);position:relative;margin-bottom:5vh;letter-spacing:.04em}
.event-badge .tape{width:58px;height:18px;top:-10px;left:50%;transform:translateX(-50%) rotate(3deg)}
.hero-icon{width:clamp(92px,10vw,132px);margin:0 auto 3.2vh;filter:drop-shadow(0 14px 26px rgba(43,37,30,.2));border-radius:26%}
h1.hero{font-family:var(--kf);font-size:clamp(64px,11vw,150px);line-height:1.12;letter-spacing:.02em;font-weight:normal}
.hero-en{font-family:var(--kf);font-size:clamp(20px,2.4vw,32px);color:var(--ink3);letter-spacing:.34em;margin-top:.4vh;text-indent:.34em}
.hero-slogan{font-size:clamp(19px,2.1vw,27px);color:var(--ink2);margin-top:3.4vh;letter-spacing:.1em}
.hero-sub{font-size:clamp(14px,1.3vw,17px);color:var(--ink3);margin-top:1.6vh}
.nf-badge{position:absolute;font-family:var(--kf);background:var(--green);color:#fff;width:118px;height:118px;border-radius:50%;
  display:flex;flex-direction:column;justify-content:center;align-items:center;line-height:1.35;font-size:17px;
  border:5px solid #fff;box-shadow:0 10px 24px rgba(78,143,94,.4);right:12%;top:24%;z-index:3}
.nf-badge small{font-size:12px;opacity:.92;font-family:var(--sf)}
.scroll-hint{position:absolute;bottom:4.5vh;left:50%;transform:translateX(-50%);color:var(--ink3);font-size:13.5px;
  display:flex;flex-direction:column;align-items:center;gap:7px;letter-spacing:.12em}
.scroll-hint .m{width:24px;height:38px;border:2.5px solid rgba(90,75,51,.4);border-radius:14px;position:relative}
.scroll-hint .m::after{content:'';position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:3px;
  background:var(--green-deep);animation:whee 1.6s ease-in-out infinite}
@keyframes whee{0%{opacity:1;transform:translateY(0)}70%{opacity:0;transform:translateY(13px)}100%{opacity:0}}
/* 鼠标视差贴纸层 */
.stk{position:absolute;z-index:1;filter:drop-shadow(0 10px 18px rgba(43,37,30,.16));user-select:none;pointer-events:none}
.par{will-change:transform}
/* 活贴纸（alpha webm） */
.live{position:absolute;z-index:2;pointer-events:none;filter:drop-shadow(0 12px 20px rgba(43,37,30,.18))}

/* ── S1 心事 ── */
#s1 .inner{max-width:900px;text-align:center}
.moment-line{font-size:clamp(21px,2.5vw,33px);color:var(--ink2);margin:2.1vh 0;letter-spacing:.03em}
.moment-line.big{font-family:var(--kf);font-size:clamp(27px,3.4vw,46px);color:var(--ink);margin-top:4.2vh}
.moment-line .dim{color:var(--ink3)}

/* ── S2 产品宣言 ── */
#s2 .lead{font-size:clamp(19px,2vw,26px);color:var(--ink2);text-align:center;margin-bottom:5.5vh;letter-spacing:.04em}
.stage{display:flex;gap:clamp(24px,3.5vw,52px);align-items:center;justify-content:center;flex-wrap:wrap}
.vid-card{background:#fff;padding:12px 12px 14px;border-radius:22px;box-shadow:var(--card-shadow);
  transform:rotate(-1.6deg);position:relative;width:auto;max-width:min(340px,80vw);flex-shrink:0}
.vid-card img.scr{max-height:56vh;width:auto;max-width:100%;margin:0 auto;border-radius:14px;display:block;cursor:zoom-in}
.vid-card .cap{font-family:var(--kf);text-align:center;color:var(--ink3);font-size:14.5px;padding-top:9px}
.vid-card .tape{top:-13px;left:50%;transform:translateX(-50%) rotate(2deg)}
.feat-col{display:flex;flex-direction:column;gap:20px;width:min(420px,90vw)}
.feat{background:var(--paper2);border-radius:16px;padding:19px 22px;box-shadow:0 8px 22px rgba(43,37,30,.09);
  display:flex;gap:15px;align-items:flex-start;position:relative;transition:transform .3s var(--bounce)}
.feat:hover{transform:translateY(-4px) rotate(-.6deg)}
.feat .ico{font-size:27px;line-height:1.25;filter:drop-shadow(0 3px 5px rgba(43,37,30,.12))}
.feat h3{font-family:var(--kf);font-size:19.5px;font-weight:normal;margin-bottom:3px;letter-spacing:.04em}
.feat p{font-size:14.5px;color:var(--ink2);line-height:1.65}
.feat.soul{outline:2.5px dashed var(--green);outline-offset:-2.5px;background:linear-gradient(135deg,var(--paper2),var(--green-soft))}
.feat.soul .soul-tag{position:absolute;top:-12px;right:14px;font-family:var(--kf);font-size:12.5px;color:#fff;
  background:var(--green-deep);padding:3px 12px;border-radius:20px;transform:rotate(2deg);box-shadow:0 3px 8px rgba(78,143,94,.35)}
.tech-note{text-align:center;color:var(--ink3);font-size:13.5px;margin-top:4.5vh;letter-spacing:.12em}

/* ── 手机框组件 ── */
.phone{position:relative;border-radius:clamp(30px,3.2vw,44px);background:#17130e;
  border:clamp(7px,0.8vw,10px) solid #17130e;box-shadow:0 24px 60px rgba(43,37,30,.32), inset 0 0 0 2px #3a332a;flex-shrink:0}
.phone::before{content:'';position:absolute;top:9px;left:50%;transform:translateX(-50%);width:26%;height:15px;
  background:#17130e;border-radius:10px;z-index:4}
.phone img{border-radius:clamp(22px,2.4vw,34px);width:100%}
.phone .lbl{position:absolute;bottom:-38px;left:50%;transform:translateX(-50%);font-family:var(--kf);
  color:var(--ink2);font-size:14.5px;white-space:nowrap;letter-spacing:.06em}

/* ── S3 · 3D 手机展廊 ── */
#s3 .head,#s4h .head,#s5 .head,#s6 .head,#s7 .head,#s8 .head,#s9 .head,#s10 .head{text-align:center;margin-bottom:5vh}
.head .sub{color:var(--ink3);font-size:clamp(14px,1.4vw,17px);margin-top:1.2vh;letter-spacing:.06em}
.gal-wrap{display:flex;flex-direction:column;align-items:center;gap:5vh}
.gal3d{perspective:1500px;width:min(860px,94vw);height:clamp(420px,56vh,600px);position:relative}
.gal3d .ring{position:absolute;inset:0;transform-style:preserve-3d}
.gal3d .ph3{position:absolute;left:50%;top:0;height:100%;aspect-ratio:1206/2622;
  transform-style:preserve-3d;cursor:pointer;
  transition:transform .85s cubic-bezier(.22,1,.36,1),filter .5s ease,opacity .5s ease}
.gal3d .phone{width:100%;height:100%;overflow:hidden}
.gal3d .phone img{height:100%;object-fit:cover;object-position:top}
/* 地面阴影 */
.gal3d .ph3::after{content:'';position:absolute;left:4%;right:4%;bottom:-7%;height:5%;
  background:radial-gradient(ellipse at center,rgba(43,37,30,.3),transparent 70%);filter:blur(7px)}
.gal-nav{display:flex;align-items:center;gap:26px}
.gal-btn{width:52px;height:52px;border-radius:50%;background:#fff;border:none;box-shadow:0 8px 20px rgba(43,37,30,.16);
  font-size:22px;color:var(--ink2);cursor:pointer;transition:transform .25s var(--bounce);font-family:var(--sf)}
.gal-btn:hover{transform:scale(1.14)}
.gal-btn:active{transform:scale(.94)}
.gal-cap{font-family:var(--kf);font-size:clamp(17px,1.8vw,23px);color:var(--ink);min-width:min(400px,70vw);text-align:center;position:relative;height:2.1em}
.gal-cap span{position:absolute;inset:0;opacity:0;transform:translateY(12px);transition:.45s ease}
.gal-cap span.on{opacity:1;transform:none}
.gal-cap small{display:block;font-family:var(--sf);color:var(--ink3);font-size:.62em;margin-top:2px;letter-spacing:.05em}
.gal-dots{display:flex;gap:9px;justify-content:center}
.gal-dots i{width:9px;height:9px;border-radius:50%;background:rgba(90,75,51,.25);transition:.3s;cursor:pointer}
.gal-dots i.on{background:var(--green-deep);transform:scale(1.3)}

/* ── S4 · 魔法旅程（sticky 步进） ── */
#s4j{height:380vh;position:relative;display:block;padding:0}
#s4j .pinstage{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
  justify-content:center;align-items:center;overflow:hidden;padding:3vh 4vw 7vh}
.j-head{text-align:center;margin-bottom:2.4vh}
.j-head .tape-title{margin-bottom:8px}
.j-screens{display:flex;gap:clamp(14px,2vw,30px);align-items:center;justify-content:center}
.j-step{position:relative;transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .5s,filter .5s;
  opacity:.42;filter:saturate(.55) brightness(.96);transform:scale(.88)}
.j-step.on{opacity:1;filter:none;transform:scale(1.04)}
.j-step.done{opacity:.8;filter:none;transform:scale(.94)}
.j-step .phone{width:min(clamp(140px,15vw,225px),26vh)}
.j-step .num{position:absolute;top:-17px;left:50%;transform:translateX(-50%);z-index:6;
  font-family:var(--kf);width:34px;height:34px;border-radius:50%;background:#fff;color:var(--ink3);
  display:flex;align-items:center;justify-content:center;font-size:16.5px;box-shadow:0 5px 14px rgba(43,37,30,.18);
  border:2.5px solid rgba(148,131,102,.25);transition:.4s}
.j-step.on .num{background:var(--green-deep);color:#fff;border-color:#fff;transform:translateX(-50%) scale(1.18)}
.j-arrow{font-size:clamp(18px,2vw,26px);color:rgba(148,131,102,.5);transition:.4s;flex-shrink:0}
.j-arrow.on{color:var(--green-deep);transform:scale(1.3)}
.j-caption{margin-top:2.8vh;text-align:center;position:relative;height:5em;width:min(780px,92vw)}
.j-caption .jc{position:absolute;inset:0;opacity:0;transform:translateY(14px);transition:.5s ease}
.j-caption .jc.on{opacity:1;transform:none}
.j-caption .jc h3{font-family:var(--kf);font-size:clamp(21px,2.4vw,30px);font-weight:normal;letter-spacing:.05em}
.j-caption .jc p{color:var(--ink2);font-size:clamp(14px,1.45vw,17.5px);margin-top:8px;line-height:1.75}
.j-caption .jc p em{font-style:normal;color:var(--green-deep);font-weight:600}
/* 打字机气泡 */
.typer{position:absolute;z-index:7;left:50%;bottom:-8px;transform:translateX(-50%) rotate(-1.5deg);
  background:#fff;border-radius:13px;box-shadow:0 10px 26px rgba(43,37,30,.2);padding:9px 14px;
  font-size:12.5px;color:var(--ink);white-space:nowrap;opacity:0;transition:.4s}
.typer.show{opacity:1}
.typer::before{content:'💬 ';opacity:.7}
.typer .cursor{display:inline-block;width:2px;height:1em;background:var(--green-deep);vertical-align:-2px;
  animation:blink 0.9s steps(1) infinite;margin-left:1px}
@keyframes blink{50%{opacity:0}}
/* 60 秒标注 */
.j-time{position:absolute;top:-14px;right:-20px;z-index:7;font-family:var(--kf);
  background:var(--gold);color:#fff;padding:5px 13px;border-radius:20px;font-size:13.5px;
  transform:rotate(6deg) scale(0);box-shadow:0 6px 16px rgba(242,184,75,.45);transition:transform .5s var(--bounce)}
.j-time.show{transform:rotate(6deg) scale(1)}
.j-progress{position:absolute;left:50%;transform:translateX(-50%);bottom:2.6vh;width:min(320px,60vw);height:5px;
  background:rgba(148,131,102,.18);border-radius:4px;overflow:hidden}
.j-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--yellow));border-radius:4px}

/* ── S5 · 回忆 ── */
#s5 .duo-wrap{display:flex;gap:clamp(30px,4.5vw,70px);align-items:center;justify-content:center;flex-wrap:wrap}
#s5 .phone{width:clamp(230px,23vw,300px)}
.echo-txt{max-width:460px}
.echo-txt h3{font-family:var(--kf);font-size:clamp(24px,2.8vw,36px);font-weight:normal;line-height:1.5;letter-spacing:.04em}
.echo-txt p{color:var(--ink2);font-size:clamp(15px,1.5vw,18px);margin-top:2.4vh;line-height:1.9}
.echo-txt .whisper{margin-top:3.4vh;background:#fff;border-radius:16px;padding:16px 20px;box-shadow:var(--card-shadow);
  position:relative;transform:rotate(-1.2deg);font-size:clamp(14px,1.35vw,16.5px);color:var(--ink2)}
.echo-txt .whisper::before{content:'🔔';position:absolute;top:-14px;left:16px;font-size:22px;
  filter:drop-shadow(0 3px 5px rgba(43,37,30,.2))}
.echo-txt .whisper b{color:var(--ink)}

/* ── S6 · 金子的贴贴 tilt ── */
.tilt-wrap{display:flex;gap:clamp(30px,4vw,64px);align-items:center;justify-content:center;flex-wrap:wrap}
.tilt-card{position:relative;width:min(330px,74vw);border-radius:26px;transform-style:preserve-3d;
  transition:transform .18s ease-out;will-change:transform}
.tilt-card .ph-img{border-radius:26px;box-shadow:0 30px 70px rgba(43,37,30,.35);width:100%;display:block}
.tilt-card .glare{position:absolute;inset:0;border-radius:26px;pointer-events:none;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.38),transparent 46%);
  mix-blend-mode:soft-light}
.tilt-card .tilt-stk{position:absolute;filter:drop-shadow(0 8px 16px rgba(43,37,30,.25));pointer-events:none}
.tilt-side{max-width:440px}
.tilt-side h3{font-family:var(--kf);font-size:clamp(23px,2.7vw,34px);font-weight:normal;letter-spacing:.04em;line-height:1.5}
.tilt-side p{color:var(--ink2);font-size:clamp(14.5px,1.45vw,17.5px);margin-top:2vh;line-height:1.85}
.tilt-side p em{font-style:normal;color:var(--green-deep);font-weight:600}
/* 成员贴贴墙（预留） */
.wall{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,18px);margin-top:5vh;width:min(920px,100%);margin-left:auto;margin-right:auto}
.wall .slot{aspect-ratio:9/16;border-radius:18px;border:2.5px dashed rgba(148,131,102,.4);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--ink3);
  font-family:var(--kf);font-size:clamp(13px,1.3vw,16px);background:rgba(255,254,250,.55);
  transition:.35s var(--bounce);position:relative;overflow:hidden}
.wall .slot:hover{transform:translateY(-5px) rotate(-1deg);border-color:var(--green);color:var(--green-deep)}
.wall .slot .plus{width:38px;height:38px;border-radius:50%;background:rgba(127,184,138,.16);
  display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--green-deep)}
.wall .slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wall .slot .who{position:relative;z-index:2}
.wall .slot.filled{border-style:solid;border-color:#fff;box-shadow:var(--card-shadow)}
.wall .slot.filled .who{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:rgba(255,254,250,.92);
  padding:2px 12px;border-radius:14px;font-size:12.5px;color:var(--ink2);box-shadow:0 3px 8px rgba(43,37,30,.15)}
.wall-note{text-align:center;color:var(--ink3);font-size:13px;margin-top:2vh;letter-spacing:.08em}

/* ── S7 · AI 技术力 ── */
.arch{width:min(1060px,100%);margin:0 auto;position:relative}
.arch svg{width:100%;height:auto;display:block;overflow:visible}
.arch .link-path{stroke:rgba(148,131,102,.35);stroke-width:2.5;fill:none;stroke-dasharray:7 7;animation:dashmove 1.1s linear infinite}
@keyframes dashmove{to{stroke-dashoffset:-14}}
.arch .packet{position:absolute;width:13px;height:13px;border-radius:50%;pointer-events:none;
  box-shadow:0 0 10px 2px currentColor;opacity:.9}
.arch-node{position:absolute;background:#fff;border-radius:18px;box-shadow:var(--card-shadow);padding:14px 18px;
  text-align:center;transition:transform .3s var(--bounce)}
.arch-node:hover{transform:translateY(-6px) scale(1.03)}
.arch-node h4{font-family:var(--kf);font-size:clamp(14px,1.5vw,19px);font-weight:normal;letter-spacing:.04em}
.arch-node p{font-size:clamp(10.5px,1vw,12.5px);color:var(--ink3);line-height:1.6;margin-top:3px}
.arch-node .em{color:var(--green-deep)}
.tech-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px);margin-top:5vh;width:min(1060px,100%);margin-left:auto;margin-right:auto}
.tcard{background:#fff;border-radius:18px;padding:clamp(16px,1.9vw,24px);box-shadow:0 10px 26px rgba(43,37,30,.1);
  position:relative;transform:rotate(var(--tr,0deg));transition:transform .3s var(--bounce)}
.tcard:hover{transform:rotate(0) translateY(-5px)}
.tcard .tape{width:62px;height:19px;top:-9px;left:50%;transform:translateX(-50%) rotate(-2deg)}
.tcard h4{font-family:var(--kf);font-size:clamp(15.5px,1.6vw,20px);font-weight:normal;letter-spacing:.03em;display:flex;align-items:center;gap:8px}
.tcard p{font-size:clamp(12.5px,1.2vw,14.5px);color:var(--ink2);line-height:1.75;margin-top:8px}
.tcard p b{color:var(--ink)}
.manifesto{text-align:center;margin-top:5.5vh;font-family:var(--kf);font-size:clamp(19px,2.2vw,28px);
  color:var(--ink);letter-spacing:.06em;line-height:1.8}
.manifesto .hl{white-space:nowrap}

/* ── S8 · 24h 时间轴（压缩版） ── */
#s8{padding-bottom:4vh}
.tl{position:relative;width:min(1020px,100%);margin:0 auto}
.tl::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:0;
  border-left:3px dashed rgba(148,131,102,.4);transform:translateX(-50%)}
.node{display:flex;align-items:center;gap:clamp(18px,2.4vw,38px);margin-bottom:6.5vh;position:relative}
.node.rev{flex-direction:row-reverse}
.node .half{width:50%;display:flex;justify-content:flex-end}
.node.rev .half{justify-content:flex-start}
.node .half.txt{justify-content:flex-start;padding-left:clamp(8px,2vw,26px)}
.node.rev .half.txt{justify-content:flex-end;text-align:right;padding-left:0;padding-right:clamp(8px,2vw,26px)}
.node .pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:19px;height:19px;border-radius:50%;
  background:var(--yellow);border:4px solid #fff;box-shadow:0 3px 10px rgba(43,37,30,.22);z-index:4}
.node.p-pink .pin{background:var(--pink)}
.node.p-green .pin{background:var(--green)}
.pol{background:#fff;padding:10px 10px 12px;border-radius:8px;box-shadow:var(--card-shadow);position:relative;
  transform:rotate(var(--pr,-2deg));transition:transform .35s var(--bounce);max-width:min(360px,42vw)}
.pol:hover{transform:rotate(0deg) translateY(-7px) scale(1.03);z-index:5}
.pol img{border-radius:5px;cursor:zoom-in;max-height:250px;object-fit:contain;background:#faf8f4}
.pol .cap{font-family:var(--kf);font-size:13px;color:var(--ink3);text-align:center;padding-top:8px;letter-spacing:.05em}
.pol .tape{top:-12px;left:50%;transform:translateX(-50%) rotate(-2deg)}
.pol.duo{display:flex;gap:8px}
.pol.duo img{max-height:210px;width:calc(50% - 4px);object-fit:cover}
.pol.duo .tall{object-fit:contain}
.ninfo{max-width:min(380px,42vw)}
.ninfo .when{display:inline-block;font-family:var(--kf);font-size:13px;color:var(--ink2);
  background:rgba(255,216,107,.5);padding:2px 12px;border-radius:16px;margin-bottom:9px;letter-spacing:.08em}
.ninfo h3{font-family:var(--kf);font-size:clamp(19px,2vw,25px);font-weight:normal;line-height:1.4;margin-bottom:7px;letter-spacing:.03em}
.ninfo p{font-size:clamp(13px,1.25vw,15px);color:var(--ink2);line-height:1.7}
.ninfo p em{font-style:normal;color:var(--green-deep);font-weight:600}
.tl-stk{position:absolute;width:66px;z-index:1;opacity:.95;filter:drop-shadow(0 8px 14px rgba(43,37,30,.14))}
/* 全场唯一 · 高光大节点 */
.only-one{position:relative;width:100%;margin:2vh 0 8vh;display:flex;justify-content:center}
.only-card{position:relative;background:linear-gradient(135deg,#FFF7E0,#FFEDBE 55%,#FFE29A);border-radius:24px;
  padding:clamp(24px,3.2vw,42px) clamp(26px,4vw,58px);box-shadow:0 18px 50px rgba(242,184,75,.4);
  text-align:center;max-width:820px;overflow:visible;border:3px solid #fff}
.only-card::before{content:'';position:absolute;inset:-3px;border-radius:24px;padding:3px;
  background:conic-gradient(from var(--ga,0deg),#F2B84B,#FFD86B,#fff,#F2B84B);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:goldspin 3.5s linear infinite}
@property --ga{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes goldspin{to{--ga:360deg}}
.only-card .crown{position:absolute;top:-52px;left:50%;transform:translateX(-50%) rotate(-6deg);width:92px;
  filter:drop-shadow(0 10px 18px rgba(43,37,30,.22));animation:crownbob 3s ease-in-out infinite}
@keyframes crownbob{0%,100%{transform:translateX(-50%) rotate(-7deg) translateY(0)}50%{transform:translateX(-50%) rotate(-3deg) translateY(-7px)}}
.only-card h3{font-family:var(--kf);font-size:clamp(24px,3.1vw,40px);font-weight:normal;letter-spacing:.05em;line-height:1.5;color:#7A5310}
.only-card h3 .big{font-size:1.25em;color:#A65E00}
.only-card p{color:#8A6A2E;font-size:clamp(14px,1.45vw,17.5px);margin-top:10px;line-height:1.85}
.only-card p b{color:#7A5310}

/* ── S9 · 数据 ── */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.9vw,24px);width:min(1080px,100%);margin:0 auto}
.stat{background:#fff;border-radius:18px;padding:clamp(18px,2.2vw,30px) 12px;text-align:center;position:relative;
  box-shadow:0 10px 26px rgba(43,37,30,.1);transform:rotate(var(--sr,0deg));transition:transform .3s var(--bounce)}
.stat:hover{transform:rotate(0) translateY(-5px)}
.stat .tape{width:60px;height:19px;top:-9px;left:50%;transform:translateX(-50%) rotate(-2deg)}
.stat .num{font-family:var(--kf);font-size:clamp(32px,4vw,54px);line-height:1.15;color:var(--c,var(--ink))}
.stat .num small{font-size:.42em;color:var(--ink3);margin-left:2px}
.stat .lbl{font-size:clamp(12px,1.1vw,14.5px);color:var(--ink2);margin-top:5px;letter-spacing:.05em}
.stat.wide{grid-column:span 2;background:linear-gradient(135deg,#FFF7E0,#FFEDBE);}
.stat.wide .num{color:#A65E00}
.stat.wide .crown-s{position:absolute;top:-30px;right:14px;width:58px;transform:rotate(10deg);
  filter:drop-shadow(0 6px 12px rgba(43,37,30,.2))}
.stack-note{text-align:center;color:var(--ink3);font-size:13.5px;margin-top:5vh;letter-spacing:.1em}

/* ── S10 · 团队 ── */
.crew{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(13px,1.7vw,22px);width:min(1120px,100%);margin:0 auto}
.mate{background:#fff;border-radius:18px;padding:clamp(16px,1.9vw,26px) 10px 20px;text-align:center;position:relative;
  box-shadow:0 10px 26px rgba(43,37,30,.11);transform:rotate(var(--mr,0deg));transition:transform .35s var(--bounce)}
.mate:hover{transform:rotate(0) translateY(-7px) scale(1.03);z-index:3}
.mate .tape{width:58px;height:18px;top:-9px;left:50%;transform:translateX(-50%) rotate(-3deg)}
.mate img{height:clamp(58px,6vw,84px);width:auto;max-width:88%;object-fit:contain;margin:0 auto 10px;filter:drop-shadow(0 6px 12px rgba(43,37,30,.14))}
.mate h3{font-family:var(--kf);font-size:clamp(17px,1.75vw,23px);font-weight:normal;letter-spacing:.03em}
.mate .role{display:inline-block;font-size:11.5px;color:#fff;background:var(--rc,var(--green));padding:2px 11px;
  border-radius:14px;margin:7px 0 9px;letter-spacing:.05em}
.mate p{font-size:clamp(11.5px,1.05vw,13.5px);color:var(--ink2);line-height:1.6;padding:0 6px}
.silicon{display:flex;justify-content:center;gap:clamp(12px,1.8vw,24px);margin-top:5.5vh;flex-wrap:wrap}
.si{display:flex;align-items:center;gap:9px;background:rgba(255,254,250,.9);border:1.8px dashed rgba(148,131,102,.45);
  padding:9px 18px;border-radius:30px;font-size:13.5px;color:var(--ink2);transform:rotate(var(--sr,0deg))}
.si b{font-family:var(--kf);font-weight:normal;color:var(--ink)}
.si-cap{text-align:center;color:var(--ink3);font-size:13px;margin-top:2.2vh;letter-spacing:.08em}

/* ── S11 · CTA ── */
#s11{text-align:center;overflow:hidden}
#s11 h2.big{font-family:var(--kf);font-size:clamp(38px,5.6vw,74px);font-weight:normal;line-height:1.3;letter-spacing:.04em}
.cta-wrap{display:flex;gap:clamp(28px,4vw,60px);justify-content:center;align-items:center;margin-top:6vh;flex-wrap:wrap}
.qr-card{background:#fff;padding:22px 22px 16px;border-radius:14px;box-shadow:var(--card-shadow);position:relative;
  transform:rotate(-2.4deg)}
.qr-card img{width:clamp(170px,17vw,225px);image-rendering:pixelated}
.qr-card .cap{font-family:var(--kf);color:var(--ink2);font-size:16.5px;padding-top:10px;letter-spacing:.1em}
.qr-card .tape{top:-13px;left:50%;transform:translateX(-50%) rotate(2deg)}
.cta-txt{text-align:left;max-width:420px}
.hungry{display:inline-block;font-family:var(--kf);background:var(--red);color:#fff;font-size:clamp(16px,1.7vw,21px);
  padding:11px 24px;border-radius:14px;transform:rotate(-2deg);box-shadow:0 9px 22px rgba(229,72,77,.35);
  letter-spacing:.06em;line-height:1.5;--rr:-2deg}
.hungry small{display:block;font-size:.68em;opacity:.94;font-family:var(--sf);letter-spacing:.1em}
.cta-lines{margin-top:3.2vh;font-size:clamp(15px,1.5vw,18.5px);color:var(--ink2);line-height:2.05}
.cta-lines b{color:var(--ink)}
.cta-lines a{color:var(--green-deep);font-weight:800;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.final-slogan{font-family:var(--kf);font-size:clamp(23px,2.8vw,36px);color:var(--ink);margin-top:7vh;letter-spacing:.12em}
.final-from{color:var(--ink3);font-size:clamp(13px,1.25vw,15.5px);margin-top:1.8vh;letter-spacing:.08em}
.final-heart{color:var(--green-deep)}

/* ── Lightbox / 彩纸 ── */
#lb{position:fixed;inset:0;background:rgba(43,37,30,.88);z-index:200;display:none;align-items:center;justify-content:center;cursor:zoom-out;backdrop-filter:blur(4px)}
#lb.show{display:flex}
#lb img{max-width:90vw;max-height:90vh;border-radius:10px;border:8px solid #fff;box-shadow:0 30px 80px rgba(0,0,0,.45);object-fit:contain}
#lb .tip{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.75);font-size:13px;letter-spacing:.1em}
#confetti{position:fixed;inset:0;pointer-events:none;z-index:150}

/* ── 响应式 ── */
@media (max-width:900px){
  .tl::before{left:22px}
  .node,.node.rev{flex-direction:column;align-items:flex-start;padding-left:48px}
  .node .half,.node.rev .half{width:100%;justify-content:flex-start;text-align:left;padding:0}
  .node .pin{left:22px}
  .pol,.ninfo{max-width:100%}
  .crew{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .wall{grid-template-columns:repeat(2,1fr)}
  .tech-cards{grid-template-columns:1fr}
  .j-screens{flex-wrap:wrap}
  .j-step .phone{width:clamp(110px,20vw,150px)}
  .nf-badge{right:4%;top:14%;width:96px;height:96px;font-size:14px}
  #dots,#kbd{display:none}
  .cta-txt{text-align:center}
  #s4j{height:auto}
  #s4j .pinstage{position:static;height:auto}
}
@media (prefers-reduced-motion:reduce){
  .rv,.slap,.pop-ch,.ink-ch{opacity:1!important;transform:none!important;transition:none!important;color:inherit!important}
  .float,.wiggle,.pulse,.spin-slow,.only-card::before,.only-card .crown{animation:none!important}
  .live{display:none}
  html{scroll-behavior:auto}
}