/* styles carried over from the design prototype (design/App.template.html) */


a{color:#7C8BFF;text-decoration:none}a:hover{color:#A3AEFF}
button{font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
input{font-family:inherit}
input::placeholder{color:#5A5A66}
.scr{position:absolute;inset:0;display:flex;flex-direction:column;animation:in .42s cubic-bezier(.2,.8,.2,1) both}
.h1{font-family:'Unbounded',sans-serif;font-weight:600;letter-spacing:-0.02em}
.num{font-family:'Unbounded',sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-0.02em}
.muted{color:#8B8B98}
.row{display:flex;align-items:center;gap:12px}
.card{background:#121218;border-radius:22px}
.av{border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:'Unbounded',sans-serif;font-weight:600;font-size:13px;color:#FFFFFF;position:relative;box-shadow:inset 0 -5px 12px rgba(0,0,0,.32),inset 0 3px 6px rgba(255,255,255,.22),0 4px 14px rgba(0,0,0,.35);text-shadow:0 1px 2px rgba(0,0,0,.3)}
.av::after{content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.5) 0,rgba(255,255,255,.1) 26%,rgba(255,255,255,0) 50%)}
.btn{height:56px;border-radius:18px;border:0;color:#FFFFFF;font:600 17px 'Onest',sans-serif;display:flex;align-items:center;justify-content:center;gap:10px;transition:transform .16s cubic-bezier(.3,1.4,.5,1),filter .2s}
.btn:active,.press:active{transform:scale(.96)}
.btn:hover{filter:brightness(1.08)}
.press{transition:transform .16s cubic-bezier(.3,1.4,.5,1),background .25s}
.pri{background:#4E5FF5}
.buy{background:radial-gradient(130% 160% at 28% 12%,#9DFFC4 0%,#2BD877 30%,#0E9F4A 62%,#06612E 100%);font-size:19px;font-weight:700;text-shadow:0 1px 3px rgba(0,50,20,.55);box-shadow:inset 0 2px 5px rgba(255,255,255,.5),inset 0 -8px 16px rgba(0,50,20,.45),0 10px 28px rgba(34,212,107,.32)}
.buy:active{animation:jelly .55s cubic-bezier(.3,1.4,.5,1)}
.sell{background:radial-gradient(130% 160% at 28% 12%,#FFC2AE 0%,#FF6A3D 32%,#D93D1C 65%,#7A1D0A 100%) !important;box-shadow:inset 0 2px 5px rgba(255,255,255,.45),inset 0 -8px 16px rgba(70,15,0,.45),0 10px 28px rgba(255,91,46,.3)}
.sell:active{animation:jelly .55s cubic-bezier(.3,1.4,.5,1)}
.scr.noscroll>*{flex-shrink:0}
.noscroll{scrollbar-width:none}.noscroll::-webkit-scrollbar{display:none}
@keyframes jelly{0%{transform:scale(1)}30%{transform:scale(1.07,.9)}50%{transform:scale(.95,1.06)}70%{transform:scale(1.02,.98)}100%{transform:scale(1)}}
.sell{background:#E5482A;font-size:19px;font-weight:700}
.ghost{background:#1A1A22}
.ib{width:42px;height:42px;border-radius:50%;border:0;background:#16161D;color:#E4E4EA;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.skel{background:linear-gradient(90deg,#14141B 0%,#14141B 30%,#22222C 50%,#14141B 70%,#14141B 100%);background-size:260% 100%;animation:skel 1.4s ease-in-out infinite;border-radius:12px;flex-shrink:0}
@keyframes skel{0%{background-position:100% 0}100%{background-position:0 0}}
@keyframes ptrspin{to{transform:rotate(360deg)}}
.chip{height:36px;padding:0 15px;border-radius:18px;border:0;background:#16161D;color:#B9B9C4;font:600 14px 'Onest',sans-serif;transition:background .25s,color .25s,transform .16s;white-space:nowrap}
.chip:active{transform:scale(.94)}
.chip.on{background:#F5F5F7;color:#07070B}
.tg{width:52px;height:32px;border-radius:16px;border:0;padding:3px;background:#2A2A33;transition:background .3s;flex-shrink:0;display:flex}
.tg i{display:block;width:26px;height:26px;border-radius:50%;background:#FFFFFF;box-shadow:0 2px 6px rgba(0,0,0,.4);transition:transform .38s cubic-bezier(.3,1.5,.5,1)}
.tg.on{background:#22D46B}
.tg.on i{transform:translateX(20px)}
.seg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:14px;background:#16161D}
.seg b{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:11px;transition:transform .38s cubic-bezier(.3,1.3,.5,1),background .3s}
.seg button{position:relative;height:36px;border:0;background:none;font:600 15px 'Onest',sans-serif;transition:color .3s}
.sheetbg{position:absolute;inset:0;border:0;background:rgba(0,0,0,.6);animation:fade .25s both}
.sheet{position:absolute;left:0;right:0;bottom:0;background:#121218;border-radius:30px 30px 0 0;padding:10px 20px 34px;display:flex;flex-direction:column;animation:up .45s cubic-bezier(.2,.9,.2,1) both}
.grab{align-self:center;width:40px;height:5px;border-radius:3px;background:#2E2E38;margin-bottom:14px}
.toast{position:absolute;top:14px;left:16px;right:16px;z-index:5;display:flex;align-items:center;gap:10px;padding:14px 16px;border-radius:18px;background:#1C1C24;border:1px solid #2A2A33;font:600 15px 'Onest',sans-serif;box-shadow:0 12px 30px rgba(0,0,0,.5);animation:drop .45s cubic-bezier(.2,1.3,.4,1) both}
.pop{animation:pop .55s cubic-bezier(.3,1.6,.5,1) both}
.spin{animation:spin 1.1s linear infinite;transform-origin:center}
.step{animation:in .45s cubic-bezier(.2,.8,.2,1) both}
.grow{transform-origin:bottom;animation:grow .8s cubic-bezier(.2,.8,.2,1) both}
.fillbar{animation:fillw 1.3s cubic-bezier(.2,.8,.2,1) .35s both}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.3s cubic-bezier(.4,0,.2,1) .1s forwards}
.float{animation:float 6s ease-in-out infinite}
.pulse{animation:pulse 1.6s ease-out infinite}
.conf{position:absolute;top:-24px;width:8px;height:14px;border-radius:2px;animation:conf 2.2s cubic-bezier(.2,.6,.4,1) both}
.tabind{transition:transform .45s cubic-bezier(.3,1.3,.5,1)}
.scrollx{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:0 20px}
.scrollx::-webkit-scrollbar{display:none}
.liquid{animation:hue 14s ease-in-out infinite}
.orbA{animation:orbA 11s ease-in-out infinite}
.orbB{animation:orbB 12s ease-in-out infinite}
.orbC{animation:orbC 13s ease-in-out infinite}
.orbD{animation:orbD 14s ease-in-out infinite}
.orbE{animation:orbE 9s ease-in-out infinite}
@keyframes hue{0%,100%{filter:hue-rotate(0deg) saturate(1.1)}50%{filter:hue-rotate(28deg) saturate(1.35)}}
@keyframes orbA{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-30px,34px) scale(1.06)}66%{transform:translate(32px,-24px) scale(.95)}}
@keyframes orbB{0%,100%{transform:translate(0,0)}35%{transform:translate(96px,86px)}70%{transform:translate(20px,150px)}}
@keyframes orbC{0%,100%{transform:translate(0,0)}40%{transform:translate(-110px,70px)}75%{transform:translate(-30px,160px)}}
@keyframes orbD{0%,100%{transform:translate(0,0)}40%{transform:translate(-120px,-100px)}70%{transform:translate(-200px,-10px)}}
@keyframes orbE{0%,100%{transform:translate(0,0)}50%{transform:translate(110px,-130px)}}
.shine{position:relative;overflow:hidden}
.shine::after{content:'';position:absolute;top:0;bottom:0;left:-90px;width:70px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-20deg);animation:shine 3.2s ease-in-out infinite}
.flow{background-size:220% 220% !important;animation:flow 6s ease-in-out infinite}
@keyframes shine{0%{left:-90px}55%,100%{left:120%}}
@keyframes flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.glowA{animation:glowA 14s ease-in-out infinite}
.glowB{animation:glowB 18s ease-in-out infinite}
@keyframes glowA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-40px,30px) scale(1.15)}}
@keyframes glowB{0%,100%{transform:translate(0,0)}50%{transform:translate(50px,-20px)}}
.hA{animation:hA 12s ease-in-out infinite}
.hB{animation:hB 9s ease-in-out infinite}
.hC{animation:hC 10s ease-in-out infinite}
@keyframes hA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-14px,10px) scale(1.06)}}
@keyframes hB{0%,100%{transform:translate(0,0)}50%{transform:translate(34px,-22px)}}
@keyframes hC{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,30px)}}
.liq{position:relative;overflow:hidden;isolation:isolate;transition:color .35s,transform .16s cubic-bezier(.3,1.4,.5,1)}
.liq::before{content:'';position:absolute;z-index:-1;left:50%;top:115%;width:170%;aspect-ratio:1;border-radius:43% 57% 48% 52%;background:var(--lg,#4E5FF5);transform:translateX(-50%) rotate(0deg);transition:top .6s cubic-bezier(.3,1.25,.4,1)}
.liq:hover::before,.liq:focus-visible::before{top:-35%;animation:wob 2.6s linear infinite}
.liq:hover,.liq:focus-visible{color:var(--lf,#FFFFFF) !important}
.liq:active{transform:scale(.94)}
@keyframes wob{to{transform:translateX(-50%) rotate(360deg)}}
.sk-shake{animation:skShake .5s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 90%}
.sk-bob{animation:skBob 1.6s ease-in-out infinite}
.sk-spin{animation:spin 7s linear infinite;transform-box:fill-box;transform-origin:center}
.sk-steam{animation:skSteam 1.6s ease-in-out infinite}
.sk-squeeze{animation:skSq 1.1s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.sk-glint{animation:skGlint 1.8s ease-in-out infinite}
.sk-beat{animation:skBeat .9s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.sk-sway{animation:skSway 2s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.sk-rise{animation:skRise 1.3s ease-in-out infinite}
.sk-fall{animation:skFall 1.3s ease-in-out infinite}
.sk-tear{animation:skTear 1.2s ease-in infinite}
.sk-fly{animation:skFly 1.8s ease-in-out infinite}
.sk-flame{animation:skFlame .22s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 0}
.sk-slide{animation:skSlide 1.8s ease-in-out infinite}
@keyframes skShake{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@keyframes skBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes skSteam{0%{opacity:0;transform:translateY(4px)}50%{opacity:1}100%{opacity:0;transform:translateY(-6px)}}
@keyframes skSq{0%,100%{transform:scale(1,1)}50%{transform:scale(1.05,.94)}}
@keyframes skGlint{0%,100%{filter:brightness(1)}50%{filter:brightness(1.6)}}
@keyframes skBeat{0%,100%{transform:scale(1)}30%{transform:scale(1.2)}}
@keyframes skSway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes skRise{0%,100%{transform:translate(0,0)}50%{transform:translate(4px,-6px)}}
@keyframes skFall{0%,100%{transform:translate(0,0)}50%{transform:translate(4px,6px)}}
@keyframes skTear{0%{transform:translateY(0);opacity:1}100%{transform:translateY(18px);opacity:0}}
@keyframes skFly{0%,100%{transform:translateY(4px)}50%{transform:translateY(-7px)}}
@keyframes skFlame{to{transform:scaleY(1.4)}}
@keyframes skSlide{0%,40%{transform:translateX(0)}70%{transform:translateX(18px)}100%{transform:translateX(0)}}
.rxb{transition:transform .2s cubic-bezier(.3,1.6,.5,1)}.rxb:hover{transform:scale(1.25) translateY(-3px)}
.numk{transition:background .2s,transform .15s cubic-bezier(.3,1.5,.5,1)}.numk:hover{background:#16161D !important}.numk:active{transform:scale(.88);background:#1F1F28 !important}
.shimmer{background:linear-gradient(90deg,#6E6E7A 0%,#F5F5F7 50%,#6E6E7A 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent !important;animation:shim 2.2s linear infinite}
@keyframes shim{from{background-position:100% 0}to{background-position:-100% 0}}
@keyframes in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}}
@keyframes up{from{transform:translateY(100%)}to{transform:none}}
@keyframes drop{from{opacity:0;transform:translateY(-120%)}to{opacity:1;transform:none}}
@keyframes pop{0%{opacity:0;transform:scale(.4)}100%{opacity:1;transform:scale(1)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes grow{from{transform:scaleY(0)}}
@keyframes fillw{from{width:0}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,91,46,.6)}100%{box-shadow:0 0 0 10px rgba(255,91,46,0)}}
@keyframes rise{0%{transform:translateY(0) scale(.5);opacity:0}12%{opacity:1}100%{transform:translateY(-230px) translateX(var(--dx,0px)) scale(1.1);opacity:0}}
@keyframes eq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
@keyframes ringp{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.5);opacity:0}}
.lvf{position:absolute;bottom:20px;animation:rise 2.6s cubic-bezier(.3,.6,.4,1) infinite both;pointer-events:none}
.eqb{display:block;width:4px;border-radius:2px;background:#fff;transform-origin:bottom;animation:eq .9s ease-in-out infinite}
@keyframes nftspin{from{transform:rotateY(0deg)}to{transform:rotateY(360deg)}}
@keyframes holo{from{background-position:160% 0}to{background-position:-80% 0}}
@keyframes nftshadow{0%,50%,100%{transform:scaleX(1);opacity:.55}25%,75%{transform:scaleX(.35);opacity:.3}}
@keyframes stamp{0%{transform:scale(2.4) rotate(-14deg);opacity:0}60%{transform:scale(.92) rotate(-14deg);opacity:1}100%{transform:scale(1) rotate(-14deg);opacity:1}}
.nft3d{transform-style:preserve-3d;animation:nftspin 9s linear infinite}
.nftface{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.holo{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 47%,rgba(160,220,255,.35) 52%,transparent 62%);background-size:260% 100%;animation:holo 3.2s linear infinite;mix-blend-mode:overlay;pointer-events:none}
@keyframes wA{0%{transform:translate(0,0)}20%{transform:translate(-90px,-70px)}45%{transform:translate(70px,-120px)}70%{transform:translate(90px,80px)}100%{transform:translate(-80px,90px)}}
@keyframes wB{0%{transform:translate(0,0)}25%{transform:translate(190px,60px)}50%{transform:translate(110px,230px)}75%{transform:translate(0,150px)}100%{transform:translate(200px,10px)}}
@keyframes wC{0%{transform:translate(0,0)}22%{transform:translate(-170px,120px)}50%{transform:translate(-50px,250px)}78%{transform:translate(-210px,30px)}100%{transform:translate(-20px,190px)}}
@keyframes wD{0%{transform:translate(0,0)}30%{transform:translate(-180px,-60px)}55%{transform:translate(-40px,-230px)}80%{transform:translate(-200px,-170px)}100%{transform:translate(20px,-100px)}}
@keyframes wP{0%{transform:translate(0,0)}50%{transform:translate(40px,-60px)}100%{transform:translate(-30px,-20px)}}
@keyframes bob{0%,100%{transform:scale(1,1)}50%{transform:scale(1.05,.95)}}
.bub{position:absolute;border-radius:50%;mix-blend-mode:screen;display:flex;align-items:center;justify-content:center;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}
.bub>i{position:absolute;inset:0;border-radius:50%;animation:bob 4s ease-in-out infinite}
.bub>i::after{content:'';position:absolute;left:18%;top:12%;width:34%;height:22%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.85),rgba(255,255,255,0));transform:rotate(-24deg)}
.bub>svg{position:relative}
@keyframes tapHand{0%{opacity:0;transform:translate(46px,54px) rotate(-10deg)}34%{opacity:.8;transform:translate(0,0) rotate(-10deg)}44%{opacity:.8;transform:translate(-1px,3px) scale(.86) rotate(-10deg)}54%{opacity:.8;transform:translate(0,0) scale(1) rotate(-10deg)}100%{opacity:0;transform:translate(34px,46px) rotate(-10deg)}}
@keyframes tapBub{0%{opacity:0;transform:scale(.3)}28%{opacity:.9;transform:scale(1)}43%{opacity:.9;transform:scale(1.08,.9)}49%{opacity:0;transform:scale(1.8)}100%{opacity:0;transform:scale(1.8)}}
@keyframes tapDrop{0%,45%{opacity:0;transform:translate(0,0) scale(1)}51%{opacity:.9}100%{opacity:0;transform:translate(var(--tx),var(--ty)) scale(.4)}}
@keyframes tapWord{0%,44%{text-shadow:none;color:#9A9AA6}52%{color:#FFFFFF;text-shadow:0 0 18px rgba(159,170,255,.95)}100%{text-shadow:none;color:#9A9AA6}}
.tap1{animation-duration:2.4s;animation-delay:1s;animation-iteration-count:1;animation-fill-mode:both;animation-timing-function:cubic-bezier(.3,.7,.3,1)}
@keyframes fdA{0%,100%{box-shadow:inset 0 0 0 0 transparent;background:#101016}12%,40%,68%{box-shadow:inset 0 0 0 2px #22D46B,0 0 26px rgba(34,212,107,.5);background:#0F2418}26%,54%,82%{box-shadow:inset 0 0 0 1px rgba(34,212,107,.35);background:#101016}}
@keyframes fdB{0%,100%{box-shadow:inset 0 0 0 0 transparent;background:#101016}12%,40%,68%{box-shadow:inset 0 0 0 2px #22D46B,0 0 26px rgba(34,212,107,.5);background:#0F2418}26%,54%,82%{box-shadow:inset 0 0 0 1px rgba(34,212,107,.35);background:#101016}}
@keyframes faA{0%,100%{box-shadow:inset 0 0 0 0 transparent;background:#101016}12%,40%,68%{box-shadow:inset 0 0 0 2px #FFB020,0 0 26px rgba(255,176,32,.5);background:#1C170A}26%,54%,82%{box-shadow:inset 0 0 0 1px rgba(255,176,32,.35);background:#101016}}
@keyframes faB{0%,100%{box-shadow:inset 0 0 0 0 transparent;background:#101016}12%,40%,68%{box-shadow:inset 0 0 0 2px #FFB020,0 0 26px rgba(255,176,32,.5);background:#1C170A}26%,54%,82%{box-shadow:inset 0 0 0 1px rgba(255,176,32,.35);background:#101016}}
@keyframes fnA{0%,100%{box-shadow:inset 0 0 0 0 transparent;background:#101016}12%,40%,68%{box-shadow:inset 0 0 0 2px #9FAAFF,0 0 26px rgba(159,170,255,.5);background:#141833}26%,54%,82%{box-shadow:inset 0 0 0 1px rgba(159,170,255,.35);background:#101016}}
@keyframes fnB{0%,100%{box-shadow:inset 0 0 0 0 transparent;background:#101016}12%,40%,68%{box-shadow:inset 0 0 0 2px #9FAAFF,0 0 26px rgba(159,170,255,.5);background:#141833}26%,54%,82%{box-shadow:inset 0 0 0 1px rgba(159,170,255,.35);background:#101016}}
@keyframes flTag{0%{opacity:0;transform:scale(.6)}15%{opacity:1;transform:scale(1.08)}25%{transform:scale(1)}85%{opacity:1}100%{opacity:0}}
@keyframes conf{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(560px) rotate(620deg);opacity:0}}