/* fx.css · 3D + crypto flair for 拉盘LP金库 (transform/opacity motion only) */
.x-top{background:rgba(22,8,7,.72);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%)}
@media (max-width:860px){.x-top.is-open{background:var(--x-nav)}}

/* hero layers */
.x-hero__in{position:relative;z-index:3}
.x-fx-candles,.x-fx-rain{position:absolute;left:0;width:100%;pointer-events:none}
.x-fx-candles{bottom:0;height:60%;z-index:0;opacity:.2}
.x-fx-rain{top:0;height:100%;z-index:1}
.x-chainrow{margin:0 0 14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.x-chainbadge,.x-blk{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:0 12px;box-sizing:border-box;border-radius:999px;font-size:12px;letter-spacing:.08em;white-space:nowrap}
.x-chainbadge{color:#1a0e0b;font-weight:700;background-color:#e9b949;background-image:linear-gradient(180deg,#f3d58a,#e9b949);box-shadow:0 0 18px rgba(233,185,73,.25)}
.x-chainbadge i{width:8px;height:8px;background:#1a0e0b;transform:rotate(45deg)}
.x-blk{gap:10px;color:var(--x-l);border:1px solid var(--x-b3);background:rgba(var(--x-veil),.72);font-family:var(--x-mono);letter-spacing:0}
.x-blk b{color:var(--x-champ);font-weight:500}
.x-blk>span:first-child::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:var(--x-y);vertical-align:1px}
.x-blk b.is-tick{animation:x-fxflash .8s var(--x-ease)}
@keyframes x-fxflash{from{opacity:.35}to{opacity:1}}

/* title: shimmer + glitch */
.x-hero h1.x-glitch{position:relative;background:linear-gradient(105deg,transparent 42%,rgba(255,247,226,.9) 50%,transparent 58%) 200% 0/250% 100% no-repeat,linear-gradient(180deg,#f6ecdb 0%,var(--x-champ) 55%,var(--x-copper) 100%);-webkit-background-clip:text;background-clip:text;animation:x-fxshim 5.5s ease-in-out 1.2s infinite}
@keyframes x-fxshim{0%,40%{background-position:200% 0,0 0}100%{background-position:-100% 0,0 0}}
.x-glitch::before,.x-glitch::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;opacity:0;-webkit-text-fill-color:currentColor;background:none}
.x-glitch::before{color:rgba(var(--x-lime-rgb),.75)}
.x-glitch::after{color:rgba(226,114,91,.75)}
.x-glitch:hover::before{animation:x-fxg1 .45s steps(2) 2}
.x-glitch:hover::after{animation:x-fxg2 .45s steps(2) 2}
@keyframes x-fxg1{0%{opacity:.9;transform:translate(-3px,1px)}50%{opacity:.7;transform:translate(2px,-2px)}100%{opacity:0;transform:none}}
@keyframes x-fxg2{0%{opacity:.9;transform:translate(3px,-1px)}50%{opacity:.7;transform:translate(-2px,2px)}100%{opacity:0;transform:none}}

/* pulsing BUY */
.x-pulsebuy{position:relative;isolation:isolate}
.x-pulsebuy::after{content:"";position:absolute;inset:-1px;border-radius:inherit;border:2px solid var(--x-y);pointer-events:none;opacity:0;animation:x-fxpulse 2.2s var(--x-ease) infinite}
@keyframes x-fxpulse{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.18,1.5)}}

/* 3D coin */
.x-coin3d{position:absolute;z-index:2;top:50%;right:max(var(--x-gutter),calc((100% - var(--x-max))/2 + 48px));width:clamp(170px,22vw,300px);aspect-ratio:1;transform:translateY(-58%);perspective:1100px;cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.x-coin3d.is-drag{cursor:grabbing}
.x-coin3d::after{content:"";position:absolute;left:12%;right:12%;bottom:-16%;height:12%;border-radius:50%;background:radial-gradient(closest-side,rgba(233,185,73,.35),transparent);pointer-events:none}
.x-coin3d__spin{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(10deg) rotateY(var(--ry,-24deg));will-change:transform}
.x-coin3d__face,.x-coin3d__e{position:absolute;inset:0;border-radius:50%}
.x-coin3d__face{overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(var(--h,10px));background:radial-gradient(circle at 40% 35%,#f3d58a,#b46a28 70%,#5a2a10);box-shadow:inset 0 0 0 2px rgba(243,213,138,.5),inset 0 0 24px rgba(0,0,0,.35)}
.x-coin3d__face--b{transform:rotateY(180deg) translateZ(var(--h,10px))}
.x-coin3d__face img{position:absolute;left:0;top:0;width:100%;height:115.5%;max-width:none;pointer-events:none}
.x-coin3d__e{background:linear-gradient(90deg,#5a2a10,#c8873a 30%,#f0c777 50%,#c8873a 70%,#5a2a10)}
@media (max-width:960px){.x-coin3d{top:84px;width:140px;transform:none}}
@media (max-width:640px){.x-coin3d{top:64px;right:auto;left:50%;width:118px;margin-left:-59px}}

/* 70/20/10 flip cards */
.x-hero__stats.x-flips li{padding:0;border:0;background:none;box-shadow:none;perspective:700px}
.x-flip{appearance:none;display:block;width:100%;min-height:44px;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:var(--r-in)}
.x-hero__stats.x-flips .x-flip__in{display:grid;margin:0;transform-style:preserve-3d;transition:transform .9s var(--x-ease),opacity .6s var(--x-ease)}
.x-hero__stats.x-flips .x-flip__f,.x-hero__stats.x-flips .x-flip__b{grid-area:1/1;display:block;margin:0;padding:12px 14px;box-sizing:border-box;border:1px solid var(--x-b3);border-radius:var(--r-in);background:rgba(36,21,15,.72);box-shadow:var(--x-hi);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.x-hero__stats.x-flips .x-flip__f span{margin-top:4px}
.x-hero__stats.x-flips .x-flip__b{display:flex;align-items:center;transform:rotateY(180deg);font-size:12px;line-height:1.45;color:var(--x-champ);border-color:rgba(var(--x-lime-rgb),.4);background:linear-gradient(160deg,rgba(var(--x-lime-rgb),.1),rgba(36,21,15,.85))}
.x-flips.is-pre .x-flip__in{transform:rotateX(-90deg);opacity:0}
.x-flip.is-flipped .x-flip__in{transform:rotateY(180deg)}
@media (hover:hover){.x-flip:hover .x-flip__in{transform:rotateY(180deg)}}
@media (max-width:640px){.x-hero__stats.x-flips .x-flip__f,.x-hero__stats.x-flips .x-flip__b{padding:10px}}

/* live buys: rocket, micro-copy, whales */
#live{position:relative;overflow:hidden}
.x-lfg{display:inline-block;color:var(--x-y);font-weight:700;letter-spacing:.04em}
.x-lfg.is-pop{animation:x-fxpop .7s var(--x-ease)}
@keyframes x-fxpop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.15);opacity:1}100%{transform:none}}
.x-rocket{position:absolute;left:0;top:0;z-index:4;font-size:20px;line-height:1;pointer-events:none;will-change:transform,opacity}
.x-rocket::before{content:"";position:absolute;right:70%;top:60%;width:90px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,rgba(var(--x-lime-rgb),.85));transform:rotate(45deg);transform-origin:100% 50%}
.x-row.is-whale{background:linear-gradient(90deg,rgba(233,185,73,.16),rgba(233,185,73,0) 75%);box-shadow:inset 2px 0 0 var(--x-g)}
.x-row.is-whale .x-row__amt b{color:var(--x-g)}
.x-row.is-whale .x-row__name>span:first-child::before{content:"🐋 "}
.x-toast.is-whale{border-color:var(--x-g);color:var(--x-champ);box-shadow:var(--x-hi),0 0 28px rgba(233,185,73,.25),0 8px 24px rgba(0,0,0,.5)}
.x-toast.is-whale b{color:var(--x-g)}

/* mood gauge */
.x-gauge{position:relative;width:min(100%,280px);margin:4px auto 0;aspect-ratio:200/112}
.x-gauge svg{display:block;width:100%;height:100%}
.x-gauge__n{position:absolute;left:50%;top:19.3%;width:3px;height:70%;margin-left:-1.5px;border-radius:3px;background:linear-gradient(to top,transparent 52%,var(--x-champ) 54%,#fff7e2);transform-origin:50% 100%;transform:rotate(var(--a,-90deg));transition:transform 1.6s var(--x-ease);box-shadow:0 0 10px rgba(233,202,156,.35)}
.x-gauge__v{position:absolute;left:0;right:0;bottom:0;display:grid;justify-items:center;gap:2px;text-align:center}
.x-gauge__v b{font-size:clamp(26px,5vw,34px);line-height:1;color:var(--x-champ);font-weight:700}
.x-gauge__v span{font-size:12px;color:var(--x-l);letter-spacing:.08em}
.x-gauge__ends{display:flex;justify-content:space-between;width:min(100%,280px);margin:6px auto 12px;font-size:12px;color:var(--x-h)}
#mood .x-hint{text-align:center}

/* holder leaderboard */
.x-lb{margin:0;padding:0;list-style:none;border-top:1px solid var(--x-div)}
.x-lb li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:4px 10px;padding:10px 0;border-bottom:1px solid var(--x-div)}
.x-lb__r{font-family:var(--x-mono);font-size:12px;color:var(--x-h)}
.x-lb li:first-child .x-lb__r{color:var(--x-g)}
.x-lb__w{min-width:0;display:grid;gap:6px}
.x-lb__a{font-family:var(--x-mono);font-size:12px;color:var(--x-w);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.x-lb__d{margin-left:6px;font-size:12px}
.x-lb__bar{height:3px;border-radius:3px;background:rgba(233,202,156,.1);overflow:hidden}
.x-lb__bar i{display:block;height:100%;background:linear-gradient(90deg,var(--x-copper),var(--x-g));transform-origin:0 50%;transform:scaleX(var(--s,0));transition:transform 1.4s var(--x-ease)}
.x-lb__v{text-align:right;font-size:12px;color:var(--x-l);line-height:1.4}
.x-lb__v b{display:block;font-size:13px;color:var(--x-champ);font-weight:700}

/* vault door */
.x-door{position:relative;z-index:1;height:clamp(180px,26vw,300px);margin:var(--stack-gap) auto;perspective:1200px;border:1px solid var(--x-b);border-radius:var(--r-card);overflow:hidden;background:radial-gradient(55% 75% at 50% 50%,rgba(233,185,73,.4),rgba(32,12,11,0) 72%),#160807}
.x-door__glow{position:absolute;inset:0;display:grid;place-content:center;gap:6px;text-align:center}
.x-door__glow b{font-size:clamp(24px,4.4vw,44px);line-height:1.1;color:var(--x-champ);text-shadow:0 0 30px rgba(233,185,73,.5)}
.x-door__glow span{font-size:12px;letter-spacing:.14em;color:var(--x-w)}
.x-door__p{position:absolute;top:0;bottom:0;width:50%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform;background:radial-gradient(circle,rgba(243,213,138,.55) 0 2px,transparent 3px) 0 0/28px 28px,linear-gradient(180deg,#4a2a1c,#2a160f 50%,#3c2116);box-shadow:inset 0 0 0 1px rgba(233,202,156,.18),inset 0 0 40px rgba(0,0,0,.55)}
.x-door__p--l{left:0;transform-origin:0 50%;transform:rotateY(calc(var(--o,0) * -104deg))}
.x-door__p--r{right:0;transform-origin:100% 50%;transform:rotateY(calc(var(--o,0) * 104deg))}
.x-door__p i{position:absolute;top:50%;width:min(52%,150px);aspect-ratio:1;margin-top:calc(min(52%,150px) / -2);border-radius:50%;border:6px solid #c8873a;box-sizing:border-box;background:repeating-conic-gradient(rgba(243,213,138,.6) 0 4deg,transparent 4deg 45deg),radial-gradient(circle,#e9b949 0 14%,#2a160f 15%);box-shadow:0 0 22px rgba(233,185,73,.25)}
.x-door__p--l i{right:0;transform:translateX(50%)}
.x-door__p--r i{left:0;transform:translateX(-50%)}

/* 3D countdown ring */
.x-ring{perspective:520px}
.x-ring>svg,.x-ring__in{transform:rotateX(16deg) rotateY(-12deg)}
.x-ring>svg{filter:drop-shadow(0 0 8px rgba(233,185,73,.35))}
.x-orbit{position:absolute;inset:-12px;border-radius:50%;pointer-events:none;border:1px solid rgba(233,202,156,.35);box-shadow:0 0 14px rgba(233,185,73,.25);transform:rotateX(70deg) rotateZ(0);animation:x-fxorb 9s linear infinite}
.x-orbit--2{inset:-4px;border-style:dashed;border-color:rgba(var(--x-lime-rgb),.45);transform:rotateX(16deg) rotateY(-12deg);animation:x-fxspin 14s linear infinite reverse}
.x-orbit--2::after,.x-orbit:not(.x-orbit--2)::after{content:"";position:absolute;top:-3px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--x-g);box-shadow:0 0 8px var(--x-g)}
@keyframes x-fxorb{to{transform:rotateX(70deg) rotateZ(360deg)}}
@keyframes x-fxspin{to{transform:rotateX(16deg) rotateY(-12deg) rotateZ(360deg)}}

/* coin burst */
.x-burst{position:fixed;left:0;top:0;width:0;height:0;z-index:60;pointer-events:none}
.x-burst i{position:absolute;left:-8px;top:-8px;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff1c4,#e9b949 45%,#a8601f);box-shadow:inset 0 0 0 1.5px rgba(90,42,16,.5),0 0 8px rgba(233,185,73,.5);will-change:transform,opacity}

/* layout pieces */
.x-b50{display:inline-block;margin-left:4px;padding:1px 6px;border:1px solid rgba(var(--x-lime-rgb),.5);border-radius:999px;font:500 12px/1.3 var(--x-mono);color:var(--x-y)}
.x-tabs button{line-height:1.2}
@media (max-width:480px){.x-b50{display:block;width:max-content;margin:3px auto 0}}
.x-fig{position:relative;margin:0;min-height:260px;overflow:hidden;border:1px solid var(--x-b);border-radius:var(--r-card);background:#160807}
.x-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.x-fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:48px var(--card-pad) 14px;background:linear-gradient(to top,rgba(22,8,7,.96),rgba(22,8,7,0));color:var(--x-w);font-size:13px;line-height:1.6}
.x-fig figcaption b{display:block;margin-bottom:4px;font-size:clamp(18px,2.6vw,28px);line-height:1.2;color:var(--x-title)}
.x-grid2>.x-stack{align-content:stretch;grid-template-rows:auto minmax(260px,1fr)}
.x-fig--wide{min-height:clamp(240px,34vw,400px)}
.x-more>summary{list-style:none;display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 var(--card-pad);border:1px solid var(--x-b3);border-radius:var(--r-card);background:var(--x-glow),var(--x-card);color:var(--x-champ);font-weight:700;letter-spacing:.08em;cursor:pointer;box-shadow:var(--x-hi)}
.x-more>summary::-webkit-details-marker{display:none}
.x-more>summary:hover{border-color:rgba(var(--x-lime-rgb),.45)}
.x-more>summary b{display:inline-block;transition:transform .4s var(--x-ease)}
.x-more[open]>summary b{transform:rotate(180deg)}
.x-more__body{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--stack-gap);margin-top:var(--stack-gap)}
.x-more__body>*{min-width:0;margin:0}
.x-more .x-grid2{align-items:start}
.x-more .x-rv{opacity:1;translate:none;transition:none}
.x-risk__l{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.x-risk__l li{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 12px;border:1px solid var(--x-b3);border-radius:999px;font-size:12px;color:var(--x-l)}
.x-risk__l b{color:var(--x-champ);font-weight:500}
.x-wagmi{margin:0 0 10px!important;font:500 12px/1.4 var(--x-mono);letter-spacing:.16em;color:var(--x-y)!important}

/* off-screen and reduced motion */
.x-paused,.x-paused *,.x-paused::before,.x-paused::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){
  .x-hero h1.x-glitch,.x-pulsebuy::after,.x-orbit,.x-glitch:hover::before,.x-glitch:hover::after{animation:none!important}
  .x-pulsebuy::after,.x-rocket,.x-burst{display:none}
  .x-hero__stats.x-flips .x-flip__in,.x-door__p,.x-gauge__n,.x-lb__bar i{transition:none}
  .x-door__p{--o:1}
}