.noobhub-wrap{
  --bg-deep:#170F2B; --bg-panel:#221A3A; --bg-panel-2:#2C2250;
  --gold:#F2C14E; --gold-dim:#B98F2E; --magenta:#FF4D8D;
  --cream:#F5F0E8; --mint:#6EE7B7; --line: rgba(245,240,232,0.12);
  font-family:'Space Grotesk', sans-serif;
  color:var(--cream);
  width:100%; max-width:900px; margin:0 auto;
  padding:28px 16px 60px;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,77,141,0.10), transparent 45%),
    radial-gradient(circle at 85% 15%, rgba(242,193,78,0.10), transparent 40%),
    var(--bg-deep);
  border-radius:20px;
}
.noobhub-marquee{ display:flex; align-items:center; justify-content:center; gap:14px; margin-bottom:6px; }
.noobhub-coin{
  width:40px;height:40px;border-radius:50%;
  background: radial-gradient(circle at 32% 28%, #FFE9A8, var(--gold) 55%, var(--gold-dim) 100%);
  box-shadow: 0 0 0 3px rgba(242,193,78,0.18), 0 6px 14px rgba(0,0,0,0.4);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bungee',sans-serif;color:#3A2A05;font-size:18px;
  animation: noobhub-spin 5s linear infinite; flex-shrink:0;
}
@keyframes noobhub-spin{ from{transform:rotateY(0deg);} to{transform:rotateY(360deg);} }
.noobhub-wrap h1{
  font-family:'Bungee',sans-serif; font-size:clamp(22px,5vw,32px);
  letter-spacing:1px; margin:0; color:var(--gold);
  text-shadow: 0 0 18px rgba(242,193,78,0.35);
}
.noobhub-wrap h1 span{ color:var(--magenta); }
.noobhub-subtitle{ text-align:center; color:rgba(245,240,232,0.6); font-size:14px; margin:0 0 24px; }

.noobhub-balance-card{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:16px;
  padding:20px; text-align:center; margin-bottom:28px;
}
.noobhub-balance-card .label{ font-size:12px; text-transform:uppercase; letter-spacing:1.2px; color:rgba(245,240,232,0.5); margin-bottom:6px; }
.noobhub-balance-card .value{ font-family:'Bungee',sans-serif; font-size:32px; color:var(--gold); }
.noobhub-supply{ margin-top:10px; font-family:'JetBrains Mono',monospace; font-size:12px; color:rgba(245,240,232,0.55); }

.noobhub-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:16px; }
.noobhub-card{
  display:block; text-decoration:none; color:var(--cream);
  background:var(--bg-panel); border:1px solid var(--line); border-radius:16px;
  overflow:hidden; transition: transform 0.15s ease, border-color 0.15s ease;
}
.noobhub-card:hover{ transform:translateY(-3px); border-color:var(--accent, var(--gold)); }
.noobhub-card-cover{ position:relative; width:100%; aspect-ratio:16/10; overflow:hidden; background:#0E0920; }
.noobhub-card-cover img{ width:100%; height:100%; object-fit:cover; display:block; }
.noobhub-card-icon-badge{
  position:absolute; bottom:8px; right:8px; font-size:18px;
  background:rgba(14,9,32,0.75); border:1px solid var(--line);
  border-radius:999px; width:32px; height:32px; display:flex; align-items:center; justify-content:center;
}
.noobhub-card-icon{ font-size:32px; padding:20px 20px 0; }
.noobhub-card-title{ font-family:'Bungee',sans-serif; font-size:15px; color:var(--accent, var(--gold)); margin:14px 20px 6px; }
.noobhub-card-desc{ font-size:13px; color:rgba(245,240,232,0.6); line-height:1.5; margin:0 20px 14px; }
.noobhub-card-cta{ font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; color:var(--cream); margin:0 20px 20px; }
.noobhub-empty{ text-align:center; color:rgba(245,240,232,0.5); padding:40px; grid-column:1/-1; }

.noobhub-inventory{
  margin-top:28px; background:var(--bg-panel); border:1px solid var(--line);
  border-radius:16px; padding:20px;
}
.noobhub-inventory-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.noobhub-inventory-head h2{ font-family:'Bungee',sans-serif; font-size:15px; color:var(--cream); margin:0; }
.noobhub-item-count{
  font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--gold);
  border:1px solid var(--line); padding:4px 10px; border-radius:999px;
}
.noobhub-inventory-hint{ font-size:13px; color:rgba(245,240,232,0.55); line-height:1.5; margin:0 0 14px; }
.noobhub-quota-list{ display:flex; flex-direction:column; gap:8px; }
.noobhub-quota-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px; background:rgba(0,0,0,0.18); border-radius:10px; font-size:13px;
}
.noobhub-quota-row .game-name{ font-weight:600; }
.noobhub-quota-row .quota-value{ font-family:'JetBrains Mono',monospace; }
.noobhub-quota-row .quota-value.full{ color:var(--mint); }
.noobhub-quota-row .quota-value.empty{ color:rgba(245,240,232,0.45); }