html{font-size:min(2.3529vw,10.1176px);-webkit-text-size-adjust:100%}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
body{background:#e6f6ec;font-family:Roboto,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#0d1f14;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
svg{display:block}
.app{position:relative;width:42.5rem;margin:0 auto;min-height:100vh;padding:calc(1.1rem + env(safe-area-inset-top)) 1.4rem calc(8rem + env(safe-area-inset-bottom));background:linear-gradient(180deg,#e2f5e9 0,#f1faf4 42%,#e6f6ec 100%);overflow-x:hidden}
.abs{position:absolute}


/* ===== inner pages (market / coin) ===== */
.ih{position:relative;display:flex;align-items:center;justify-content:space-between;height:4.6rem;margin-top:.2rem}
.ih h1{position:absolute;left:0;right:0;text-align:center;font-size:1.9rem;font-weight:700;letter-spacing:-.02rem;pointer-events:none}
.back{position:relative;z-index:1;width:3.8rem;height:3.8rem;border-radius:50%;background:#fff;box-shadow:0 .15rem .6rem rgba(20,90,50,.12);display:grid;place-items:center}
.back svg{width:1.7rem;height:1.7rem}
.livep{position:relative;z-index:1;display:flex;align-items:center;gap:.6rem;height:3.2rem;padding:0 1.3rem;border-radius:1.6rem;background:#fff;box-shadow:0 .15rem .6rem rgba(20,90,50,.12);font-size:1.15rem;font-weight:500;color:#0b7a35}
.livep i{width:.8rem;height:.8rem;border-radius:50%;background:#22c55e;animation:lv 1.6s infinite}
@keyframes lv{0%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}70%,100%{box-shadow:0 0 0 .8rem rgba(34,197,94,0)}}

.hero{position:relative;margin-top:1.4rem;border-radius:1.8rem;overflow:hidden;color:#fff;background:radial-gradient(ellipse at 88% 20%,rgba(70,205,95,.75) 0,rgba(70,205,95,0) 42%),radial-gradient(ellipse at 96% 100%,rgba(15,210,50,.8) 0,rgba(15,210,50,0) 30%),linear-gradient(100deg,#003b1d 0,#024a21 30%,#06672a 62%,#0b8a34 100%);box-shadow:0 .5rem 1.1rem rgba(6,80,31,.2)}
.mh{height:13rem;padding:1.9rem 1.9rem}
.mh h2{font-size:2rem;line-height:2.4rem;font-weight:700}
.mh p{margin-top:.5rem;font-size:1.1rem;color:rgba(255,255,255,.85)}
.mhs{display:flex;gap:.9rem;margin-top:1.5rem}
.mhs div{min-width:8.6rem;padding:.8rem 1.1rem;border-radius:1.2rem;background:rgba(255,255,255,.14);backdrop-filter:blur(4px)}
.mhs b{display:block;font-size:2rem;line-height:2.2rem}
.mhs span{font-size:1.05rem}
.mhs .u span{color:#6df09a}.mhs .d span{color:#ffadad}
.hi{position:absolute;right:.5rem;bottom:.2rem;height:10.6rem;aspect-ratio:800/541;pointer-events:none;filter:drop-shadow(0 0 1rem rgba(110,255,150,.3))}
.hi img{width:100%;height:100%;object-fit:contain;display:block}

.srch{position:relative;display:block;margin-top:1.8rem}
.srch svg{position:absolute;left:1.5rem;top:50%;width:1.8rem;height:1.8rem;transform:translateY(-50%)}
.srch input{width:100%;height:4.4rem;border:0;outline:0;border-radius:2.2rem;padding:0 1.6rem 0 4.5rem;background:#fff;box-shadow:0 .15rem .6rem rgba(20,90,50,.08);font:inherit;font-size:1.3rem;color:#0d1f14}
.tabs{display:flex;gap:.8rem;margin-top:1.2rem}
.tabs button{height:3.4rem;padding:0 1.9rem;border-radius:1.7rem;background:rgba(255,255,255,.85);font-size:1.2rem;font-weight:500;color:#26332b;box-shadow:0 .1rem .4rem rgba(20,90,50,.06)}
.tabs button.on{background:#0b7a35;color:#fff}

/* coin cards */
.cl{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.2rem}
.cc{position:relative;border-radius:1.6rem;background:rgba(255,255,255,.92);box-shadow:0 .15rem .6rem rgba(20,90,50,.07);padding:1.5rem 1.5rem 1.4rem;overflow:hidden}
.cc.hide{display:none}
.cov{position:absolute;inset:0;z-index:1}
.ct{display:flex;align-items:center;gap:1.2rem}
.ci{width:4.2rem;height:4.2rem;flex:none;display:grid;place-items:center}
.ci svg{width:100%;height:100%}
.cc .ci{width:4.6rem;height:4.6rem;border-radius:50%;background:#fff;box-shadow:0 .2rem .7rem rgba(20,90,50,.16),0 0 0 .25rem rgba(18,161,74,.08)}
.cc .ci svg{border-radius:50%}
.cc .ci-eth svg,.cc .ci-sol svg{padding:.9rem}
.cc .ci-eth svg{padding:.8rem 1.15rem}
.cn2{flex:1;min-width:0}
.cn2 b{display:block;font-size:1.6rem;line-height:1.9rem}
.cn2 small{font-size:1.05rem;color:#5a6a60}
.cpz{text-align:right}
.cp{font-size:1.7rem;font-weight:700;line-height:2rem;transition:color .5s}
.cp.fu,.px.fu{color:#12a14a}.cp.fd,.px.fd{color:#ef4444}
.cu{margin-top:.5rem;display:inline-flex;align-items:center;gap:.5rem;padding:.3rem .9rem;border-radius:1rem;background:rgba(18,161,74,.12);color:#12a14a;font-size:1.1rem;font-weight:700}
.cu:before{content:"";border:.35rem solid transparent;border-top:0;border-bottom:.55rem solid currentColor}
.cu.dn{background:rgba(239,68,68,.12);color:#ef4444}
.cu.dn:before{border-bottom:0;border-top:.55rem solid currentColor}
.cs{position:relative;height:5.4rem;margin:1.2rem 0 1rem;border-radius:.8rem}
.cs svg{width:100%;height:100%;overflow:visible}
.cb{display:flex;align-items:center;gap:1.5rem;padding-top:1.2rem;border-top:.07rem solid #e4ede7}
.ii{display:flex;align-items:center;gap:.8rem}
.ii svg{width:2rem;height:2rem;flex:none}
.ii small{display:block;font-size:.98rem;line-height:1.2rem;color:#5a6a60}
.ii b{display:block;font-size:1.25rem;line-height:1.6rem}
.inv{position:relative;z-index:2;margin-left:auto;height:3.9rem;padding:0 1.8rem;border-radius:1.2rem;background:linear-gradient(180deg,#0e7f38,#075c24);color:#fff;font-size:1.25rem;font-weight:500;display:flex;align-items:center;gap:.7rem;box-shadow:0 .3rem .8rem rgba(8,100,40,.25)}
.inv svg{width:1.2rem;height:1.2rem}
.empty{display:none;margin-top:3rem;text-align:center;font-size:1.3rem;color:#5a6a60}

/* daily profit strip */
.dp{display:flex;align-items:center;gap:1rem;margin-bottom:1.2rem;padding:.9rem 1.2rem;border-radius:1.3rem;background:linear-gradient(100deg,#e3f8ea,#f1fbf4);border:.07rem solid rgba(18,161,74,.22)}
.dpi{width:3.2rem;height:3.2rem;flex:none;border-radius:50%;background:linear-gradient(180deg,#16a34a,#0a6a2b);display:grid;place-items:center;box-shadow:0 .2rem .6rem rgba(8,100,40,.3)}
.dpi svg{width:1.7rem;height:1.7rem}
.dpt small{display:block;font-size:.98rem;line-height:1.2rem;color:#4b6a57}
.dpt b{display:block;font-size:1.65rem;line-height:2rem;color:#0b7a35;font-weight:700}
.dpr{margin-left:auto;padding:.4rem 1rem;border-radius:1rem;background:#0b7a35;color:#fff;font-size:1.05rem;font-weight:700;white-space:nowrap}

/* live dot at end of charts */
.ld{position:absolute;right:0;width:.7rem;height:.7rem;border-radius:50%;border:.14rem solid #fff;background:currentColor;transform:translate(50%,-50%)}
.ld:after{content:"";position:absolute;inset:-.15rem;border-radius:50%;background:currentColor;opacity:.45;animation:ldp 1.6s ease-out infinite}
@keyframes ldp{to{transform:scale(3.2);opacity:0}}

/* coin page */
.sc{margin-top:1.4rem;border-radius:1.6rem;background:rgba(255,255,255,.92);box-shadow:0 .15rem .6rem rgba(20,90,50,.07);padding:1.7rem 1.6rem}
.sc h2{font-size:1.5rem;font-weight:700;display:flex;align-items:center;gap:.9rem;line-height:1.9rem}
.sc h2 svg{width:1.8rem;height:1.8rem;flex:none}
.ch{padding:2rem 2rem 1.9rem}
.ch .top{display:flex;align-items:center;gap:1.4rem}
.ch .ci{width:5.2rem;height:5.2rem;border-radius:50%;background:#fff;padding:.8rem;box-shadow:0 .2rem .8rem rgba(0,0,0,.15)}
.ch .nm b{display:block;font-size:1.9rem;line-height:2.3rem}
.ch .nm small{font-size:1.1rem;opacity:.85}
.ch .cat{margin-left:auto;align-self:flex-start;padding:.45rem 1.1rem;border-radius:1.2rem;background:rgba(255,255,255,.16);font-size:1rem}
.px{margin-top:1.7rem;font-size:3.7rem;line-height:4.2rem;font-weight:700;letter-spacing:.02rem;transition:color .5s}
.hero .px.fu{color:#7dffa6}.hero .px.fd{color:#ffa0a0}
.pill{margin-top:.9rem;display:inline-flex;align-items:center;gap:.7rem;padding:.55rem 1.3rem;border-radius:1.4rem;background:rgba(255,255,255,.16);font-size:1.3rem;font-weight:700;color:#7dffa6}
.pill:before{content:"";border:.4rem solid transparent;border-top:0;border-bottom:.65rem solid currentColor}
.pill.dn{color:#ffadad}.pill.dn:before{border-bottom:0;border-top:.65rem solid currentColor}
.pill small{font-size:1rem;font-weight:500;color:rgba(255,255,255,.8)}
.ab{margin-top:1.1rem;font-size:1.22rem;line-height:1.9rem;color:#33443a}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem}
.facts div,.stg div{border-radius:1.2rem;background:#f1f9f4;padding:1.1rem 1.3rem}
.facts small,.stg small{display:block;font-size:1rem;color:#5a6a60}
.facts b,.stg b{display:block;margin-top:.3rem;font-size:1.3rem}
.lvh{display:flex;align-items:center;justify-content:space-between}
.lvh .livep{height:2.8rem;box-shadow:none;background:#eef8f1}
.tf{display:flex;gap:.7rem;margin-top:1.4rem}
.tf button{flex:1;height:3.4rem;border-radius:1.1rem;background:#eef7f1;font-size:1.2rem;font-weight:500;color:#26332b}
.tf button.on{background:#0b7a35;color:#fff}
.pch{margin-top:1.3rem;font-size:1.15rem;color:#5a6a60}
.pch b{font-weight:700}.pch b.up{color:#12a14a}.pch b.dn{color:#ef4444}
.chw{position:relative;margin-top:.8rem}
.chc{position:relative;height:18rem;touch-action:pan-y;cursor:crosshair;background-image:linear-gradient(#e6efe9 .07rem,transparent .07rem);background-size:100% 25%;border-bottom:.07rem solid #e6efe9}
.chc svg{width:100%;height:100%}
.chc.busy:before{content:"Loading…";position:absolute;inset:0;display:grid;place-items:center;font-size:1.2rem;color:#6b7a70;background:rgba(255,255,255,.7);z-index:2}
.cmx,.cmn{position:absolute;left:0;z-index:1;font-size:1rem;color:#4b5c52;background:rgba(255,255,255,.8);padding:.1rem .5rem;border-radius:.5rem}
.cmx{top:0}.cmn{bottom:.4rem}
.xh{position:absolute;top:0;bottom:0;width:.1rem;background:#8fa699;display:none;pointer-events:none}
.xd{position:absolute;width:1rem;height:1rem;border-radius:50%;background:#0b7a35;border:.2rem solid #fff;box-shadow:0 .1rem .4rem rgba(0,0,0,.3);transform:translate(-50%,-50%);display:none;pointer-events:none}
.tip{position:absolute;top:0;padding:.6rem 1rem;border-radius:1rem;background:#0a3d1f;color:#fff;font-size:1.05rem;line-height:1.4rem;white-space:nowrap;display:none;pointer-events:none;z-index:3;text-align:center}
.tip small{display:block;font-size:.9rem;opacity:.75}
.cx{display:flex;justify-content:space-between;margin-top:.9rem;font-size:1rem;color:#6b7a70}
.stg{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.6rem}
.pr3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem}
.pr3 div{border-radius:1.2rem;background:#f1f9f4;padding:1.2rem .9rem;text-align:center}
.pr3 svg{width:2.2rem;height:2.2rem;margin:0 auto .6rem}
.pr3 small{display:block;font-size:1rem;color:#5a6a60}
.pr3 b{display:block;margin-top:.3rem;font-size:1.4rem}
.pr3 .g b{color:#0d8a3b}
.big{margin-top:1.5rem;height:5rem;border-radius:1.4rem;background:linear-gradient(180deg,#0e7f38,#075c24);color:#fff;font-size:1.5rem;font-weight:500;display:flex;align-items:center;justify-content:center;gap:.8rem;box-shadow:0 .4rem 1rem rgba(8,100,40,.28)}
.big svg{width:1.5rem;height:1.5rem}

/* nav */
.nv{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:42.5rem;height:calc(6.1rem + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);border-radius:1.8rem 1.8rem 0 0;background:#fff;box-shadow:0 -.3rem 1.2rem rgba(20,90,50,.1);display:grid;grid-template-columns:9.8rem 7rem 8.9rem 7.6rem 9.2rem;z-index:20}
.nv .t{position:relative;height:6.1rem;display:flex;flex-direction:column;align-items:center;padding-top:3.5rem;font-size:.93rem;line-height:1.2rem;color:#55635a}
.nv .t svg{position:absolute;left:50%;transform:translateX(-50%)}
.nv .t:nth-child(1) svg{width:2rem;height:2.25rem;top:.87rem}
.nv .t:nth-child(2) svg{width:1.92rem;height:1.98rem;top:.97rem}
.nv .t:nth-child(4) svg{width:2.17rem;height:2.25rem;top:.8rem}
.nv .t:nth-child(5) svg{width:1.94rem;height:2.1rem;top:.89rem}
.nv .t.on{color:#0b7a35;font-weight:500}
.nv .t.on:after{content:"";position:absolute;top:5.2rem;left:50%;width:5.6rem;height:.15rem;margin-left:-2.8rem;border-radius:.1rem;background:#0b7a35}
.fab{position:absolute;left:50%;top:-.9rem;width:5.5rem;height:5.5rem;margin-left:-2.75rem;border-radius:50%;background:radial-gradient(circle at 35% 28%,#1aa650,#0a6a2b);box-shadow:0 .5rem 1.2rem rgba(8,100,40,.35),0 0 0 .35rem rgba(255,255,255,.75);display:grid;place-items:center}
.fab svg{width:2.8rem;height:2.8rem}
