:root{--bg-deep:#110E1B;--bg-elevated:#191527;--bg-card:#1E1A2E;--bg-card-hover:#262238;--border-subtle:rgba(255, 255, 255, 0.06);--border-accent:rgba(167, 23, 247, 0.3);--gradient-primary:linear-gradient(135deg, #387EFC 0%, #C940FD 100%);--gradient-pink:linear-gradient(135deg, #EF43FE 0%, #C940FD 100%);--gradient-blue:linear-gradient(135deg, #2C97FB 0%, #387EFC 100%);--color-pink:#EF43FE;--color-purple:#A517F7;--color-blue:#2C97FB;--color-blue-dark:#0E53C5;--text-primary:#ffffff;--text-secondary:rgba(255, 255, 255, 0.7);--text-muted:rgba(255, 255, 255, 0.4);--shadow-offset:0 8px 32px rgba(0, 0, 0, 0.3)}.h-container:has(.hero-section){max-width:none;padding:0;margin:0}.hero-section{position:relative;min-height:260px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:url(/static/images/headers/bg_light-1.png);background-size:cover;background-position:center;background-color:#000;padding:2.5rem 1.5rem}.hero-content{text-align:center;padding:1rem 0}.hero-wordmark{height:60px;margin-bottom:.75rem}.hero-online{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:.75rem;font-size:15px;color:var(--text-secondary)}.pulse-dot{width:10px;height:10px;background:#4ade80;border-radius:50%;box-shadow:0 0 12px rgba(74,222,128,.6);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.15)}}.online-count{font-weight:500}.hero-tagline{font-size:1rem;color:var(--text-muted);margin:0 0 1.5rem 0;font-weight:400}.hero-buttons{display:flex;flex-direction:column;gap:12px;align-items:center}.btn-primary,.btn-secondary{padding:14px 36px;border-radius:14px;font-weight:600;font-size:14px;letter-spacing:.3px;border:none;cursor:pointer;transition:all .25s ease;text-decoration:none;min-width:180px;text-align:center}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:0 4px 20px rgba(56,126,252,.3)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(56,126,252,.4);color:#fff}.btn-secondary{background:rgba(255,255,255,.06);color:var(--text-secondary);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(10px)}.btn-secondary:hover{background:rgba(255,255,255,.12);color:var(--text-primary);transform:translateY(-3px)}.stats-strip{display:flex;justify-content:center;gap:2rem;padding:1.25rem 1.5rem;background:var(--bg-elevated);border-bottom:1px solid var(--border-subtle)}.stat-item{text-align:center;padding:.5rem 1rem}.stat-item .stat-value{display:block;font-size:1.5rem;font-weight:500;color:var(--text-primary);line-height:1.2}.stat-item .stat-label{display:block;font-size:.65rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:1.2px;margin-top:.25rem}.homepage-main{max-width:1100px;margin:0 auto;padding:2rem 1.5rem 3rem;overflow:hidden}.activity-card,.trending-card{min-width:0}.mode-selector-bar{display:flex;align-items:center;gap:16px;margin-bottom:1.5rem}.mode-label{font-size:13px;color:var(--text-muted);font-weight:500;text-transform:uppercase;letter-spacing:1px}.mode-selector{display:flex;gap:4px;background:var(--bg-elevated);padding:5px;border-radius:10px;border:1px solid var(--border-subtle)}.mode-btn{padding:8px 18px;background:0 0;border:none;color:var(--text-muted);font-size:13px;font-weight:500;cursor:pointer;border-radius:6px;transition:all .2s ease}.mode-btn:hover{color:var(--text-secondary)}.mode-btn.active{background:var(--gradient-primary);color:#fff;box-shadow:0 2px 10px rgba(56,126,252,.3)}.mode-btn.disabled,.mode-btn:disabled{opacity:.3;cursor:not-allowed}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}.activity-column,.trending-column{min-width:0}.activity-card{background:var(--bg-elevated);border-radius:16px;padding:1.25rem;border:1px solid var(--border-subtle);box-shadow:var(--shadow-offset)}.activity-tabs{display:flex;gap:4px;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border-subtle)}.activity-tab{padding:8px 16px;background:0 0;border:none;color:var(--text-muted);font-size:13px;font-weight:500;cursor:pointer;border-radius:8px;transition:all .2s ease}.activity-tab:hover{color:var(--text-secondary);background:rgba(255,255,255,.03)}.activity-tab.active{color:var(--text-primary);background:rgba(165,23,247,.15);border:1px solid rgba(165,23,247,.2)}.activity-content{display:none;overflow:hidden}.activity-content.active{display:block}.activity-item{display:flex;align-items:center;gap:12px;padding:12px;margin:0 -12px;border-radius:10px;transition:background .2s ease}.activity-item:hover{background:rgba(255,255,255,.03)}.activity-avatar{width:40px;height:40px;border-radius:12px;object-fit:cover;flex-shrink:0;border:2px solid var(--border-subtle)}.activity-details{flex:1;font-size:13px;color:var(--text-secondary);min-width:0;display:flex;flex-direction:column;gap:4px}.activity-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.activity-main{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.activity-player{color:var(--color-blue)!important;font-weight:600;transition:color .2s ease}.activity-player:hover{color:#5eb3ff!important}.activity-action{color:var(--text-muted)}.activity-map{color:var(--text-secondary)!important;transition:color .2s ease}.activity-map:hover{color:var(--text-primary)!important}.activity-meta{display:flex;gap:8px;align-items:center;font-size:11px}.activity-mods{color:var(--color-pink);font-weight:600;background:rgba(239,67,254,.1);padding:2px 6px;border-radius:4px}.activity-accuracy{color:var(--text-muted);font-size:11px;flex-shrink:0}.activity-meta .timeago{color:var(--text-muted)}.activity-pp{font-weight:700;font-size:14px;flex-shrink:0;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.no-activity{color:var(--text-muted);font-size:13px;padding:2rem 0;text-align:center;margin:0}.trending-card{background:var(--bg-elevated);border-radius:16px;padding:1.25rem;border:1px solid var(--border-subtle);box-shadow:var(--shadow-offset)}.trending-title{font-size:14px;font-weight:600;color:var(--text-primary);margin:0 0 1rem 0;padding-bottom:1rem;border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;gap:8px}.trending-title::before{content:'';width:8px;height:8px;background:var(--gradient-pink);border-radius:50%}.trending-grid{display:flex;flex-direction:column;gap:10px}.trending-map{position:relative;display:block;border-radius:12px;overflow:hidden;height:72px;transition:all .3s ease;border:1px solid transparent}.trending-map:hover{transform:translateX(4px);border-color:var(--border-accent);box-shadow:-8px 0 20px rgba(165,23,247,.15)}.trending-bg{width:100%;height:100%;object-fit:cover;filter:brightness(.35);transition:all .3s ease}.trending-map:hover .trending-bg{filter:brightness(.5);transform:scale(1.05)}.trending-overlay{position:absolute;bottom:0;left:0;right:0;padding:12px 14px;background:linear-gradient(transparent,rgba(0,0,0,.85))}.trending-name{display:block;font-size:13px;font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trending-plays{font-size:11px;color:var(--text-muted)}@media (max-width:900px){.stats-strip{gap:1rem;padding:1rem}.stat-item{padding:.25rem .5rem}.stat-item .stat-value{font-size:1.25rem}}@media (max-width:768px){.hero-section{min-height:auto;padding:2rem 1rem}.hero-wordmark{height:48px}.hero-buttons{width:100%;max-width:220px}.btn-primary,.btn-secondary{width:100%}.stats-strip{display:grid;grid-template-columns:repeat(2,auto);justify-content:center;gap:.75rem 2.5rem}.homepage-main{padding:1.5rem 1rem 2rem}.mode-selector-bar{flex-direction:column;align-items:flex-start;gap:8px}.mode-selector{width:100%}.mode-btn{flex:1;text-align:center}.content-grid{grid-template-columns:1fr}}@media (max-width:480px){.stats-strip{gap:.5rem 1.5rem}.stat-item .stat-value{font-size:1.25rem}.activity-item{padding:10px 8px;margin:0 -8px}.activity-avatar{width:36px;height:36px}}@keyframes fade-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.hero-content{animation:fade-up .6s ease-out backwards}.stats-strip{animation:fade-up .6s ease-out .1s backwards}.mode-selector-bar{animation:fade-up .6s ease-out .15s backwards}.activity-card,.trending-card{animation:fade-up .6s ease-out .2s backwards}