body{font-family:'Inter','SF Pro Display',sans-serif;background:#0f0f1a;color:#d0d0e0;overflow-x:hidden}
.nv{display:flex;align-items:center;justify-content:space-between;padding:16px 5%;background:rgba(15,15,26,.9);backdrop-filter:blur(20px);position:sticky;top:0;z-index:20}
.nv-l{display:flex;align-items:center;gap:10px}.nv-i{width:30px;height:30px;background:#2d2d44;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#f0ece8;font-weight:700;font-size:12px}
.nv-t{font-weight:600;font-size:14px;color:#f0ece8;letter-spacing:1px}
.nv-ln{display:flex;gap:20px}.nv-ln a{color:rgba(255,255,255,.2);font-size:11px;text-decoration:none;transition:color .3s}.nv-ln a:hover,.nv-ln a.act{color:#fff}
.nv-r{background:#2d2d44;color:#f0ece8;border:none;padding:7px 18px;font-size:10px;font-weight:600;text-decoration:none;border-radius:6px;display:inline-block}
.bento{max-width:1100px;margin:0 auto;padding:0 5%}
.hero-b{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:40px 0 32px}
.hero-b .main{grid-column:1;padding:32px 24px;background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:16px;display:flex;flex-direction:column;justify-content:center}
.hero-b .main .bd{font-size:8px;color:rgba(255,255,255,.2);letter-spacing:3px;text-transform:uppercase;margin-bottom:8px}
.hero-b .main h1{font-size:32px;font-weight:700;color:#f0ece8;margin-bottom:6px}.hero-b .main h1 span{color:#7c83db}
.hero-b .main p{font-size:12px;color:rgba(255,255,255,.15);margin-bottom:16px;max-width:360px}
.hero-b .main .bt{display:flex;gap:8px}.hero-b .main .bt a{padding:8px 22px;border-radius:8px;font-size:11px;font-weight:600;text-decoration:none;display:inline-block}
.hero-b .main .b1{background:#7c83db;color:#fff}.hero-b .main .b2{background:rgba(255,255,255,.04);color:rgba(255,255,255,.4);border:1px solid rgba(255,255,255,.06)}
.hero-b .side{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hero-b .side .c{padding:20px 16px;background:#1a1a2e;border-radius:16px;text-align:center}
.hero-b .side .sym{font-size:8px;color:rgba(255,255,255,.15);text-transform:uppercase}.hero-b .side .pr{font-size:20px;font-weight:700;color:#f0ece8;margin:4px 0}
.hero-b .side .up{color:#4ade80;font-size:11px}.hero-b .side .dn{color:#f87171;font-size:11px}
.hero-b .side .bar{height:3px;background:rgba(255,255,255,.04);margin-top:8px}.hero-b .side .bar .f{height:100%;background:#4ade80}
.bg,.bg-2{display:grid;gap:12px;margin-bottom:12px}
.bg{grid-template-columns:2fr 1fr 1fr}.bg-2{grid-template-columns:1fr 1fr 2fr}
.b-c{background:#1a1a2e;border-radius:16px;padding:20px}
.b-c .tt{font-size:8px;color:rgba(255,255,255,.15);text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;font-weight:600}
.b-c .v-lg{font-size:28px;font-weight:700;color:#f0ece8}.b-c .l{font-size:9px;color:rgba(255,255,255,.15)}
.rw{display:flex;justify-content:space-between;padding:5px 0;font-size:10px;border-bottom:1px solid rgba(255,255,255,.03);color:rgba(255,255,255,.25)}
.ni{display:block;padding:12px 14px;background:#1a1a2e;border-radius:12px;text-decoration:none;color:inherit;margin-bottom:6px}
.ni:hover{background:#22223a}.ni .t{font-size:12px;font-weight:600;color:#f0ece8;display:flex;justify-content:space-between;margin-bottom:2px}
.ni .tg{font-size:7px;padding:1px 8px;background:rgba(124,131,219,.1);color:#7c83db;border-radius:4px}.ni .s{font-size:9px;color:rgba(255,255,255,.12)}
.artp,.art-h1,.ab,.art-b,.art-m,.art-cta,.art-rec,.art-cta a{font-family:'Inter','SF Pro Display',sans-serif}
.artp{max-width:700px;margin:0 auto;padding:32px 20px 40px}
.art-b{font-size:10px;color:#7c83db;display:inline-block;margin-bottom:14px;text-decoration:none}.art-b::before{content:"← "}
.art-h1{font-size:22px;font-weight:700;color:#f0ece8;margin-bottom:4px}
.art-m{font-size:9px;color:rgba(255,255,255,.1);margin-bottom:16px}
.ab{font-size:13px;color:rgba(255,255,255,.55);line-height:1.9}.ab p{margin-bottom:14px}
.art-cta{text-align:center;padding:20px}
.art-cta a{display:inline-flex;padding:10px 32px;border-radius:8px;background:#7c83db;color:#fff;font-size:12px;font-weight:600;text-decoration:none}
.ls{max-width:1000px;margin:0 auto;padding:32px 5%;display:grid;grid-template-columns:2fr 1fr;gap:24px;font-family:'Inter','SF Pro Display',sans-serif}
.ls-h1{font-size:20px;font-weight:700;color:#f0ece8;margin-bottom:16px}
.ls-lnk{display:block;padding:10px 0;font-size:12px;color:rgba(255,255,255,.4);border-bottom:1px solid rgba(255,255,255,.03);text-decoration:none}
.ls-lnk:hover{color:#fff}.pg{display:flex;justify-content:center;gap:6px;padding:16px}
.pg a,.pg s{display:inline-block;padding:5px 12px;border-radius:6px;font-size:12px;color:rgba(255,255,255,.15);background:#1a1a2e;text-decoration:none}
.pg .cur{background:#7c83db;color:#fff}
.ft{padding:20px 5%;text-align:center;font-size:7px;color:rgba(255,255,255,.03);border-top:1px solid rgba(255,255,255,.03)}
img{max-width:100%;height:auto}



.bg-3{display:grid;gap:12px;margin-bottom:12px;grid-template-columns:1fr 1fr 1fr}
.asset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.asset-i{text-align:center;padding:10px 6px;background:rgba(255,255,255,.02);border-radius:10px}
.asset-i .ic{font-size:16px;display:block;margin-bottom:3px}
.asset-i .n{font-size:10px;font-weight:600;color:#f0ece8}
.asset-i .b{font-size:7px;color:rgba(255,255,255,.12)}
.asset-i.lk{background:rgba(124,131,219,.06);border:1px solid rgba(124,131,219,.08)}
.sh-mini{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.sh-mini .s{text-align:center;padding:10px;background:rgba(255,255,255,.02);border-radius:10px}
.sh-mini .s .ic{font-size:16px;display:block;margin-bottom:2px}
.sh-mini .s .lb{font-size:9px;font-weight:600;color:#f0ece8;margin-bottom:1px}
.sh-mini .s .d{font-size:7px;color:rgba(255,255,255,.1)}
.term{font-size:8px;line-height:1.9;color:#7c83db;font-family:JetBrains Mono,monospace;background:rgba(0,0,0,.2);border-radius:8px;padding:10px 12px}
.term .dim{opacity:.3}
.badges{display:flex;gap:6px;flex-wrap:wrap}
.badges span{font-size:8px;color:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.04);border-radius:6px;padding:4px 8px}
.badges .got{color:#7c83db;border-color:rgba(124,131,219,.15);background:rgba(124,131,219,.04)}
.quest{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.quest-i{padding:10px 12px;background:rgba(255,255,255,.02);border-radius:10px}
.quest-i .t{font-size:10px;font-weight:600;color:#f0ece8;display:flex;justify-content:space-between;margin-bottom:2px}
.quest-i .t .xp{color:#7c83db;font-size:8px}
.quest-i .s{font-size:8px;color:rgba(255,255,255,.1)}
.quest-i .pr{height:4px;background:rgba(255,255,255,.04);border-radius:2px;margin-top:6px}
.quest-i .pr .fill{height:100%;border-radius:2px;background:#7c83db}



.b-c h2.tt{font-size:8px;color:rgba(255,255,255,.15);text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;font-weight:600;border:none;background:none;padding:0}
@media(max-width:900px){
  .hero-b{grid-template-columns:1fr}
  .bg,.bg-2{grid-template-columns:1fr 1fr}
  .bg-3{grid-template-columns:1fr 1fr}
  .ls{grid-template-columns:1fr}
  .nv{padding:14px 4%}
  .hero-b .main{padding:24px 18px}
  .hero-b .main h1{font-size:26px}
}
@media(max-width:600px){
  .hero-b .side,.bg,.bg-2{grid-template-columns:1fr}
  .bg-3{grid-template-columns:1fr}
  .hero-b .main h1{font-size:22px}
  .hero-b .main p{font-size:11px}
  .hero-b .main{padding:20px 14px}
  .hero-b .side .c{padding:14px 10px}
  .hero-b .side .pr{font-size:16px}
  .nv{padding:12px 4%}
  .nv-ln{gap:10px}
  .nv-ln a{font-size:10px}
  .nv-r{padding:6px 14px;font-size:10px}
  .b-c{padding:14px}
  .b-c .v-lg{font-size:22px}
  .rw{font-size:9px;padding:4px 0}
  .ni{padding:10px 12px}
  .ni .t{font-size:11px}
  .asset-grid{grid-template-columns:repeat(3,1fr)}
  .asset-i{padding:8px 4px}
  .quest{grid-template-columns:1fr}
  .artp{padding:24px 16px 30px}
  .art-h1{font-size:18px}
  .ab{font-size:12px}
  .art-cta a{padding:8px 24px;font-size:11px}
  .ls{padding:24px 4%}
  .ls-h1{font-size:18px}
  .ls-lnk{font-size:11px;padding:8px 0}
  .nv-ln{gap:8px}
}
@media(max-width:480px){
  .asset-grid{grid-template-columns:repeat(2,1fr)}
  .sh-mini{grid-template-columns:1fr 1fr}
  .hero-b .main h1{font-size:18px}
  .hero-b{padding:24px 0}
  .nv{padding:10px 4%}
  .nv-t{font-size:12px}
  .nv-i{width:26px;height:26px;font-size:10px}
}