/* ===== APP HUB ===== */
    .app{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1rem,4vw,2rem) 5rem}
    .app-head{text-align:center;padding:2.2rem 0 1rem}
    .app-head h1{font-family:'Cinzel',serif;font-weight:900;font-size:clamp(1.8rem,4.4vw,2.9rem);line-height:1.04;margin:.3rem 0 .5rem}
    .app-head p{color:var(--muted);max-width:560px;margin:0 auto;font-size:.95rem}
    .music-toggle{position:fixed;right:16px;bottom:16px;z-index:120;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
      color:#1a1206;background:var(--grad-gold);border:none;cursor:pointer;box-shadow:0 10px 26px -8px rgba(230,184,63,.7);transition:transform .2s}
    .music-toggle:hover{transform:translateY(-2px)}

    /* wallet bar */
    .wbar{position:sticky;top:calc(40px + 62px);z-index:40;display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;
      background:rgba(9,24,14,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
      border:1px solid var(--line);border-radius:14px;padding:.6rem .8rem;margin:.4rem 0 1.2rem;box-shadow:0 16px 40px -28px rgba(0,0,0,.9)}
    .wbar-net{display:flex;align-items:center;gap:.45rem;font:600 .76rem/1 'Space Grotesk',monospace;color:var(--muted);
      border:1px solid var(--line);border-radius:999px;padding:.5em .8em;white-space:nowrap}
    .wbar-net .dot{width:8px;height:8px;border-radius:50%;background:#5aa869;box-shadow:0 0 8px #5aa869}
    .wbar-net.bad{color:#ffcabb;border-color:rgba(255,120,90,.4)}.wbar-net.bad .dot{background:#ff785a;box-shadow:0 0 8px #ff785a}
    .wbar-net.off .dot{background:#7c8b78;box-shadow:none}
    .wbar-bals{display:flex;gap:.9rem;font:600 .82rem/1 'Space Grotesk',monospace;color:var(--ink);margin-left:.2rem;flex-wrap:wrap}
    .wbar-bals .b{display:flex;flex-direction:column;gap:.2rem}
    .wbar-bals .b span{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:500}
    .wbar-spacer{flex:1 1 auto}
    .wbar #w-connect{white-space:nowrap}

    /* tabs */
    .app-tabs{display:flex;gap:.4rem;background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:14px;padding:.35rem;margin:0 auto 1.6rem;max-width:520px}
    .app-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:.4rem;font:700 .84rem/1 'Space Grotesk',monospace;
      color:var(--muted);background:none;border:none;border-radius:10px;padding:.75em .5em;cursor:pointer;transition:.2s;letter-spacing:.02em}
    .app-tab:hover{color:var(--gold-lite)}
    .app-tab.active{color:#1a1206;background:var(--grad-gold);box-shadow:0 8px 22px -10px rgba(230,184,63,.6)}
    .app-tab .ti{opacity:.9;flex:none}
    .app-tab.active .ti{opacity:1}
    #w-disconnect{padding:.5em .9em}
    .wfree{display:flex;align-items:center;gap:1rem;margin-top:1.3rem;padding:1.1rem 1.3rem;border:1px solid var(--line);border-radius:16px;
      background:linear-gradient(120deg,rgba(230,184,63,.08),rgba(14,36,21,.5));flex-wrap:wrap}
    .wfree-ic{color:var(--gold-lite);flex:none}
    .wfree-txt{flex:1;min-width:200px;display:flex;flex-direction:column;gap:.25rem}
    .wfree-txt b{font:700 .92rem/1.2 'Space Grotesk',monospace;color:var(--ink)}
    .wfree-txt span{font-size:.8rem;color:var(--muted);line-height:1.45}
    .wfree #s-to-pact{flex:none;white-space:nowrap}
    .pooladdr{margin-top:.9rem;border-top:1px solid var(--line);padding-top:.8rem}
    .pooladdr>span{font-size:.7rem;color:var(--muted);letter-spacing:.04em}
    .pooladdr-row{display:flex;align-items:center;gap:.5rem;margin-top:.4rem}
    .pooladdr-row code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 .74rem/1.4 'Space Grotesk',monospace;color:var(--gold-lite);background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:8px;padding:.5em .6em}
    .pooladdr-row button{font:600 .7rem/1 'Space Grotesk',monospace;color:var(--gold-lite);background:rgba(230,184,63,.14);border:1px solid var(--line);border-radius:8px;padding:.55em .8em;cursor:pointer;white-space:nowrap}
    .pooladdr-row button:hover{background:rgba(230,184,63,.24)}
    .app-panel[hidden]{display:none}
    .app-panel{animation:fade .4s var(--ease)}
    @keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

    /* generic card + grid */
    .card{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:var(--radius);
      padding:1.4rem;box-shadow:0 24px 60px -30px rgba(0,0,0,.85)}
    .card h3{font:700 .82rem/1 'Space Grotesk',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 1rem}
    .cols{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
    @media(max-width:760px){.cols{grid-template-columns:1fr}}

    /* stat tiles */
    .stat-row{display:grid;gap:.8rem;margin-bottom:1.3rem}
    .stat-row.s3{grid-template-columns:repeat(3,1fr)}.stat-row.s4{grid-template-columns:repeat(4,1fr)}
    @media(max-width:640px){.stat-row.s4,.stat-row.s3{grid-template-columns:repeat(2,1fr)}}
    .stat{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:14px;padding:1rem .9rem;text-align:center}
    .stat .v{font:700 1.25rem/1 'Space Grotesk',monospace;color:var(--gold-lite);font-variant-numeric:tabular-nums;word-break:break-word}
    .stat .l{font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:.45rem}

    /* inputs / actions */
    .fld{display:flex;align-items:center;gap:.5rem;background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:12px;padding:.6rem .8rem;margin-bottom:.5rem}
    .fld input{flex:1;background:none;border:none;color:var(--ink);font:600 1.02rem/1 'Space Grotesk',monospace;outline:none;min-width:0}
    .fld .tok{color:var(--muted);font:600 .82rem/1 'Space Grotesk',monospace;white-space:nowrap}
    .fld .mx{font:600 .7rem/1 'Space Grotesk',monospace;color:var(--gold-lite);background:rgba(230,184,63,.14);border:1px solid var(--line);border-radius:8px;padding:.45em .7em;cursor:pointer}
    .hint{font-size:.74rem;color:var(--muted);margin:.1rem 0 .9rem}
    .actions{display:flex;gap:.55rem;flex-wrap:wrap}.actions .btn{flex:1;min-width:110px}
    .status{text-align:center;font:500 .86rem/1.4 'Space Grotesk',monospace;color:var(--muted);min-height:1.3em;margin:.7rem 0 0}
    .status.ok{color:#8ff0a4}.status.err{color:#ffcabb}

    /* tier picker */
    .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;margin-bottom:.5rem}
    .tier{background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:12px;padding:.8rem .4rem;cursor:pointer;text-align:center;transition:.2s;color:var(--muted)}
    .tier:hover{border-color:rgba(230,184,63,.4)}.tier.active{border-color:var(--gold);background:rgba(230,184,63,.12)}
    .tier b{display:block;font:700 1.05rem/1 'Space Grotesk',monospace;color:var(--ink)}
    .tier span{display:block;font-size:.68rem;color:var(--gold-lite);margin-top:.3rem}

    /* mint mode cards */
    .modes{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.4rem 0}
    @media(max-width:640px){.modes{grid-template-columns:1fr}}
    .mode{position:relative;background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:16px;padding:1.3rem;text-align:center;overflow:hidden}
    .mode.gamble{border-color:rgba(230,184,63,.35)}
    .mode .k{font:700 .72rem/1 'Space Grotesk',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lite)}
    .mode h4{font-family:'Cinzel',serif;font-weight:700;font-size:1.3rem;margin:.5rem 0 .35rem}
    .mode p{font-size:.8rem;color:var(--muted);margin:0 0 1rem;min-height:2.4em}
    .mode .price{font:700 1.1rem/1 'Space Grotesk',monospace;color:var(--ink);margin-bottom:.9rem}
    .odds{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-top:.9rem}
    .odds .o{font:600 .68rem/1 'Space Grotesk',monospace;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:.4em .7em}
    .odds .o b{color:var(--gold-lite)}
    .odds .o.t4 b{color:#f8e6a0}.odds .o.t3 b{color:#c9a0ff}.odds .o.t2 b{color:#7fd4ff}.odds .o.t1 b{color:#8ff0a4}

    /* NFT grid */
    .hgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;margin-top:1.2rem}
    .hcard{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:16px;overflow:hidden;
      box-shadow:0 20px 44px -30px rgba(0,0,0,.85);transition:transform .25s var(--ease),border-color .25s}
    .hcard:hover{transform:translateY(-4px);border-color:rgba(230,184,63,.45)}
    .hcard.sold{opacity:.45;filter:grayscale(.5)}
    .hcard.t4{box-shadow:0 20px 44px -30px rgba(0,0,0,.85),0 0 0 1px rgba(248,230,160,.25)}
    .hcard.t3{box-shadow:0 20px 44px -30px rgba(0,0,0,.85),0 0 0 1px rgba(201,160,255,.22)}
    .hcard-media{position:relative;aspect-ratio:1;overflow:hidden}
    .hcard-media img,.hcard-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
    .hcard-media video{opacity:0;transition:opacity .3s}.hcard:hover video{opacity:1}
    .hcard-rank{position:absolute;top:8px;left:8px;font:700 .66rem/1 'Space Grotesk',monospace;color:var(--gold-lite);background:rgba(6,18,10,.8);border:1px solid var(--line);border-radius:999px;padding:.35em .6em}
    .hcard-tier{position:absolute;top:8px;right:8px;font:700 .58rem/1 'Space Grotesk',monospace;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:.4em .6em;background:rgba(6,18,10,.85);border:1px solid var(--line)}
    .hcard-tier.t0{color:#b7c6b3}.hcard-tier.t1{color:#8ff0a4}.hcard-tier.t2{color:#7fd4ff}.hcard-tier.t3{color:#c9a0ff}.hcard-tier.t4{color:#f8e6a0}
    .hcard-badge{position:absolute;inset:auto 0 0 0;text-align:center;font:700 .66rem/1 'Space Grotesk',monospace;letter-spacing:.18em;padding:.5em;background:rgba(6,18,10,.78)}
    .hcard-badge.minted{color:#ffcabb}.hcard-badge.owned{color:#8ff0a4}.hcard-badge.staked{color:#f8e6a0}
    .hcard-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.65rem .75rem}
    .hcard-name{font:600 .8rem/1.2 'Space Grotesk',monospace;color:var(--ink)}
    .hcard-btn{font:600 .72rem/1 'Space Grotesk',monospace;padding:.5em .75em;border-radius:9px;cursor:pointer;white-space:nowrap;border:1px solid var(--line);background:rgba(230,184,63,.12);color:var(--gold-lite);transition:.2s}
    .hcard-btn:hover:not(:disabled){background:rgba(230,184,63,.24)}.hcard-btn:disabled{opacity:.5;cursor:default}

    /* position panel */
    .pos{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
    .pos .p{background:rgba(0,0,0,.26);border:1px solid var(--line);border-radius:12px;padding:.8rem}
    .pos .p .l{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
    .pos .p .v{font:700 1.05rem/1.1 'Space Grotesk',monospace;color:var(--ink);margin-top:.35rem;font-variant-numeric:tabular-nums}
    .lockbar{margin-top:.9rem;font:600 .78rem/1.4 'Space Grotesk',monospace;color:var(--gold-lite);text-align:center;min-height:1.2em}
    .lockbar.unlocked{color:#8ff0a4}
    .empty{text-align:center;color:var(--muted);font-size:.82rem;padding:1.6rem 0}

    /* pact status pills */
    .pill{display:inline-flex;align-items:center;gap:.4rem;font:700 .68rem/1 'Space Grotesk',monospace;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:.45em .8em;border:1px solid var(--line)}
    .pill.open{color:#7fd4ff}.pill.verified{color:#8ff0a4}.pill.claimed{color:#a9c1a5}.pill.forfeited{color:#ffcabb}.pill.reclaimed{color:#a9c1a5}
    .pactcard{background:rgba(0,0,0,.26);border:1px solid var(--line);border-radius:12px;padding:1rem;margin-bottom:.7rem}
    .pactcard .row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
    .pactcard .meta{font:500 .76rem/1.5 'Space Grotesk',monospace;color:var(--muted);margin-top:.5rem}
    .pactcard .meta b{color:var(--ink)}
    .supply-wrap{display:flex;flex-direction:column;gap:.4rem;max-width:560px;margin:1.4rem auto 0}
    .supply-bar{height:10px;border-radius:100px;background:rgba(150,230,90,.14);overflow:hidden}
    .supply-fill{height:100%;width:0;border-radius:100px;background:linear-gradient(90deg,#8ce65a,#e6b83f);transition:width 1.2s var(--ease)}
    .supply-label{display:flex;justify-content:space-between;font:500 .78rem/1 'Space Grotesk',monospace;color:var(--muted)}
    .note{font-size:.72rem;color:var(--muted);line-height:1.5;margin-top:1rem;border-top:1px solid var(--line);padding-top:.9rem}