:root{--brand:#7c3aed;--brand2:#06b6d4;--ink:#0f172a;--muted:#64748b;--line:#e2e8f0;--card:rgba(255,255,255,.82)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at top left,rgba(124,58,237,.16),transparent 32rem),radial-gradient(circle at 85% 10%,rgba(6,182,212,.18),transparent 28rem),linear-gradient(180deg,#f8fafc 0%,#eef2ff 42%,#f8fafc 100%);min-height:100vh}.glass{background:var(--card);backdrop-filter:blur(18px);border:1px solid rgba(226,232,240,.86);box-shadow:0 20px 60px rgba(15,23,42,.08)}.eshadow{box-shadow:0 18px 45px rgba(15,23,42,.10)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:1rem;padding:.78rem 1.05rem;font-weight:800;transition:.18s ease;text-decoration:none}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--brand),#2563eb);color:white;box-shadow:0 14px 28px rgba(37,99,235,.22)}.btn-secondary{background:white;color:var(--ink);border:1px solid var(--line)}.btn-dark{background:#0f172a;color:#fff}.pill{display:inline-flex;align-items:center;gap:.45rem;border-radius:999px;padding:.32rem .72rem;font-size:.78rem;font-weight:800;border:1px solid var(--line);background:#fff}.card{border-radius:1.35rem;background:rgba(255,255,255,.9);border:1px solid rgba(226,232,240,.95);box-shadow:0 14px 38px rgba(15,23,42,.07)}.card-hover{transition:.18s ease}.card-hover:hover{transform:translateY(-2px);box-shadow:0 20px 48px rgba(15,23,42,.11);border-color:#c7d2fe}.section-title{font-size:clamp(1.6rem,3vw,2.5rem);line-height:1.06;font-weight:900;letter-spacing:-.04em;color:#0f172a}.lead{font-size:1.05rem;line-height:1.75;color:#475569}.form-control,input[type=text],input[type=password],input[type=email],input[type=number],input[type=datetime-local],input:not([type]),select,textarea{border-radius:1rem!important;border:1px solid #cbd5e1!important;background:rgba(255,255,255,.96)!important;padding:.78rem .95rem!important;outline:none;transition:.15s ease;min-height:44px}input:focus,select:focus,textarea:focus{border-color:#7c3aed!important;box-shadow:0 0 0 4px rgba(124,58,237,.13)!important}label{font-weight:700;color:#334155}.table-wrap{overflow-x:auto;border-radius:1.25rem;border:1px solid var(--line);background:white}table{border-collapse:separate;border-spacing:0}thead{background:#f8fafc}tbody tr:hover{background:#f8fafc}.app-shell{min-height:calc(100vh - 80px)}.nav-link{border-radius:.95rem;padding:.65rem .85rem;color:#475569;font-weight:750}.nav-link:hover,.nav-link.active{background:#f1f5f9;color:#0f172a}.hero-orb{position:absolute;border-radius:999px;filter:blur(2px);opacity:.75}.game-tile{background:linear-gradient(135deg,#111827,#312e81 55%,#0891b2);color:white;position:relative;overflow:hidden}.game-tile:after{content:"";position:absolute;inset:auto -20% -40% 30%;height:11rem;background:radial-gradient(circle,rgba(255,255,255,.28),transparent 60%)}.mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:.45rem env(safe-area-inset-right) calc(.45rem + env(safe-area-inset-bottom)) env(safe-area-inset-left)}@media (min-width:768px){.mobile-bottom-nav{display:none}}@media (max-width:767px){main{padding-bottom:5.2rem!important}.hide-mobile{display:none!important}.section-title{font-size:2rem}.card{border-radius:1.15rem}}

.official-game-card{position:relative;overflow:hidden}.official-game-card:after{content:"";position:absolute;right:-6rem;bottom:-7rem;width:18rem;height:18rem;border-radius:999px;background:rgba(255,255,255,.16);filter:blur(1px)}.game-radio-card{display:block;border:1px solid var(--line);border-radius:1.35rem;background:rgba(255,255,255,.92);padding:1rem;transition:.18s ease}.game-radio-card:hover{transform:translateY(-1px);box-shadow:0 18px 42px rgba(15,23,42,.08)}.game-radio-card input{position:absolute;opacity:0;pointer-events:none}.game-radio-card:has(input:checked){border-color:#7c3aed;box-shadow:0 0 0 4px rgba(124,58,237,.12),0 18px 42px rgba(15,23,42,.08)}

/* Social layer */
.activity-item{transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.activity-item:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(15,23,42,.09);border-color:rgba(124,58,237,.22)}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}