/* ===== Pokechain — liquid chrome & gold ===== */
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
:root{
  --bg:#050506;--bg2:#0b0b0d;--ink:#eef0f2;--mute:#8d929a;--dim:#5b6068;--line:rgba(255,255,255,.085);--line2:rgba(255,255,255,.16);
  --chrome:linear-gradient(180deg,#ffffff 0%,#d3d7dc 26%,#6f757d 49%,#e9ecef 70%,#9ba1a9 100%);
  --chromeH:linear-gradient(100deg,#8e949c 0%,#f5f7f9 22%,#6b7179 44%,#e4e7ea 64%,#7d838b 84%,#f2f4f6 100%);
  --gold:linear-gradient(180deg,#fff3c9 0%,#f3c661 30%,#a96d17 58%,#f7d98c 82%,#c58b2b 100%);
  --goldH:linear-gradient(100deg,#9c6214 0%,#f8dc93 20%,#c3851f 42%,#fff1c6 60%,#b07418 80%,#f2c766 100%);
  --g1:#f3c661;--g2:#a96d17;
  --fl:"Archivo","Zen Kaku Gothic New","Noto Sans HK",system-ui,sans-serif;
  --fb:"Hanken Grotesk","Zen Kaku Gothic New","Noto Sans HK",system-ui,sans-serif;
  --fm:"Shippori Mincho B1","Zen Kaku Gothic New",serif;
  --px:clamp(18px,5vw,72px);--hd:68px;
  --ease:cubic-bezier(.2,.7,.1,1);
}
html[lang="zh-HK"]{--fl:"Archivo","Noto Sans HK",system-ui,sans-serif;--fb:"Hanken Grotesk","Noto Sans HK",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{font-stretch:125%;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 12px);background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--fb);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;font-feature-settings:"palt" 1}
html.lock,html.lock body{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
h1,h2,h3,p,dl,dd,ol,ul{margin:0;padding:0}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--g1);outline-offset:3px;border-radius:6px}
.g{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.ctext{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ===== header ===== */
.hd{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--hd);display:flex;align-items:center;gap:24px;padding:0 var(--px);padding-top:env(safe-area-inset-top);transition:background .35s,border-color .35s,backdrop-filter .35s;border-bottom:1px solid transparent}
.hd.s{background:rgba(6,6,8,.72);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border-bottom-color:var(--line)}
.brand{display:flex;align-items:center;gap:10px;flex:none}
.brand img{height:36px;width:auto;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6))}
.wm{font-family:"Archivo",sans-serif;font-weight:800;font-size:15px;letter-spacing:.2em;background:var(--chromeH);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flowx 9s linear infinite}
@keyframes flowx{to{background-position:-200% 0}}
.hnav{display:flex;gap:4px;margin-left:auto;align-items:center}
.hnav a{font-size:13.5px;font-weight:500;color:#c4c8ce;padding:8px 12px;border-radius:10px;transition:color .2s,background .2s;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.hnav a:hover{color:#fff;background:rgba(255,255,255,.05)}
.hnav a svg,.btn svg{width:11px;height:11px}
.hnav .ext{color:var(--g1)}
.hr{display:flex;align-items:center;gap:10px;flex:none}
.lang{display:flex;padding:3px;border-radius:12px;border:1px solid var(--line2);background:rgba(255,255,255,.03)}
.lang button{font-size:12px;font-weight:600;line-height:1;padding:8px 10px;border-radius:9px;color:#9aa0a8;transition:color .2s,background .25s;white-space:nowrap}
.lang button[lang="en"]{font-family:"Archivo",sans-serif;letter-spacing:.06em}
.lang button:hover{color:#fff}
.lang button.on{color:#141006;background:var(--goldH);background-size:200% 100%;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.burger{display:none;width:40px;height:40px;border-radius:12px;border:1px solid var(--line2);position:relative}
.burger i{position:absolute;left:12px;right:12px;height:1.5px;background:#e6e8eb;border-radius:2px;transition:transform .35s var(--ease)}
.burger i:first-child{top:16px}.burger i:last-child{top:22px}
.burger[aria-expanded="true"] i:first-child{transform:translateY(3px) rotate(45deg)}
.burger[aria-expanded="true"] i:last-child{transform:translateY(-3px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:45;background:rgba(5,5,6,.94);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hd) + 10px) var(--px) 40px;gap:4px;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.mnav.on{opacity:1;visibility:visible}
.mnav a{display:flex;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:clamp(22px,6.4vw,30px);font-weight:700;font-family:var(--fl);transform:translateY(14px);opacity:0;transition:transform .5s var(--ease),opacity .5s}
.mnav.on a{transform:none;opacity:1}
.mnav.on a:nth-child(2){transition-delay:.04s}.mnav.on a:nth-child(3){transition-delay:.08s}.mnav.on a:nth-child(4){transition-delay:.12s}.mnav.on a:nth-child(5){transition-delay:.16s}.mnav.on a:nth-child(6){transition-delay:.2s}
.mnav b{font-family:var(--fm);font-size:15px;width:24px;flex:none;color:var(--g1);font-weight:800}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 24px;border-radius:14px;font-weight:700;font-size:15px;letter-spacing:.01em;white-space:nowrap;position:relative;isolation:isolate;transition:transform .25s var(--ease),box-shadow .3s,background-position .6s}
.btn:active{transform:scale(.97)}
.btn-gold{color:#1b1306;background:var(--goldH);background-size:220% 100%;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 6px rgba(120,70,10,.45),0 10px 30px -12px rgba(243,198,97,.55)}
.btn-gold:hover{background-position:100% 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 6px rgba(120,70,10,.45),0 14px 40px -12px rgba(243,198,97,.8)}
.btn-chrome{color:#f1f3f5;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.btn-chrome:hover{border-color:rgba(255,255,255,.4);background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03))}
.btn[disabled]{cursor:not-allowed;filter:saturate(.35) brightness(.7)}
.btn.big{height:58px;font-size:17px;padding:0 38px;min-width:220px}

/* ===== hero ===== */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;padding:calc(var(--hd) + 40px) var(--px) 0}
#liquid{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.6s ease}
.gl-on #liquid{opacity:1}
.hero-fallback{position:absolute;inset:0;background:#050506 url(/img/sculpt.webp) 70% 50%/cover no-repeat;display:none}
.no-gl .hero-fallback{display:block}
.hero-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,5,6,.82) 0%,rgba(5,5,6,.35) 46%,rgba(5,5,6,0) 70%),linear-gradient(0deg,var(--bg) 0%,rgba(5,5,6,0) 32%),linear-gradient(180deg,rgba(5,5,6,.6) 0%,rgba(5,5,6,0) 18%)}
.vert{position:absolute;right:calc(var(--px) - 6px);top:calc(var(--hd) + 36px);writing-mode:vertical-rl;font-family:var(--fm);font-weight:600;font-size:13px;letter-spacing:.42em;color:rgba(238,240,242,.42);z-index:2;white-space:nowrap}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:40px;flex:1;max-width:1320px;width:100%;margin:0 auto}
.kick{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:#cfd3d8;letter-spacing:.04em;padding:7px 14px 7px 10px;border-radius:999px;border:1px solid var(--line2);background:rgba(5,5,6,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--g1);box-shadow:0 0 0 0 rgba(243,198,97,.6);animation:pulse 2.4s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(243,198,97,0)}100%{box-shadow:0 0 0 0 rgba(243,198,97,0)}}
.hero h1{font-family:var(--fl);font-weight:800;font-size:clamp(34px,5.4vw,84px);line-height:1.08;letter-spacing:-.01em;margin:22px 0 22px}
html[lang="en"] .hero h1{font-size:clamp(32px,4.5vw,70px)}
html[lang="ja"] .hero h1,html[lang="zh-HK"] .hero h1{letter-spacing:.01em;line-height:1.14;font-weight:900}
.hero h1 span{display:block}
.hero .l1{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .l2{background:var(--goldH);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flowx 10s linear infinite;padding-bottom:.06em}
.sub{max-width:34em;font-size:clamp(15px,1.3vw,17.5px);color:#b9bec5;line-height:1.75}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.fan{position:relative;height:clamp(300px,34vw,470px);perspective:1200px}
.fan .pc{position:absolute;left:50%;top:50%;width:clamp(150px,15.5vw,238px);margin:0;transform-origin:50% 90%;--r:0deg;--x:0px;transform:translate(-50%,-50%) translateX(var(--x)) rotate(var(--r)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--ease);animation:bob 7s ease-in-out infinite}
.fan .pc:nth-child(1){--r:-12deg;--x:-34%;z-index:1;animation-delay:-2s}
.fan .pc:nth-child(2){--r:0deg;--x:0px;z-index:3;top:46%}
.fan .pc:nth-child(3){--r:12deg;--x:34%;z-index:2;animation-delay:-4s}
.fan .pc .pc-meta{display:none}
@keyframes bob{50%{translate:0 -10px}}
.stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);max-width:1320px;width:100%;margin:40px auto 0;border-top:1px solid var(--line2)}
.stats div{padding:20px 0 26px;padding-left:20px;border-left:1px solid var(--line)}
.stats div:first-child{border-left:0;padding-left:0}
.stats dt{font-size:12.5px;color:var(--mute);font-weight:500;letter-spacing:.04em}
.stats dd{font-family:"Archivo",sans-serif;font-weight:700;font-size:clamp(22px,2.5vw,36px);line-height:1.2;margin-top:4px;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.stats dd.g{background:var(--gold);-webkit-background-clip:text;background-clip:text}

/* ===== tape ===== */
.tape{display:flex;align-items:stretch;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg2)}
.tape-lbl{flex:none;display:flex;flex-direction:column;justify-content:center;padding:0 22px 0 var(--px);border-right:1px solid var(--line);font-size:13px;font-weight:700;line-height:1.3}
.tape-lbl small{font-size:11px;color:var(--mute);font-weight:500}
.tape-win{overflow:hidden;flex:1;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tape-run{display:flex;width:max-content;animation:tape 120s linear infinite}
.tape:hover .tape-run{animation-play-state:paused}
@keyframes tape{to{transform:translateX(-50%)}}
.ti{display:flex;align-items:center;gap:10px;padding:16px 26px;white-space:nowrap;font-size:13.5px;color:#c9cdd2;border-right:1px solid var(--line)}
.ti i{width:7px;height:7px;border-radius:50%;flex:none}
.ti b{font-family:"Archivo",sans-serif;font-weight:700;color:#fff}
.ti small{color:var(--dim);font-size:12px}

/* ===== sections ===== */
.sec{position:relative;max-width:1464px;margin:0 auto;padding:clamp(84px,11vw,150px) var(--px) 0}
.sh{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:clamp(18px,3vw,44px);align-items:start;margin-bottom:clamp(36px,5vw,64px);max-width:1080px}
.num{grid-row:span 3;font-family:var(--fm);font-weight:800;font-size:clamp(60px,8.4vw,128px);line-height:.92;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 24px rgba(255,255,255,.08))}
.k{font-family:"Archivo",var(--fb);font-weight:700;font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--g1);margin-top:.4em}
html[lang="ja"] .k,html[lang="zh-HK"] .k{letter-spacing:.18em}
.sh h2{font-family:var(--fl);font-weight:800;font-size:clamp(28px,4.1vw,58px);line-height:1.12;margin:10px 0 14px;letter-spacing:-.005em}
html[lang="ja"] .sh h2,html[lang="zh-HK"] .sh h2{font-weight:900;line-height:1.22}
.lead{color:#a9aeb5;font-size:clamp(15px,1.25vw,17px);max-width:40em;line-height:1.8}

/* reveal */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* ===== card component ===== */
.pc{display:block;text-align:left;width:100%;position:relative;--mx:.5;--my:.5;cursor:pointer}
.pc-f{position:relative;aspect-ratio:245/342;border-radius:5.2%/3.8%;padding:3.2%;background:#22252a;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease),box-shadow .4s;will-change:transform;box-shadow:0 18px 40px -22px rgba(0,0,0,.9)}
.pc-f img{width:100%;height:100%;object-fit:cover;border-radius:4.2%/3%;background:#15171a}
.pc-f .fx{position:absolute;inset:3.2%;border-radius:4.2%/3%;pointer-events:none;opacity:0;transition:opacity .4s}
.pc-tag{position:absolute;z-index:3;top:-9px;right:10px;font-family:var(--fm);font-weight:800;font-size:12px;line-height:1;padding:5px 8px;border-radius:7px;color:#1b1306;background:var(--goldH);background-size:200% 100%;box-shadow:0 4px 14px -4px rgba(243,198,97,.7)}
.pc-meta{padding:12px 2px 0}
.pc-n{font-weight:700;font-size:14.5px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-s{font-size:12px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.pc-r{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.pc-p{font-family:"Archivo",sans-serif;font-weight:700;font-size:15px;white-space:nowrap}
.pc-q{font-size:11.5px;color:var(--mute);white-space:nowrap}
.pc-q b{color:#d8dbe0;font-weight:600}
.pc-t{font-family:"Archivo",sans-serif;font-size:10.5px;letter-spacing:.14em;font-weight:700;margin-top:6px;display:inline-block}

/* tier frames */
.t1 .pc-f{background:linear-gradient(145deg,#e3e6ea,#7a8088 38%,#f4f6f8 58%,#8a9098)}
.t2 .pc-f{background:var(--chromeH);background-size:220% 220%}
.t3 .pc-f{background:linear-gradient(135deg,#f5f7fa,#6f7a86 30%,#e6f1ff 50%,#6b737d 72%,#f3f5f8)}
.t3 .fx{opacity:.28;background:linear-gradient(115deg,transparent 20%,rgba(140,215,255,.5) 38%,rgba(255,150,225,.45) 50%,rgba(255,240,160,.45) 62%,transparent 80%);background-size:260% 260%;background-position:calc(var(--mx)*100%) calc(var(--my)*100%);mix-blend-mode:color-dodge}
.t4 .pc-f{background:linear-gradient(135deg,#ffffff,#b9c1cb 25%,#f8fbff 50%,#9aa3ad 75%,#ffffff);box-shadow:0 0 0 1px rgba(255,255,255,.35),0 18px 44px -20px rgba(200,215,235,.45)}
.t4 .pc-f::after{content:"";position:absolute;inset:1.4%;border-radius:4.6%/3.4%;border:1px solid rgba(40,45,52,.55);pointer-events:none}
.t4 .fx{opacity:.55;background:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 70% 60%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 45% 85%,#fff 0 .8px,transparent 1.4px),radial-gradient(circle at 85% 15%,#fff 0 1.2px,transparent 1.8px);background-size:38px 38px,52px 52px,30px 30px,64px 64px;mix-blend-mode:screen;animation:twinkle 3.2s ease-in-out infinite}
@keyframes twinkle{50%{opacity:.18}}
.t5 .pc-f{background:var(--goldH);background-size:220% 220%;box-shadow:0 18px 46px -18px rgba(243,198,97,.45)}
.t5 .fx{opacity:.3;background:radial-gradient(circle at calc(var(--mx)*100%) calc(var(--my)*100%),rgba(255,226,150,.75),rgba(255,190,80,.15) 40%,transparent 65%);mix-blend-mode:soft-light}
.t6 .pc-f,.t7 .pc-f{background:conic-gradient(from var(--a),#7a4a0e,#ffe9a6,#c78a24,#fff6d8,#a76a14,#f3c661,#7a4a0e);animation:spin 6s linear infinite;box-shadow:0 0 0 1px rgba(255,220,140,.4),0 0 34px -6px rgba(243,170,60,.5),0 24px 60px -24px rgba(243,170,60,.6)}
.t6 .fx{opacity:.35;background:radial-gradient(circle at calc(var(--mx)*100%) calc(var(--my)*100%),rgba(255,210,120,.7),transparent 60%);mix-blend-mode:overlay}
.t7 .pc-f{padding:4%;background:conic-gradient(from var(--a),#f6f8fa,#f3c661,#6f757d,#fff3c9,#a96d17,#e9ecef,#f3c661,#f6f8fa);animation:spin 4.5s linear infinite,glow 3s ease-in-out infinite}
.t7 .pc-f img,.t7 .fx{inset:4%}
.t7 .fx{opacity:.5;background:linear-gradient(115deg,transparent 25%,rgba(255,236,170,.55) 45%,rgba(255,255,255,.5) 52%,rgba(160,220,255,.4) 60%,transparent 78%);background-size:260% 260%;background-position:calc(var(--mx)*100%) calc(var(--my)*100%);mix-blend-mode:color-dodge}
.t7 .pc-f::before{content:"";position:absolute;inset:-14px;border-radius:12%;pointer-events:none;background:radial-gradient(circle at 15% 80%,#ffe6a0 0 1.4px,transparent 2px),radial-gradient(circle at 80% 70%,#fff 0 1.2px,transparent 2px),radial-gradient(circle at 60% 95%,#ffd27a 0 1px,transparent 1.8px),radial-gradient(circle at 30% 100%,#fff2c2 0 1.6px,transparent 2.2px);animation:rise 3.6s linear infinite;z-index:-1}
@keyframes spin{to{--a:360deg}}
@keyframes glow{50%{box-shadow:0 0 0 1px rgba(255,235,170,.6),0 0 60px -4px rgba(243,190,80,.75),0 24px 60px -24px rgba(243,170,60,.7)}}
@keyframes rise{0%{transform:translateY(10px);opacity:0}30%{opacity:1}100%{transform:translateY(-60px);opacity:0}}
@media (hover:hover){
  .pc:hover .pc-f{box-shadow:0 30px 60px -24px rgba(0,0,0,.95)}
  .t2.pc:hover .pc-f{animation:flowb 4s linear infinite}
  .t3.pc:hover .fx{opacity:.85}
  .t4.pc:hover .fx{opacity:.9}
  .t5.pc:hover .pc-f{animation:flowb 5s linear infinite}
  .t5.pc:hover .fx,.t6.pc:hover .fx{opacity:.8}
  .t7.pc:hover .fx{opacity:.95}
}
@keyframes flowb{to{background-position:220% 220%}}
.tc1{background:#c7ccd2}.tc2{background:#eef1f4}.tc3{background:linear-gradient(135deg,#bfe6ff,#ffc6ec)}.tc4{background:#f7fbff;box-shadow:0 0 6px #fff}.tc5{background:#f3c661}.tc6{background:#ff9f2e;box-shadow:0 0 8px #ffae45}.tc7{background:linear-gradient(135deg,#fff,#f3c661);box-shadow:0 0 10px #f3c661}
.tx1{color:#c7ccd2}.tx2{color:#eef1f4}.tx3{color:#bfe0ff}.tx4{color:#f7fbff}.tx5{color:#f3c661}.tx6{color:#ffb24f}.tx7{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ===== foundry (tiers) ===== */
.foundry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,4vw,64px);align-items:start}
.tubes{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(6px,1.2vw,16px);align-items:end}
.tube{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0}
.tube-g{position:relative;width:100%;max-width:64px;height:clamp(210px,28vw,380px);border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 40%,rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.14);overflow:hidden;box-shadow:inset 0 0 18px rgba(0,0,0,.6);transition:border-color .3s,box-shadow .3s}
.tube-g::after{content:"";position:absolute;top:8%;bottom:8%;left:18%;width:14%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.04));pointer-events:none;z-index:2}
.tube.on .tube-g{border-color:rgba(243,198,97,.8);box-shadow:inset 0 0 18px rgba(0,0,0,.6),0 0 28px -6px rgba(243,198,97,.5)}
.fill{position:absolute;left:0;right:0;bottom:0;height:0;background:var(--fc);transition:height 1.6s var(--ease)}
.in .fill{height:var(--h)}
.wv{position:absolute;left:0;top:-4px;width:calc(100% + 24px);height:5px;background:radial-gradient(13px 5px at 50% 0,transparent 96%,var(--top) 100%) 0 0/24px 5px repeat-x;animation:wave 1.8s linear infinite}
@keyframes wave{to{transform:translateX(-24px)}}
.tube:nth-child(even) .wv{animation-duration:2.3s}
.f1{--top:#9aa0a8;--fc:linear-gradient(180deg,#9aa0a8,#4f545b)}
.f2{--top:#e3e6ea;--fc:linear-gradient(180deg,#e3e6ea,#7b8189 60%,#c9cdd2)}
.f3{--top:#c4d7e8;--fc:linear-gradient(180deg,#c4d7e8,#6e7c8a 55%,#d9c9e6)}
.f4{--top:#f4f8fc;--fc:linear-gradient(180deg,#f4f8fc,#aab3bd 60%,#e9eef4)}
.f5{--top:#f6d27f;--fc:linear-gradient(180deg,#f6d27f,#b07a22 60%,#e8b24c)}
.f6{--top:#ffb04a;--fc:linear-gradient(180deg,#ffb04a,#b8620e 60%,#ffcf7a)}
.f7{--top:#fff0c2;--fc:linear-gradient(180deg,#fff0c2,#f3c661 40%,#a96d17)}
.f6 .fill,.f7 .fill{box-shadow:0 0 22px 2px rgba(255,170,60,.55)}
.tube-l{text-align:center;line-height:1.2;min-width:0;width:100%}
.tube-l b{display:block;font-family:var(--fm);font-weight:800;font-size:clamp(14px,1.5vw,19px)}
.tube-l span{display:block;font-family:"Archivo",sans-serif;font-stretch:100%;font-weight:700;font-size:clamp(8px,.72vw,10px);letter-spacing:.04em;color:var(--mute);margin-top:4px;white-space:nowrap;margin-left:-10px;margin-right:-10px}
.tube.on .tube-l span{color:var(--g1)}
.tube-hint{grid-column:1/-1;font-size:12px;color:var(--dim);text-align:center;margin-top:6px}
.tdetail{border:1px solid var(--line2);border-radius:24px;padding:clamp(20px,2.6vw,34px);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));min-height:100%}
.td-h{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.td-h b{font-family:var(--fm);font-weight:800;font-size:clamp(34px,3.6vw,52px);line-height:1}
.td-h span{font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(18px,1.8vw,24px);letter-spacing:.12em}
.td-d{color:#b4b9c0;margin:10px 0 20px;font-size:15px}
.td-s{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:24px}
.td-s div{padding:12px 10px 12px 0}
.td-s dt{font-size:11px;color:var(--mute);line-height:1.35}
.td-s dd{font-family:"Archivo",sans-serif;font-weight:700;font-size:clamp(14px,1.3vw,18px);margin-top:4px;white-space:nowrap}
.td-c{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.td-c .pc-meta{padding-top:9px}
.td-c .pc-s,.td-c .pc-r{display:none}
.td-c .pc-n{font-size:12.5px}

/* ===== vault ===== */
.vbar{display:flex;flex-direction:column;gap:14px;margin-bottom:18px}
.vf,.vsort{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px}
.vf::-webkit-scrollbar,.vsort::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:11px;border:1px solid var(--line2);font-size:13px;font-weight:600;color:#c4c8ce;white-space:nowrap;transition:all .25s}
.chip i{width:8px;height:8px;border-radius:50%}
.chip:hover{border-color:rgba(255,255,255,.35);color:#fff}
.chip.on{color:#141006;background:var(--goldH);background-size:200% 100%;border-color:transparent}
.chip .cnt{font-size:11px;opacity:.6;font-weight:500}
.vtools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.vs{flex:1 1 260px;display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line2);background:rgba(255,255,255,.025);min-width:0}
.vs svg{width:16px;height:16px;color:var(--mute);flex:none}
.vs input{flex:1;min-width:0;background:none;border:0;outline:0;color:#fff;font:inherit;font-size:16px;height:100%}
.vs input::placeholder{color:var(--dim)}
.vs:focus-within{border-color:rgba(243,198,97,.6)}
.vsort button{flex:none;height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line);font-size:13px;color:var(--mute);white-space:nowrap;transition:all .2s}
.vsort button.on{color:#fff;border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.06)}
.vcount{font-size:12.5px;color:var(--mute);margin-bottom:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:clamp(14px,1.8vw,26px) clamp(12px,1.6vw,22px)}
.grid .pc{content-visibility:auto;contain-intrinsic-size:176px 330px}
.grid .none{grid-column:1/-1;text-align:center;color:var(--mute);padding:60px 0}
.vmore{display:flex;justify-content:center;margin-top:40px}
.vmore[hidden]{display:none}

/* ===== mint ===== */
.mint{overflow:hidden}
.mint-art{position:absolute;inset:clamp(40px,6vw,80px) 0 auto 0;height:min(760px,90vw);display:flex;justify-content:center;pointer-events:none;-webkit-mask:radial-gradient(ellipse 50% 50% at 50% 50%,#000 30%,transparent 72%);mask:radial-gradient(ellipse 50% 50% at 50% 50%,#000 30%,transparent 72%);opacity:.5}
.mint-art img{height:100%;width:auto;max-width:none;object-fit:cover}
.mint .sh{position:relative}
.pour{position:relative;max-width:760px;margin:0 auto;border-radius:28px;padding:clamp(22px,3.4vw,44px);background:linear-gradient(180deg,rgba(14,14,17,.82),rgba(10,10,12,.92));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 40px 120px -40px rgba(0,0,0,.9)}
.pour-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.pl{font-size:12.5px;color:var(--mute);margin-bottom:6px}
.qty{display:flex;align-items:center;gap:12px}
.qty output{font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(44px,6vw,68px);line-height:1;min-width:1.4em;text-align:center;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.qb{width:44px;height:44px;border-radius:12px;border:1px solid var(--line2);font-size:22px;line-height:1;display:grid;place-items:center;transition:all .2s}
.qb:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.05)}
.ptotal{text-align:right}
.pv{font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(28px,3.6vw,42px);line-height:1;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.pv small{font-size:.45em;letter-spacing:.08em}
.tube-h{position:relative;height:46px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 2px 10px rgba(0,0,0,.7)}
.th-fill{position:absolute;left:3px;top:3px;bottom:3px;width:calc(var(--w,0%) + 38px);max-width:calc(100% - 6px);border-radius:999px;background:var(--goldH);background-size:200% 100%;animation:flowx 7s linear infinite;box-shadow:0 0 22px -4px rgba(243,198,97,.7),inset 0 1px 0 rgba(255,255,255,.6);transition:width .45s var(--ease);overflow:hidden}
.th-wave{position:absolute;inset:0;background:radial-gradient(10px 5px at 50% 100%,rgba(255,255,255,.35),transparent 70%) 0 0/20px 100% repeat-x;opacity:.6;animation:wave 1.4s linear infinite;width:calc(100% + 24px)}
.mk{position:absolute;top:50%;left:calc(19px + (100% - 38px) * var(--p) / 100);width:2px;height:14px;margin:-7px 0 0 -1px;border-radius:2px;background:rgba(255,255,255,.35);pointer-events:none;z-index:1}
.tube-h input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:3;touch-action:pan-y}
.tube-ticks{position:relative;height:22px;margin:8px 19px 18px;font-family:"Archivo",sans-serif;font-size:12px;color:var(--mute)}
.tube-ticks span{position:absolute;transform:translateX(-50%)}
.tube-ticks span:first-child{left:0}.tube-ticks span:last-child{left:100%}
.prices{border-top:1px solid var(--line)}
.prices li{display:grid;grid-template-columns:minmax(0,1fr) auto 80px;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);color:var(--dim);transition:color .3s}
.prices li b{font-family:"Archivo",sans-serif;font-weight:700;font-size:15px;white-space:nowrap}
.prices li b small{font-family:var(--fb);font-weight:500;font-size:11px;color:var(--mute)}
.prices li em{font-style:normal;text-align:right;font-size:13px;font-family:"Archivo",sans-serif;white-space:nowrap}
.prices li.on{color:#e9ecef}
.prices li.on em{color:var(--g1)}
.pmax{font-size:12.5px;color:var(--mute);margin:14px 0 26px}
.pact{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.soon{font-size:13px;color:var(--mute)}
.demo{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px;padding-top:22px;border-top:1px dashed var(--line2)}
.demo small{font-size:12px;color:var(--dim)}

/* ===== supply ===== */
.sbar{display:flex;height:16px;border-radius:999px;overflow:hidden;gap:2px;margin-bottom:28px}
.sbar i{display:block;min-width:4px;height:100%}
.stable-w{overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--line2)}
.stable{width:100%;border-collapse:collapse;min-width:520px}
.stable th,.stable td{text-align:right;padding:16px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.stable th{font-size:12px;font-weight:500;color:var(--mute)}
.stable td{font-family:"Archivo",sans-serif;font-weight:600;font-size:15px}
.stable th:first-child,.stable td:first-child{text-align:left;padding-left:0}
.stable td:first-child>div{display:flex;align-items:center;gap:12px}
.stable td:first-child i{width:9px;height:9px;border-radius:50%;flex:none}
.stable td:first-child b{font-family:var(--fm);font-weight:800;font-size:16px;width:2.3em}
.stable td:first-child span{font-weight:700;letter-spacing:.1em;font-size:13px}
.stable tfoot td{color:var(--g1);border-bottom:0}

/* ===== roadmap ===== */
.drops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);position:relative}
.drops::before{content:"";position:absolute;left:0;right:0;top:27px;height:2px;background:linear-gradient(90deg,var(--g1),rgba(243,198,97,.15) 40%,var(--line2))}
.drops li{position:relative;padding-top:72px}
.drops li::before{content:"";position:absolute;left:4px;top:6px;width:42px;height:42px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:#0d0d10;border:1px solid var(--line2)}
.drops li.on::before{background:var(--gold);border-color:transparent;box-shadow:0 0 30px -4px rgba(243,198,97,.7)}
.ph{position:absolute;left:4px;top:6px;width:42px;height:42px;display:grid;place-items:center;font-family:"Archivo",sans-serif;font-weight:800;font-size:13px;z-index:1;color:var(--mute)}
.drops li.on .ph{color:#1b1306}
.drops h3{font-family:var(--fl);font-weight:800;font-size:clamp(19px,1.7vw,24px);line-height:1.3;margin-bottom:8px}
.drops p{color:#a9aeb5;font-size:15px}
.drops em{display:inline-block;margin-top:14px;font-style:normal;font-size:12px;font-weight:600;padding:5px 10px;border-radius:8px;border:1px solid var(--line2);color:var(--mute)}
.drops li.on em{color:var(--g1);border-color:rgba(243,198,97,.5)}
.lnk{display:block;margin-top:12px;font-size:13px;color:var(--g1);font-family:"Archivo",sans-serif;font-weight:600}

/* ===== faq ===== */
.qa{max-width:900px;border-top:1px solid var(--line2)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-weight:700;font-size:clamp(16px,1.4vw,19px)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(currentColor,currentColor) center/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 100% no-repeat;transition:transform .35s var(--ease);color:var(--g1)}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa details p{color:#aab0b7;padding:0 0 24px;max-width:46em;font-size:15.5px}

/* ===== footer ===== */
.ft{max-width:1464px;margin:clamp(100px,12vw,170px) auto 0;padding:0 var(--px) calc(30px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.ft-mark{display:flex;align-items:center;gap:clamp(12px,2vw,28px);padding:clamp(40px,6vw,80px) 0 clamp(30px,4vw,50px)}
.ft-mark img{height:calc((min(100vw,1464px) - 2 * var(--px)) * .1);width:auto;flex:none}
.ft-wm{font-family:"Archivo",sans-serif;font-weight:800;font-size:calc((min(100vw,1464px) - 2 * var(--px)) * .082);line-height:.9;letter-spacing:.02em;background:var(--chromeH);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flowx 14s linear infinite;white-space:nowrap}
.ft-row{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ft-row nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14px;color:#c4c8ce}
.ft-row nav a:hover,.totop:hover{color:#fff}
.totop{font-size:13px;color:var(--mute)}
.disc{font-size:12px;color:var(--dim);max-width:62em;margin-top:24px;line-height:1.8}
.cr{font-size:12px;color:var(--dim);margin-top:10px;font-family:"Archivo",sans-serif}

/* ===== modal ===== */
.modal{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.modal.on{opacity:1;visibility:visible}
.m-bg{position:absolute;inset:0;background:rgba(3,3,4,.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.m-box{position:relative;width:min(900px,100%);max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow:auto;border-radius:26px;background:linear-gradient(180deg,#121215,#0b0b0d);border:1px solid rgba(255,255,255,.14);padding:clamp(22px,3vw,40px);transform:translateY(20px) scale(.98);transition:transform .45s var(--ease);scrollbar-width:thin}
.modal.on .m-box{transform:none}
.m-x{position:absolute;right:14px;top:14px;width:40px;height:40px;border-radius:12px;border:1px solid var(--line2);z-index:5;background:rgba(10,10,12,.7)}
.m-x i{position:absolute;left:12px;right:12px;top:19px;height:1.5px;background:#fff;transform:rotate(45deg)}
.m-x i+i{transform:rotate(-45deg)}
.md{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(22px,3.4vw,44px);align-items:center}
.md .pc{max-width:340px;margin:0 auto;cursor:default}
.md .pc-meta{display:none}
.md-t{font-family:"Archivo",sans-serif;font-weight:800;font-size:12px;letter-spacing:.18em}
.md-t b{font-family:var(--fm);font-size:15px;margin-right:6px;letter-spacing:0}
.md h3{font-family:var(--fl);font-weight:800;font-size:clamp(24px,2.8vw,36px);line-height:1.2;margin:8px 0 4px;padding-right:40px}
.md .en{color:var(--mute);font-size:14px}
.md dl{margin-top:22px;border-top:1px solid var(--line)}
.md dl div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.md dt{color:var(--mute)}
.md dd{text-align:right;font-weight:600}
.md dd.big{font-family:"Archivo",sans-serif;font-weight:800;font-size:22px}
/* pull reveal */
.pull{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;padding-top:10px}
.flip{width:min(270px,62vw);aspect-ratio:245/342;perspective:1400px}
.flip-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1.1s var(--ease)}
.flip.go .flip-in{transform:rotateY(180deg)}
.flip.shake .flip-in{animation:shake .7s ease-in-out}
@keyframes shake{20%{transform:rotate(-3deg)}40%{transform:rotate(3deg)}60%{transform:rotate(-2deg)}80%{transform:rotate(1deg)}}
.flip .face{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.flip .front{transform:rotateY(180deg)}
.flip .front .pc-meta{display:none}
.back{border-radius:5.2%/3.8%;background:var(--chromeH);padding:5%;box-shadow:0 30px 60px -20px rgba(0,0,0,.9)}
.back-in{width:100%;height:100%;border-radius:4%/3%;background:radial-gradient(ellipse at 50% 40%,#1b1b20,#060607 75%);border:1.5px solid rgba(243,198,97,.65);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;position:relative;overflow:hidden}
.back-in::before{content:"鋳";position:absolute;font-family:var(--fm);font-weight:800;font-size:180%;opacity:.05;font-size:min(220px,50vw);line-height:1}
.back-in img{width:34%;height:auto;position:relative}
.back-in span{font-family:"Archivo",sans-serif;font-weight:800;letter-spacing:.24em;font-size:12px;position:relative;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.pull-info{opacity:0;transform:translateY(10px);transition:opacity .5s .9s,transform .5s .9s}
.flip.go+.pull-info{opacity:1;transform:none}
.pull-info .md-t{display:block;margin-bottom:6px}
.pull-info h3{font-family:var(--fl);font-weight:800;font-size:clamp(20px,2.4vw,28px);line-height:1.25}
.pull-info p{color:var(--mute);font-size:13.5px;margin-top:4px}
.pull-info .btn{margin-top:18px}

/* ===== responsive ===== */
@media (max-width:1180px){
  .hnav{display:none}
  .burger{display:block}
  .hr{margin-left:auto}
}
@media (max-width:1024px){
  .foundry{grid-template-columns:1fr}
  .td-c{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:860px){
  .hero{justify-content:flex-start;padding-top:calc(var(--hd) + 26px)}
  .hero-in{grid-template-columns:1fr;gap:10px;align-content:start}
  .hero-shade{background:linear-gradient(180deg,rgba(5,5,6,.6) 0%,rgba(5,5,6,.25) 40%,rgba(5,5,6,.2) 60%,var(--bg) 100%)}
  .vert{display:none}
  .fan{height:clamp(250px,66vw,360px);margin-top:8px}
  .fan .pc{width:clamp(120px,32vw,178px)}
  .stats{grid-template-columns:repeat(2,1fr);margin-top:14px}
  .stats div{padding:14px 0 16px 16px}
  .stats div:nth-child(3){border-left:0;padding-left:0}
  .stats div:nth-child(n+3){border-top:1px solid var(--line)}
  .md{grid-template-columns:1fr}
  .md .pc{max-width:230px}
  .drops{grid-template-columns:1fr;gap:0}
  .drops::before{left:26px;right:auto;top:20px;bottom:20px;width:2px;height:auto;background:linear-gradient(180deg,var(--g1),rgba(243,198,97,.15) 40%,var(--line2))}
  .drops li{padding:6px 0 34px 74px}
}
@media (max-width:640px){
  :root{--hd:62px}
  .sh{grid-template-columns:1fr}
  .num{grid-row:auto;font-size:54px;margin-bottom:6px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
  .grid .pc{contain-intrinsic-size:160px 320px}
  .pc-n{font-size:13.5px}
  .pc-p{font-size:14px}
  .td-s{grid-template-columns:repeat(3,minmax(0,1fr))}
  .td-s div:nth-child(n+4){border-top:1px solid var(--line)}
  .td-c{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .tube-l span{display:none}
  .tape-lbl{padding:0 14px 0 var(--px)}
  .ti{padding:14px 18px;font-size:13px}
  .pour{border-radius:22px}
  .pour-top{flex-direction:row}
  .prices li{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}
  .prices li em{grid-column:2;font-size:12px}
  .pact .btn.big{width:100%;min-width:0}
  .demo .btn{width:100%}
  .ft-mark{gap:10px}
  .btn{height:48px;padding:0 20px;font-size:14.5px}
  .ctas .btn{flex:1 1 auto}
}
@media (max-width:640px){
  .stable{min-width:0}
  .stable th,.stable td{padding:14px 6px;font-size:13.5px}
  .stable th{font-size:11px}
  .stable td:first-child span{display:none}
  .stable td:first-child>div{gap:8px}
}
@media (max-width:420px){
  .wm{display:none}
  .lang button{padding:8px 8px;font-size:11.5px}
  .hd{gap:10px}
}
@media (max-width:360px){
  .ctas{flex-direction:column}
  .stats dd{font-size:21px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .tape-win{overflow-x:auto}
}