.hero-card{background:var(--color-surface-2);border:1px solid #ffffff0f;border-radius:8px;align-items:center;min-height:340px;display:flex;position:relative;overflow:hidden}.hero-bg{object-fit:cover;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.hero-card.is-logged .hero-bg{object-position:right center}.hero-card.is-guest .hero-bg{object-position:left center}.hero-card.is-guest:before,.hero-card.is-logged:after{content:"";pointer-events:none;z-index:1;position:absolute;inset:0}.hero-card.is-guest:before{background:linear-gradient(270deg,#0f1115d1 22%,#0f111540 58%,#0000 100%)}.hero-card.is-logged:after{background:linear-gradient(90deg,#0f1115d1 26%,#0f111533 60%,#0000 100%)}.hero-gridfx{z-index:1;pointer-events:none;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:38px 38px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(120% 100% at 50% 0,#000 30%,#0000 85%);mask-image:radial-gradient(120% 100% at 50% 0,#000 30%,#0000 85%)}.hero-body{z-index:2;flex-direction:column;gap:20px;max-width:560px;padding:44px 48px;display:flex;position:relative}.hero-body--guest{text-align:center;align-items:center;margin-left:auto}.hero-title{letter-spacing:-.02em;color:#f5f5f7;font-size:clamp(30px,4.2vw,54px);font-weight:800;line-height:1.04}.hero-body--guest .hero-title{text-transform:uppercase}.hero-title-accent{background:linear-gradient(90deg, color-mix(in srgb, var(--color-accent) 45%, var(--color-surface-2)) 0%, var(--color-accent) 100%);color:#0000;-webkit-background-clip:text;background-clip:text}.hero-body--guest .hero-title-accent{background:0 0;-webkit-background-clip:initial;background-clip:initial;color:var(--color-accent)}.hero-pill{border:1.5px solid color-mix(in srgb, var(--color-accent) 45%, transparent);background:linear-gradient(90deg, transparent, var(--color-surface));width:max-content;color:var(--color-accent);letter-spacing:.14em;text-transform:uppercase;border-radius:999px;align-items:center;gap:8px;padding:7px 14px;font-size:12px;font-weight:600;display:inline-flex}.hero-live{background:var(--color-accent);width:9px;height:9px;box-shadow:0 0 8px color-mix(in srgb, var(--color-accent) 70%, transparent);border-radius:50%;animation:2s ease-out infinite hero-ping}@keyframes hero-ping{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--color-accent) 55%, transparent)}70%,to{box-shadow:0 0 0 8px #0000}}.hero-label{letter-spacing:.12em;text-transform:uppercase;color:var(--color-muted);margin-bottom:8px;font-size:13px;font-weight:300}.hero-amount{color:#f5f5f7;letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:clamp(34px,4vw,54px);font-weight:800;line-height:1}.hero-actions{flex-wrap:wrap;gap:10px;display:flex}.hero-btn{letter-spacing:.04em;text-transform:uppercase;cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:10px;min-width:210px;height:52px;padding:0 26px;font-size:14px;font-weight:800;transition:transform .15s,filter .2s,border-color .2s;display:inline-flex}.hero-btn:hover{filter:brightness(1.05);transform:translateY(-1px)}.hero-btn-ghost{color:#f5f5f7;background:linear-gradient(124deg, var(--color-surface) 14%, var(--color-surface-2) 92%);border:1px solid #ffffff26}.hero-btn-ghost:hover{border-color:#ffffff4d}.hero-vip{background:var(--color-surface);cursor:pointer;border:1.4px solid #ffffff26;border-radius:8px;width:100%;max-width:480px;padding:18px 22px;transition:border-color .2s}.hero-vip:hover{border-color:color-mix(in srgb, var(--color-accent) 45%, transparent)}.hero-vip-top{text-transform:uppercase;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:9px;display:flex}.hero-vip-name{color:#fff;font-size:16px;font-weight:800}.hero-vip-xp{color:var(--color-muted);white-space:nowrap;font-variant-numeric:tabular-nums;font-size:12px;font-weight:300}.hero-vip-bar{background:var(--color-surface-2);border-radius:999px;height:12px;overflow:hidden}.hero-vip-bar>div{border-radius:inherit;background:linear-gradient(90deg, var(--color-surface-2), var(--color-accent) 76%);height:100%;box-shadow:0 0 12px color-mix(in srgb, var(--color-accent) 45%, transparent);transition:width .7s}.hero-vip-next{letter-spacing:.06em;text-transform:uppercase;color:var(--color-muted);margin-top:8px;font-size:12px;font-weight:300}.hero-vip-sk{cursor:default}.hero-vip-sk-line{background:#ffffff0f;border-radius:4px;height:12px;display:inline-block;position:relative;overflow:hidden}.hero-vip-sk-line:after{content:"";background:linear-gradient(100deg,#0000 30%,#ffffff14 50%,#0000 70%);animation:1.3s ease-in-out infinite hero-vip-sk-shimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes hero-vip-sk-shimmer{to{transform:translate(100%)}}@media (prefers-reduced-motion:reduce){.hero-vip-sk-line:after{animation:none}}.hero-auth{flex-direction:column;align-items:center;gap:14px;width:100%;max-width:410px;display:flex}.hero-register{cursor:pointer;border-radius:9px;width:100%;height:60px;font-size:18px;font-weight:700}.hero-or{color:#fff;letter-spacing:.08em;font-size:12px;font-weight:300}.hero-social{gap:14px;width:100%;display:flex}.hero-social-btn{background:var(--color-surface);color:#fff;cursor:pointer;border:1.5px solid #fff3;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:12px;height:56px;font-size:14px;font-weight:800;transition:border-color .2s,filter .2s;display:inline-flex}.hero-social-btn:hover{filter:brightness(1.08);border-color:#fff6}@media (width<=820px){.hero-card{min-height:300px}.hero-body{max-width:100%;padding:30px 22px}.hero-body--guest{margin-left:0}}@media (width<=560px){.hero-actions{flex-direction:column}.hero-btn{width:100%}.hero-social{flex-direction:column}}