:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-pill:999px;--text-xs:.75rem;--text-sm:.8125rem;--text-base:.9375rem;--text-lg:1.0625rem;--text-xl:1.375rem;--text-2xl:1.75rem;--text-3xl:2.5rem;--text-display:clamp(3rem, 9vw, 7rem);--font-display:"Bebas Neue", sans-serif;--font-body:"DM Sans", system-ui, -apple-system, sans-serif;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--dur-fast:.15s;--dur-base:.25s;--dur-slow:.5s;--shadow-sm:0 1px 2px #0006;--shadow-md:0 10px 30px #0006;--shadow-lg:0 30px 70px #0000008c}:root,[data-skin=raw]{--ot-bg:#090c24;--ot-bg-2:#0e1232;--ot-surface:#141a3c;--ot-surface-2:#1b2350;--ot-surface-raised:#243066;--ot-glass:#ffffff0a;--ot-glass-2:#ffffff0f;--ot-glass-border:#ffffff1a;--ot-blur:14px;--ot-border:#ffffff1a;--ot-border-strong:#ffffff38;--ot-text:#f7f8ff;--ot-text-muted:#a7afd6;--ot-text-faint:#6c76a8;--ot-accent:#ffb81c;--ot-accent-hover:#ffcb4d;--ot-accent-contrast:#090c24;--ot-accent-soft:#ffb81c24;--ot-accent-line:#ffb81c66;--ot-success:#36e08a;--ot-danger:#ff5a4d;--ot-warning:#ffb81c;--ot-premium:#ffb81c;--ot-basic:#5b9bff}:root{--color-bg:var(--ot-bg);--color-surface:var(--ot-surface);--color-border:var(--ot-border);--color-accent:var(--ot-accent);--color-accent-2:var(--ot-accent);--color-text:var(--ot-text);--color-muted:var(--ot-text-muted);--color-premium:var(--ot-premium);--color-basic:var(--ot-basic);--font-heading:var(--font-display);--transition-speed:var(--dur-base);--glow-accent:none;--glow-accent-2:none}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}html{scroll-behavior:smooth;width:100%;overflow-x:hidden}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--ot-bg);color:var(--ot-text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-x:none;width:100%;line-height:1.6;position:relative;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.01em;color:var(--ot-text);font-weight:400;line-height:.95}a{color:inherit;transition:color var(--dur-base);text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}::selection{background:var(--ot-accent);color:var(--ot-accent-contrast)}.container{max-width:1200px;padding:0 var(--space-5);width:100%;margin:0 auto}@media (width<=768px){.container{padding:0 var(--space-4)}:root{font-size:14px}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--ot-bg)}::-webkit-scrollbar-thumb{background:var(--ot-border-strong);border-radius:var(--radius-pill)}::-webkit-scrollbar-thumb:hover{background:var(--ot-accent)}.text-accent,.text-accent-2{color:var(--ot-accent)}.text-muted{color:var(--ot-text-muted)}.bg-surface{background-color:var(--ot-surface)}.border-subtle{border:1px solid var(--ot-border)}.ot-eyebrow{font-family:var(--font-body);font-size:var(--text-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--ot-text-muted);font-weight:700}.btn-primary,.btn-outline,.btn-success,.btn-basic,.btn-gold{font-family:var(--font-body);letter-spacing:.01em;text-transform:none;border-radius:var(--radius-md);justify-content:center;align-items:center;gap:var(--space-2);cursor:pointer;transition:background var(--dur-base), border-color var(--dur-base), color var(--dur-base), transform var(--dur-fast);padding:14px 26px;font-size:1rem;font-weight:700;line-height:1;display:inline-flex}.btn-primary{background:var(--ot-accent);border:1px solid var(--ot-accent);color:var(--ot-accent-contrast)}.btn-primary:hover{background:var(--ot-accent-hover);border-color:var(--ot-accent-hover);transform:translateY(-1px)}.btn-outline{border:1px solid var(--ot-border-strong);color:var(--ot-text);background:#ffffff08}.btn-outline:hover{border-color:var(--ot-text-muted);background:#ffffff0f;transform:translateY(-1px)}.btn-success{color:var(--ot-success);background:#5bd08a1f;border:1px solid #5bd08a66}.btn-success:hover{background:#5bd08a33;transform:translateY(-1px)}.btn-basic{background:var(--ot-accent-soft);border:1px solid var(--ot-accent-line);color:var(--ot-accent)}.btn-basic:hover{background:#ffb81c38;transform:translateY(-1px)}.btn-gold{background:var(--ot-accent);border:1px solid var(--ot-accent);color:var(--ot-accent-contrast);text-decoration:none}.btn-gold:hover{background:var(--ot-accent-hover);border-color:var(--ot-accent-hover);transform:translateY(-1px)}.btn-primary:active,.btn-outline:active,.btn-success:active,.btn-basic:active,.btn-gold:active{transform:scale(.97)}.full-width{width:100%}.user-section{align-items:center;gap:var(--space-3);padding:0 var(--space-4);border:1px solid var(--ot-border);border-radius:var(--radius-pill);height:46px;transition:background var(--dur-base), border-color var(--dur-base);cursor:pointer;box-sizing:border-box;background-color:#ffffff0a;display:flex}.user-section:hover{border-color:var(--ot-border-strong);background-color:#ffffff12}.logout-btn{color:var(--ot-text-muted);transition:color var(--dur-base), background var(--dur-base);background-color:#0000;border-radius:50%;align-items:center;padding:10px;display:flex}.logout-btn:hover{color:var(--ot-accent);background-color:var(--ot-accent-soft)}.nav-link{align-items:center;gap:var(--space-3);font-family:var(--font-display);text-transform:uppercase;color:var(--ot-text);opacity:.65;padding:0 var(--space-4);border-radius:var(--radius-pill);height:46px;transition:opacity var(--dur-base), background var(--dur-base), color var(--dur-base), border-color var(--dur-base);box-sizing:border-box;border:1px solid #0000;font-size:1.2rem;display:flex}.nav-link span{padding-top:4px}.nav-link:hover{opacity:1;border-color:var(--ot-border);background-color:#ffffff0a}.nav-link.active{opacity:1;background-color:var(--ot-accent-soft);border-color:var(--ot-accent-line);color:var(--ot-accent)}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.shimmer-bar{position:relative;overflow:hidden}.shimmer-bar:after{content:"";will-change:transform;background:linear-gradient(90deg,#0000,#ffffff59 50%,#0000);width:100%;height:100%;animation:2s infinite shimmer;position:absolute;inset:0}.shimmer-delayed:after{animation-delay:.6s}@keyframes ot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.ot-pulse{animation:1.8s ease-in-out infinite ot-pulse}@keyframes ot-pulse-ring{0%{box-shadow:0 0 #ffb81c73}70%{box-shadow:0 0 0 7px #ffb81c00}to{box-shadow:0 0 #ffb81c00}}.ot-live-dot{background:var(--ot-accent);border-radius:50%;width:8px;height:8px;animation:2s ease-out infinite ot-pulse-ring;display:inline-block}.leaderboard-row{padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);align-items:center;gap:var(--space-6);border:1px solid var(--ot-border);transition:background var(--dur-base), border-color var(--dur-base), transform var(--dur-base);cursor:pointer;display:flex}.leaderboard-row:hover{border-color:var(--ot-accent-line);transform:translate(3px);background-color:var(--ot-accent-soft)!important}.stat-card-interactive{transition:background var(--dur-base), border-color var(--dur-base), transform var(--dur-base);cursor:pointer}.stat-card-interactive:hover{transform:translateY(-3px);border-color:var(--ot-accent-line)!important;background-color:#ffffff0a!important}.modal-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:1000;background-color:#000000b8;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;inset:0}.modal-content{background:var(--ot-glass-2);-webkit-backdrop-filter:blur(var(--ot-blur));backdrop-filter:blur(var(--ot-blur));border:1px solid var(--ot-glass-border);padding:var(--space-6);border-radius:var(--radius-xl);width:90%;max-width:500px;max-height:90vh;box-shadow:var(--shadow-lg);position:relative;overflow-y:auto}.modal-content::-webkit-scrollbar{width:6px}.modal-content::-webkit-scrollbar-thumb{background:var(--ot-border-strong);border-radius:var(--radius-pill)}.hub-card,.ot-card{background:var(--ot-glass);-webkit-backdrop-filter:blur(var(--ot-blur));backdrop-filter:blur(var(--ot-blur));padding:var(--space-6);border-radius:var(--radius-lg);border:1px solid var(--ot-glass-border);transition:border-color var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out)}.hub-card:hover{border-color:var(--ot-border-strong);transform:translateY(-2px)}.mobile-stack{flex-direction:column;display:flex}@media (width<=768px){.hide-mobile{display:none!important}.full-width-mobile{width:100%!important}.stack-mobile{gap:var(--space-4)!important;flex-direction:column!important}.text-center-mobile{text-align:center!important}}.nav{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:100;background-color:#05050acc;border-bottom:1px solid #ffffff0d;align-items:center;height:90px;display:flex;position:sticky;top:0}.nav-container{justify-content:space-between;align-items:center;width:100%;display:flex}.logo{font-size:1.6rem;font-family:var(--font-heading);letter-spacing:.05em;align-items:center;gap:14px;font-weight:700;display:flex}.logo-icon{background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-accent-2) 100%);width:40px;height:40px;box-shadow:var(--glow-accent);border-radius:10px;justify-content:center;align-items:center;display:flex}.nav-links{align-items:center;gap:20px;display:flex}.auth-group{align-items:center;gap:8px;display:flex}.user-avatar{border:2px solid var(--color-accent);border-radius:50%;width:32px;height:32px}.nav-username{color:var(--color-text);padding-top:2px;font-size:.9rem;font-weight:600}.nav-link-text{color:var(--color-muted);font-size:.95rem;font-weight:500;text-decoration:none;transition:all .2s}.nav-link-text:hover,.nav-link-text.active{color:var(--color-accent)}@media (width<=768px){.nav{height:70px}.logo span{font-size:1.2rem;display:none}.logo{gap:8px}.logo-icon{width:32px;height:32px}.nav-links{gap:10px}.nav-link span{display:none}.nav-link{padding:0 12px}.nav-username{display:none}.user-section{padding:0 10px}}@media (width<=480px){.logo span{display:none}}.toast-container{z-index:1000000;pointer-events:none;flex-direction:column-reverse;align-items:center;gap:10px;width:max-content;max-width:min(92vw,420px);display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{pointer-events:auto;text-align:left;width:100%;font:inherit;color:#fff;border:1px solid #ffffff1f;border-left:4px solid var(--color-accent,var(--ot-accent));cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#14121ef5;border-radius:12px;padding:14px 16px;font-size:.95rem;line-height:1.4;animation:.22s ease-out toast-in;box-shadow:0 10px 30px #00000073}.toast-error{border-left-color:#ff4757}.toast-success{border-left-color:#2ed573}.toast-info{border-left-color:var(--color-accent,var(--ot-accent))}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.toast{animation:none}}