*{box-sizing:border-box}
body{margin:0;background:#070a12;color:#f8fafc;font-family:Inter,Arial,sans-serif;display:flex;min-height:100vh}
.sidebar{width:260px;background:#0b1020;border-right:1px solid #1f2937;padding:22px;position:fixed;left:0;top:0;bottom:0}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:30px}
.logo{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#22c55e,#3b82f6);display:flex;align-items:center;justify-content:center;font-weight:900}
.brand h1{font-size:16px;margin:0}
.brand span,.muted{color:#94a3b8;font-size:12px}
nav{display:grid;gap:10px}
.nav{background:transparent;color:#cbd5e1;border:1px solid #1f2937;border-radius:12px;padding:12px;text-align:left;cursor:pointer}
.nav.active,.nav:hover{background:#111827;color:#fff;border-color:#22c55e}
.main{margin-left:260px;padding:28px;width:calc(100% - 260px)}
.topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}
.topbar h2{margin:0;font-size:30px}
.topbar p{margin:6px 0 0;color:#94a3b8}
input,select{background:#0f172a;border:1px solid #263244;color:#fff;border-radius:12px;padding:12px}
button{border:0;border-radius:12px;padding:12px 16px;background:#22c55e;color:#03110a;font-weight:800;cursor:pointer}
.login{display:flex;gap:8px}
.view{display:none}
.view.active{display:block}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.stat,.panel,.card{background:#111827;border:1px solid #243044;border-radius:18px;padding:16px}
.stat .label{color:#94a3b8;font-size:12px}
.stat .value{font-size:26px;font-weight:900;margin-top:8px}
.stat .sub{color:#94a3b8;font-size:12px;margin-top:6px}
.breakdown{display:grid;gap:12px}
.barRow{display:grid;grid-template-columns:80px 1fr 90px;gap:12px;align-items:center}
.bar{height:12px;background:#0f172a;border-radius:999px;overflow:hidden}
.fill{height:100%;background:linear-gradient(90deg,#22c55e,#3b82f6)}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.toolbar input{min-width:320px;flex:1}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:16px}
.card img{width:100%;border-radius:14px;background:#000}
.card h3{margin:12px 0 8px}
.row{display:flex;justify-content:space-between;gap:10px;margin:8px 0}
.tag{display:inline-block;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800}
.Common{background:#374151}.Rare{background:#16a34a}.Epic{background:#2563eb}.Legendary{background:#9333ea}
.wallet{font-size:11px;word-break:break-all;color:#94a3b8}
.tableWrap{overflow:auto;background:#111827;border:1px solid #243044;border-radius:18px}
table{width:100%;border-collapse:collapse}
th,td{padding:12px;border-bottom:1px solid #243044;text-align:left;font-size:13px}
th{color:#94a3b8}
.exportGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:16px}
.exportBtn{display:block;background:#0f172a;border:1px solid #22c55e;color:#22c55e;text-decoration:none;border-radius:14px;padding:16px;font-weight:800}
@media(max-width:850px){
  body{display:block}
  .sidebar{position:relative;width:100%;height:auto}
  .main{margin-left:0;width:100%;padding:18px}
  .topbar{display:block}
  .login{margin-top:14px}
}
