/* Laugh Loop · 沉浸式竖屏短视频 */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{
  color-scheme:dark;
  --red:#fe2c55;--cyan:#25f4ee;--ink:#fff;--ink-2:rgba(255,255,255,.82);--ink-3:rgba(255,255,255,.6);
  --glass:rgba(22,24,35,.42);--glass-strong:rgba(22,24,35,.72);
  --ease:cubic-bezier(.2,.8,.2,1);
  font:16px/1.4 -apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background:#000;color:var(--ink);-webkit-font-smoothing:antialiased;
}
html,body{height:100%;overflow:hidden}
body{margin:0;display:grid;place-items:center;background:#000;overscroll-behavior:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}
[hidden]{display:none!important}

/* 桌面端背景：当前视频封面的大面积虚化 */
.backdrop{position:fixed;inset:-60px;z-index:0;background:#000 var(--poster,none) center/cover no-repeat;filter:blur(60px) saturate(1.4) brightness(.42);transform:scale(1.1);transition:background-image .6s var(--ease)}
.backdrop::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.65))}

main{position:relative;z-index:1;width:100%;height:100vh;height:100dvh;background:#000;overflow:hidden}
@media (min-width:600px){
  main{width:min(calc((100dvh - 40px) * 9 / 16),480px);height:calc(100dvh - 40px);border-radius:22px;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 30px 80px rgba(0,0,0,.6)}
}

/* ---------- 顶部 ---------- */
main>header{position:absolute;z-index:6;top:0;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;
  padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));pointer-events:none}
main>header>*{pointer-events:auto}
.brand{display:flex;align-items:center;gap:6px;justify-self:center;font-weight:700;font-size:17px;letter-spacing:-.2px;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.brand-mark{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;font-size:15px;color:#fff;
  background:linear-gradient(135deg,var(--cyan) -20%,#7b61ff 45%,var(--red) 110%);box-shadow:-1.5px 0 0 var(--cyan),1.5px 0 0 var(--red)}
.brand b{position:relative}
.brand b::after{content:"";position:absolute;left:50%;bottom:-7px;width:18px;height:2.5px;border-radius:2px;background:#fff;transform:translateX(-50%)}
.glass-pill,#sound{justify-self:start;display:inline-flex;align-items:center;gap:6px;height:32px;max-width:100%;padding:0 12px 0 10px;border-radius:16px;
  background:var(--glass);backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.14);transition:transform .2s var(--ease),background .2s}
#sound:active{transform:scale(.94)}
#sound svg{width:17px;height:17px;flex:none}
#sound.muted{background:rgba(254,44,85,.85)}
.top-shade{position:absolute;inset:0 0 auto;height:120px;pointer-events:none;background:linear-gradient(rgba(0,0,0,.45),transparent);z-index:2}

/* ---------- 舞台 ---------- */
#stage{position:absolute;inset:0;overflow:hidden;isolation:isolate;touch-action:none;background:#000}
#slide,.neighbor{position:absolute;inset:0;background:#000}
.neighbor{pointer-events:none;overflow:hidden}
#stage:not(.dragging):not(.returning) .preview-slide{visibility:hidden}
.ambient{position:absolute;inset:-40px;background:var(--poster,none) center/cover no-repeat;filter:blur(36px) brightness(.55) saturate(1.3);transform:scale(1.15)}
video,#surface{position:absolute;inset:0;width:100%;height:100%}
video{object-fit:contain;background:transparent}
#stage.fill video,#stage.fill .slide-cover img{object-fit:cover}
#film{font-size:clamp(14px,2.2vh,18px)}
video::cue{font-family:inherit;font-size:clamp(14px,2.2vh,18px);background:rgba(0,0,0,.55);color:#fff;white-space:pre-line}
#surface{background:transparent;z-index:1}
.slide-cover{position:absolute;inset:0;pointer-events:none;background:transparent center/contain no-repeat}
.slide-cover img,.neighbor img,.neighbor canvas{display:block;width:100%;height:100%;object-fit:contain}
.neighbor .ambient{z-index:0}
.neighbor>img,.neighbor>canvas,.neighbor>.slide-cover{position:absolute;inset:0;z-index:1}

#paused{position:absolute;z-index:3;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;pointer-events:none;color:rgba(255,255,255,.88);
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.35));animation:pause-in .28s var(--ease)}
#paused svg{width:100%;height:100%}
@keyframes pause-in{from{opacity:0;transform:scale(1.4)}}
#notice{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);max-width:80%;padding:12px 18px;border-radius:14px;text-align:center;font-size:14px;
  pointer-events:none;background:var(--glass-strong);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
#notice:empty{display:none}

/* ---------- 进度条（可拖动） ---------- */
.progress{position:absolute;z-index:5;left:0;right:0;bottom:0;height:16px;padding-top:13px;cursor:pointer;touch-action:none}
.progress::before{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.18);transition:height .2s var(--ease)}
.progress i{position:absolute;left:0;bottom:0;height:2px;width:0;background:rgba(255,255,255,.9);transition:height .2s var(--ease)}
.progress:hover::before,.progress:hover i,.progress.seeking::before,.progress.seeking i{height:5px}
.progress.seeking i::after,.progress:hover i::after{content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.2)}

/* ---------- 底部文案 ---------- */
.caption-shade{position:absolute;z-index:2;inset:auto 0 0;height:min(300px,48%);pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.35) 40%,rgba(0,0,0,.72))}
.caption{position:absolute;z-index:4;left:max(14px,env(safe-area-inset-left));right:calc(76px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));
  pointer-events:none;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.series-name{display:block;font-size:17px;font-weight:700;letter-spacing:-.1px}
.series-name::before{content:"@"}
.caption h1{margin:6px 0 2px;font-size:15px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}
.description{margin:2px 0 0;font-size:14px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.caption.expanded .description{display:block;overflow:auto;max-height:30dvh;pointer-events:auto}
.caption-more{pointer-events:auto;margin-top:2px;font-size:14px;font-weight:700;color:#fff;text-shadow:inherit}
.audio-credit{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:13.5px;max-width:70%}
.audio-credit .note{flex:none;animation:note-bob 2.4s ease-in-out infinite}
.marquee{position:relative;overflow:hidden;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 88%,transparent)}
.audio-text{display:inline-block;padding:0 6px;animation:marquee 9s linear infinite}
@keyframes marquee{0%,12%{transform:translateX(0)}100%{transform:translateX(-60%)}}
@keyframes note-bob{50%{transform:translateY(-2px)}}
#stage.is-paused .audio-text,#stage.is-paused .audio-credit .note{animation-play-state:paused}

/* ---------- 右侧操作栏 ---------- */
.side{position:absolute;z-index:4;right:max(6px,env(safe-area-inset-right));bottom:calc(26px + env(safe-area-inset-bottom));width:60px;display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2.2vh,20px)}
.avatar{position:relative;width:48px;height:48px;margin-bottom:6px;border-radius:50%;display:grid;place-items:center;font-size:24px;
  background:var(--avatar,linear-gradient(135deg,#ffb86b,#fe2c55));border:2px solid #fff;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.sb-btn{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:52px;color:#fff;transition:transform .18s var(--ease)}
.sb-btn:active{transform:scale(.88)}
.sb-ic{width:40px;height:40px;display:grid;place-items:center;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3))}
.sb-ic svg{width:36px;height:36px}
.sb-num{font-size:12.5px;font-weight:600;line-height:1.1;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.sb-btn[aria-pressed=true] .sb-ic{color:var(--red)}
.sb-btn[aria-pressed=true] svg{animation:like-pop .5s var(--ease)}
@keyframes like-pop{0%{transform:scale(.5)}55%{transform:scale(1.25)}100%{transform:scale(1)}}
.audio-disc{position:relative;width:46px;height:46px;margin-top:6px;border-radius:50%;
  background:conic-gradient(from 0deg,#222 0 25%,#3a3a3a 25% 50%,#222 50% 75%,#3a3a3a 75%);box-shadow:0 0 0 7px rgba(30,30,30,.85),0 4px 14px rgba(0,0,0,.4);animation:spin 6s linear infinite}
.audio-disc i{position:absolute;inset:12px;border-radius:50%;background:var(--avatar,linear-gradient(135deg,#ffb86b,#fe2c55));border:2px solid #111}
#stage.is-paused .audio-disc{animation-play-state:paused}
@keyframes spin{to{transform:rotate(360deg)}}

.burst-heart{position:absolute;z-index:6;width:110px;height:110px;pointer-events:none;color:var(--red);
  filter:drop-shadow(0 6px 18px rgba(254,44,85,.45));animation:burst-heart 1s var(--ease) forwards}
@keyframes burst-heart{0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(var(--tilt,0deg))}18%{opacity:1;transform:translate(-50%,-50%) scale(1.15) rotate(var(--tilt,0deg))}32%{transform:translate(-50%,-50%) scale(.95) rotate(var(--tilt,0deg))}100%{opacity:0;transform:translate(-50%,-130%) scale(1.5) rotate(var(--tilt,0deg))}}

/* ---------- 新手引导 ---------- */
#swipeHint{position:absolute;z-index:5;left:50%;top:46%;transform:translate(-50%,-50%);width:max-content;max-width:78%;padding:22px 26px;border-radius:22px;text-align:center;pointer-events:none;
  background:var(--glass-strong);backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.12)}
#swipeHint:not([hidden]){display:grid;justify-items:center;gap:6px;animation:pause-in .4s var(--ease)}
#swipeHint svg{width:42px;height:42px;margin-bottom:4px}
#swipeHint strong{font-size:17px}
#swipeHintDetail{font-size:13px;color:var(--ink-3)}
@media (prefers-reduced-motion:no-preference){#swipeHint:not([hidden]) svg{animation:swipe-demo 1.3s var(--ease) infinite}}
@keyframes swipe-demo{0%{transform:translateY(10px);opacity:.3}50%{opacity:1}100%{transform:translateY(-14px);opacity:0}}
.subtitle-measure{position:absolute;visibility:hidden;pointer-events:none;white-space:pre-line;overflow-wrap:anywhere;font:normal 1em/1.45 system-ui,sans-serif}

/* ---------- 桌面端上下切换 ---------- */
.desk-nav{display:none}
@media (min-width:900px){
  .desk-nav{position:fixed;z-index:2;right:max(32px,calc(50vw - min(calc((100dvh - 40px) * 9 / 32),240px) - 96px));top:50%;transform:translateY(-50%);display:grid;gap:14px}
  .desk-nav button{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    box-shadow:inset 0 0 0 .5px rgba(255,255,255,.14);transition:background .2s,transform .2s var(--ease)}
  .desk-nav button:hover{background:rgba(255,255,255,.2);transform:scale(1.06)}
  .desk-nav svg{width:22px;height:22px}
}

/* ---------- 底部面板（分享 / 评论） ---------- */
dialog{color:inherit}
#discussion,#copyDialog{margin:auto auto 0;width:min(100%,480px);max-width:100%;border:0;padding:0;border-radius:20px 20px 0 0;overflow:hidden}
#discussion::backdrop,#copyDialog::backdrop{background:rgba(0,0,0,.45);animation:fade-in .25s ease}
#discussion[open],#copyDialog[open]{animation:sheet-up .38s var(--ease)}
@keyframes sheet-up{from{transform:translateY(100%)}}
@keyframes fade-in{from{opacity:0}}
@media (prefers-reduced-motion:reduce){#discussion[open],#copyDialog[open]{animation:none}}

#copyDialog{background:rgba(28,28,32,.92);backdrop-filter:blur(30px) saturate(1.6);-webkit-backdrop-filter:blur(30px) saturate(1.6);padding:10px 18px max(18px,env(safe-area-inset-bottom));max-height:90dvh;overflow:auto}
.sheet-grip{width:36px;height:4px;border-radius:4px;background:rgba(255,255,255,.25);margin:0 auto 14px}
#copyDialog h2{margin:0;text-align:center;font-size:15px;font-weight:600}
#shareClip{margin:4px 0 18px;text-align:center;color:var(--ink-3);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#platforms{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 8px;margin:0 0 20px}
#platforms a{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--ink-2);text-decoration:none;font-size:11.5px;text-align:center}
#platforms a img{width:52px;height:52px;padding:13px;border-radius:50%;background:rgba(255,255,255,.1);filter:invert(1);box-sizing:border-box;transition:transform .2s var(--ease)}
#platforms a:active img{transform:scale(.9)}
#copyDialog .actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#copyDialog .actions button,.sheet-close{height:46px;border-radius:12px;background:rgba(255,255,255,.1);font-size:14.5px;font-weight:600}
#copyDialog .actions button#copy{background:var(--red)}
#copyDialog form{margin-top:10px}
.sheet-close{width:100%;background:transparent;color:var(--ink-3)}
#copyDialog input{display:block;width:100%;margin:10px 0 0;padding:10px 12px;border-radius:10px;border:0;background:rgba(255,255,255,.08);color:#fff;font:inherit}

#discussion{color-scheme:light;background:#fff;color:#161823;top:auto;bottom:0;height:fit-content;max-height:74dvh}
#discussion[open]{display:flex;flex-direction:column}
#discussion header{position:relative;flex:none;display:grid;place-items:center;padding:20px 52px 12px;text-align:center;touch-action:none}
#discussion header::before{content:"";position:absolute;top:7px;width:36px;height:4px;border-radius:4px;background:#e3e3e6}
#discussion header:focus{outline:none}
#discussion h2{margin:0;font-size:14px;font-weight:600;line-height:22px}
#discussionClip{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8a8b91;font-size:12px}
#discussion header form{position:absolute;right:10px;top:12px}
#dismiss{width:32px;height:32px;border-radius:50%;background:#f2f2f4;color:#3a3b44;font-size:18px;line-height:32px}
#discussionList{flex:0 1 auto;min-height:0;overflow:auto;overflow-wrap:anywhere;overscroll-behavior:contain;padding:0 0 12px}
#discussionList h3{margin:14px 18px 2px;font-size:12.5px;font-weight:600;color:#8a8b91}
#discussionList article{display:grid;grid-template-columns:36px minmax(0,1fr) 40px;gap:10px;padding:14px 16px 0;animation:fade-in .3s ease}
.comment-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 13px/1 inherit}
#discussionList strong{font-size:13px;font-weight:500;color:#8a8b91}
#discussionList small{margin-left:4px;padding:1px 5px;border-radius:4px;font-size:10px;font-weight:600;background:#f2f2f4;color:#8a8b91}
#discussionList p{margin:3px 0 0;font-size:15px;line-height:1.5;color:#161823;white-space:pre-wrap}
#discussionList button,#older{min-height:30px;font-size:12.5px;color:#8a8b91}
#older{display:block;margin:4px auto 8px;padding:0 12px}
#discussionList .comment-heart{align-self:start;justify-self:center;min-width:40px;min-height:40px;font-size:18px;color:#a8a9ae}
#discussionList .comment-heart[aria-pressed=true]{color:var(--red)}
#discussionStatus{margin:6px 0;text-align:center;font-size:13px;color:#8a8b91}
#discussionStatus:empty{display:none}
#compose{position:relative;flex:none;display:flex;align-items:center;gap:8px;padding:10px 12px max(10px,env(safe-area-inset-bottom));border-top:.5px solid #ececef;background:#fff}
#compose details summary{list-style:none;cursor:pointer;width:36px;height:40px;display:grid;place-items:center;color:#6b6c74}
#compose details summary::-webkit-details-marker{display:none}
#compose details input{position:absolute;left:12px;bottom:100%;width:min(240px,90%);margin-bottom:6px;padding:10px 14px;border:0;border-radius:20px;background:#f2f2f4;font:inherit;box-shadow:0 6px 20px rgba(0,0,0,.12)}
#compose svg{width:22px;height:22px}
#message{flex:1;min-width:0;height:40px;padding:0 16px;border:0;border-radius:20px;background:#f2f2f4;color:#161823;font:inherit;font-size:15px;outline:none}
#post{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--red);color:#fff;transition:transform .2s var(--ease),background .2s}
#post:active{transform:scale(.9)}
#compose:has(#message:placeholder-shown) #post,#post:disabled{background:#ececef;color:#a8a9ae}

@media (orientation:landscape) and (max-height:540px){
  main{width:100%;height:100dvh;border-radius:0}
  .side{gap:8px}.avatar{display:none}
  #discussion{max-height:94dvh}
}
#systemShare[hidden]+#copy{grid-column:1/-1}

/* 自动播放被拦截时的「轻点播放」：整屏遮罩，点屏幕任何位置都能开始播放 */
.tap-play{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  padding:24px;border:0;color:#fff;text-align:center;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;
  background:radial-gradient(120% 80% at 50% 45%,rgba(0,0,0,.35),rgba(0,0,0,.78));backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  animation:tap-in .4s var(--ease)}
.tap-play[hidden]{display:none}
.tap-play{touch-action:none;-webkit-user-select:none;user-select:none}
@keyframes tap-in{from{opacity:0}}
.tap-orb{position:relative;width:112px;height:112px;margin-bottom:14px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,#ff5a7a,var(--red) 55%,#e01848);box-shadow:0 12px 40px rgba(254,44,85,.55),inset 0 1px 0 rgba(255,255,255,.35);
  animation:tap-beat 1.4s ease-in-out infinite}
.tap-orb svg{width:52px;height:52px;margin-left:6px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.25))}
.tap-orb i{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(254,44,85,.85);animation:tap-ring 2.1s cubic-bezier(.2,.6,.35,1) infinite;pointer-events:none}
.tap-orb i:nth-child(2){animation-delay:.7s}
.tap-orb i:nth-child(3){animation-delay:1.4s}
@keyframes tap-ring{from{transform:scale(1);opacity:.9}to{transform:scale(2.4);opacity:0}}
@keyframes tap-beat{0%,100%{transform:scale(1)}45%{transform:scale(1.07)}60%{transform:scale(.98)}}
#tapPlayText{max-width:320px;font-size:22px;font-weight:800;line-height:1.3;letter-spacing:-.2px;text-shadow:0 2px 12px rgba(0,0,0,.5)}
#tapPlaySub{font-size:15px;color:var(--ink-2);text-shadow:0 1px 8px rgba(0,0,0,.5)}
.tap-hand{width:46px;height:46px;margin-top:22px;color:#fff;filter:drop-shadow(0 3px 8px rgba(0,0,0,.45));animation:tap-hand 1.4s ease-in-out infinite}
@keyframes tap-hand{0%,100%{transform:translateY(0) scale(1)}40%{transform:translateY(-10px) scale(1)}55%{transform:translateY(2px) scale(.88)}}
@media (prefers-reduced-motion:reduce){.tap-orb,.tap-orb i,.tap-hand{animation:none}.tap-orb i{display:none}}

/* ---------- 智能开屏 ---------- */
.splash{position:fixed;inset:0;z-index:100;display:grid;place-items:center;overflow:hidden;color:#fff;
  background:radial-gradient(120% 80% at 50% 0%,#1b1530 0%,#0a0a0f 55%,#000 100%);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.nosplash .splash{display:none}
.splash.out{opacity:0;transform:scale(1.06);pointer-events:none}
.splash-glow{position:absolute;width:140vmax;height:140vmax;left:50%;top:50%;margin:-70vmax 0 0 -70vmax;pointer-events:none;
  background:conic-gradient(from 0deg,rgba(37,244,238,.0),rgba(37,244,238,.16),rgba(123,97,255,.14),rgba(254,44,85,.18),rgba(37,244,238,.0));filter:blur(70px);animation:splash-spin 9s linear infinite;opacity:.9}
@keyframes splash-spin{to{transform:rotate(360deg)}}
.splash-inner{position:relative;display:grid;justify-items:center;gap:14px;padding:24px;text-align:center}
.splash-mark{position:relative;width:96px;height:96px;border-radius:28px;display:grid;place-items:center;font-size:52px;
  background:linear-gradient(135deg,var(--cyan) -20%,#7b61ff 45%,var(--red) 115%);
  box-shadow:-4px 0 0 rgba(37,244,238,.85),4px 0 0 rgba(254,44,85,.85),0 20px 60px rgba(123,97,255,.45);
  animation:mark-in .9s cubic-bezier(.2,1.4,.3,1) both,mark-breathe 2.6s ease-in-out .9s infinite}
.splash-mark span{animation:mark-wink 2.6s ease-in-out 1.2s infinite}
@keyframes mark-in{0%{opacity:0;transform:scale(.4) rotate(-12deg)}100%{opacity:1;transform:none}}
@keyframes mark-breathe{50%{box-shadow:-6px 0 0 rgba(37,244,238,.9),6px 0 0 rgba(254,44,85,.9),0 24px 70px rgba(123,97,255,.6)}}
@keyframes mark-wink{0%,86%,100%{transform:none}92%{transform:scale(1.12) rotate(-8deg)}}
.splash-word{margin-top:6px;font-size:30px;font-weight:800;letter-spacing:-.5px;background:linear-gradient(90deg,#fff 0%,#fff 40%,#c9b8ff 50%,#fff 60%,#fff 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:word-in .8s var(--ease) .25s both,word-shine 2.8s linear 1.1s infinite}
@keyframes word-in{from{opacity:0;transform:translateY(10px);letter-spacing:6px}}
@keyframes word-shine{from{background-position:120% 0}to{background-position:-120% 0}}
.splash-tag{min-height:20px;font-size:15px;font-weight:500;color:rgba(255,255,255,.78);animation:word-in .8s var(--ease) .45s both}
.splash-tag::after{content:'';display:inline-block;width:1.2em;text-align:left;animation:dots 1.2s steps(4) infinite}
@keyframes dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
.splash-bar{position:relative;width:180px;height:4px;margin-top:18px;border-radius:4px;background:rgba(255,255,255,.12);overflow:hidden;animation:word-in .6s var(--ease) .3s both}
.splash-bar i{position:absolute;inset:0;width:100%;border-radius:4px;background:linear-gradient(90deg,var(--cyan),#a78bfa,var(--red));transform-origin:left;animation:bar-fill var(--splash-ms,5000ms) linear both}
@keyframes bar-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes bar-run{0%{transform:translateX(-110%)}100%{transform:translateX(280%)}}
.splash-enter{margin-top:22px;display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 26px 0 20px;border-radius:24px;font-size:15.5px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#ff4d6d,var(--red));box-shadow:0 10px 30px rgba(254,44,85,.45),inset 0 0 0 .5px rgba(255,255,255,.25);animation:enter-in .5s cubic-bezier(.2,1.4,.3,1) both}
.splash-enter svg{width:22px;height:22px}
.splash-enter:not([hidden]){animation:enter-in .5s cubic-bezier(.2,1.4,.3,1) .9s both,enter-pulse 1.8s ease-in-out 1.5s infinite}
.splash-enter:active{transform:scale(.95)}
@keyframes enter-in{from{opacity:0;transform:translateY(14px) scale(.9)}}
@keyframes enter-pulse{50%{box-shadow:0 10px 40px rgba(254,44,85,.65),0 0 0 10px rgba(254,44,85,.12),inset 0 0 0 .5px rgba(255,255,255,.25)}}
@media (prefers-reduced-motion:reduce){.splash *,.splash{animation:none!important;transition:none!important}}
