:root,[data-theme=dark]{--bg-primary: #090a0d;--bg-secondary: #13141a;--bg-elevated: #1a1b22;--bg-surface: rgba(19, 20, 26, .88);--bg-input: #0e0f14;--bg-hover: rgba(255, 255, 255, .04);--bg-active: rgba(255, 255, 255, .07);--bg-backdrop: rgba(9, 10, 13, .94);--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--text-inverse: #090a0d;--accent: #f59e0b;--accent-hover: #d97706;--accent-text: #090a0d;--accent-subtle: rgba(245, 158, 11, .12);--accent-border: rgba(245, 158, 11, .28);--accent-glow: rgba(245, 158, 11, .24);--success: #10b981;--success-subtle: rgba(16, 185, 129, .12);--success-border: rgba(16, 185, 129, .25);--danger: #ef4444;--danger-subtle: rgba(239, 68, 68, .12);--danger-border: rgba(239, 68, 68, .25);--warning: #f59e0b;--warning-subtle: rgba(245, 158, 11, .12);--warning-border: rgba(245, 158, 11, .28);--info: #38bdf8;--border: rgba(255, 255, 255, .08);--border-hover: rgba(255, 255, 255, .15);--border-focus: rgba(245, 158, 11, .55);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .5);--shadow-xl: 0 16px 48px rgba(0, 0, 0, .6);--shadow-glow: 0 0 24px var(--accent-glow);--scrollbar-track: var(--bg-primary);--scrollbar-thumb: rgba(255, 255, 255, .1);--scrollbar-thumb-hover: rgba(245, 158, 11, .4)}[data-theme=light]{--bg-primary: #fcfcf9;--bg-secondary: #ffffff;--bg-elevated: #ffffff;--bg-surface: rgba(255, 255, 255, .92);--bg-input: #f3f3ee;--bg-hover: rgba(0, 0, 0, .03);--bg-active: rgba(0, 0, 0, .06);--bg-backdrop: rgba(252, 252, 249, .92);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--text-inverse: #f8fafc;--accent: #d97706;--accent-hover: #b45309;--accent-text: #ffffff;--accent-subtle: rgba(217, 119, 6, .1);--accent-border: rgba(217, 119, 6, .25);--accent-glow: rgba(217, 119, 6, .18);--success: #059669;--success-subtle: rgba(5, 150, 105, .08);--success-border: rgba(5, 150, 105, .2);--danger: #dc2626;--danger-subtle: rgba(220, 38, 38, .08);--danger-border: rgba(220, 38, 38, .2);--warning: #d97706;--warning-subtle: rgba(217, 119, 6, .08);--warning-border: rgba(217, 119, 6, .2);--info: #0284c7;--border: rgba(0, 0, 0, .08);--border-hover: rgba(0, 0, 0, .14);--border-focus: rgba(217, 119, 6, .5);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 12px rgba(0, 0, 0, .06);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .08);--shadow-xl: 0 16px 40px rgba(0, 0, 0, .1);--shadow-glow: 0 0 20px var(--accent-glow);--scrollbar-track: var(--bg-primary);--scrollbar-thumb: rgba(0, 0, 0, .12);--scrollbar-thumb-hover: rgba(217, 119, 6, .35)}:root{--font-heading: "Outfit", -apple-system, sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: .75rem;--text-sm: .8125rem;--text-base: .9375rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--transition-spring: .4s cubic-bezier(.175, .885, .32, 1.275)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{font-family:var(--font-body);font-size:var(--text-base);line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;transition:background-color var(--transition-slow),color var(--transition-slow)}[data-theme=dark] body{background-image:radial-gradient(ellipse at 15% 10%,rgba(52,211,153,.04) 0%,transparent 50%),radial-gradient(ellipse at 85% 90%,rgba(251,191,36,.03) 0%,transparent 50%);background-attachment:fixed}a{color:var(--text-secondary);text-decoration:none;transition:color var(--transition-base)}a:hover{color:var(--accent)}.container{max-width:1200px;margin:0 auto;padding:var(--space-4) var(--space-5);min-height:100vh;display:flex;flex-direction:column}.page-wrapper{width:100%;max-width:640px;margin:var(--space-8) auto;animation:fadeInUp .4s ease-out}.page-wrapper--narrow{max-width:460px}.page-wrapper--wide{max-width:860px}.page-wrapper--dashboard{max-width:760px}main{flex:1}.navbar{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-5);background:var(--bg-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:var(--space-8);box-shadow:var(--shadow-md);transition:background var(--transition-slow),border-color var(--transition-slow),box-shadow var(--transition-slow);position:relative;z-index:100}.navbar-left{display:flex;align-items:center;gap:var(--space-6)}.brand{font-family:var(--font-heading);font-weight:800;font-size:var(--text-xl);color:var(--accent);letter-spacing:-.5px;display:flex;align-items:center;gap:var(--space-2);white-space:nowrap;text-shadow:0 0 16px var(--accent-glow)}.nav-links{display:flex;gap:var(--space-1);background:var(--bg-hover);padding:var(--space-1);border-radius:var(--radius-md);border:1px solid var(--border)}.nav-links a{padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:500;color:var(--text-secondary);transition:all var(--transition-base);white-space:nowrap}.nav-links a:hover{color:var(--text-primary);background:var(--bg-hover)}.nav-links a.active{background:var(--accent);color:var(--accent-text, #090a0d);font-weight:700;box-shadow:0 2px 8px var(--accent-glow)}.navbar-right{display:flex;align-items:center;gap:var(--space-3)}.handle-badge{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--accent);background:var(--accent-subtle);border:1px solid var(--accent-border);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-weight:500}.mobile-menu-btn{display:none;background:none;border:none;color:var(--text-primary);cursor:pointer;padding:var(--space-2);border-radius:var(--radius-sm);transition:background var(--transition-fast)}.mobile-menu-btn:hover{background:var(--bg-hover)}.card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-8);box-shadow:var(--shadow-md);transition:border-color var(--transition-base),box-shadow var(--transition-base),background var(--transition-slow)}.card:hover{border-color:var(--border-hover)}.card--interactive:hover{border-color:var(--accent-border);box-shadow:var(--shadow-lg),var(--shadow-glow)}.page-header{text-align:center;margin-bottom:var(--space-8)}.page-header__icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-4);border-radius:var(--radius-lg);background:var(--accent-subtle);border:1px solid var(--accent-border)}.page-header__title{font-family:var(--font-heading);font-size:var(--text-3xl);font-weight:800;color:var(--text-primary);letter-spacing:-.5px;margin-bottom:var(--space-2);line-height:1.2}.page-header__title--with-icon{display:flex;align-items:center;justify-content:center;gap:var(--space-3)}.page-header__subtitle{color:var(--text-secondary);font-size:var(--text-base);line-height:1.5}h1,h2,h3,h4{font-family:var(--font-heading);color:var(--text-primary);line-height:1.3}h1{font-size:var(--text-3xl);font-weight:800;letter-spacing:-.5px}h2{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.3px}h3{font-size:var(--text-xl);font-weight:600}h4{font-size:var(--text-lg);font-weight:600}.title{font-family:var(--font-heading);font-size:var(--text-3xl);font-weight:800;margin-bottom:var(--space-2);text-align:center;color:var(--text-primary);letter-spacing:-.5px}.subtitle{text-align:center;color:var(--text-secondary);font-size:var(--text-base);margin-bottom:var(--space-6);line-height:1.5}.form-group{margin-bottom:var(--space-5)}.label{display:flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs);font-weight:600;color:var(--text-secondary);margin-bottom:var(--space-2);text-transform:uppercase;letter-spacing:.5px}.label__required{color:var(--danger);font-weight:700;margin-left:2px;line-height:1}.label__optional{color:var(--text-muted);font-weight:400;font-size:var(--text-xs);text-transform:none;letter-spacing:normal;margin-left:var(--space-1)}.form-required-hint{font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--space-4);display:flex;align-items:center;gap:4px}input,select{width:100%;height:44px;padding:0 var(--space-4);background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary);border-radius:var(--radius-md);font-size:var(--text-base);font-family:var(--font-body);transition:all var(--transition-base);outline:none}input::placeholder,select::placeholder{color:var(--text-muted)}input:hover,select:hover{border-color:var(--border-hover)}input:focus,select:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow);background:var(--bg-secondary)}.btn,button[type=submit],.btn-primary{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-2);height:44px;padding:0 var(--space-6);background:var(--accent);color:var(--accent-text, #090a0d);border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:700;font-family:var(--font-heading);cursor:pointer;transition:all var(--transition-base);width:100%;letter-spacing:.1px;position:relative;overflow:hidden;-webkit-user-select:none;user-select:none}.btn:hover,button[type=submit]:hover,.btn-primary:hover{background:var(--accent-hover);color:var(--accent-text, #090a0d);transform:translateY(-1px);box-shadow:0 4px 16px var(--accent-glow)}.btn:active,button[type=submit]:active,.btn-primary:active{transform:translateY(0);box-shadow:none}button:disabled,.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn--secondary{background:var(--bg-hover);color:var(--text-primary);border:1px solid var(--border)}.btn--secondary:hover{background:var(--bg-active);border-color:var(--border-hover);box-shadow:var(--shadow-sm)}.btn--ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border);height:38px;font-size:var(--text-sm);padding:0 var(--space-4);font-family:var(--font-body);font-weight:500}.btn--ghost:hover{color:var(--text-primary);background:var(--bg-hover);border-color:var(--border-hover);transform:none;box-shadow:none}.btn--success{background:var(--success)}.btn--success:hover{filter:brightness(1.1);box-shadow:0 4px 16px #34d39933}.btn--danger{background:var(--danger)}.btn--danger:hover{filter:brightness(1.1);box-shadow:0 4px 16px #f8717133}.btn--auto{width:auto}.btn--lg{height:48px;font-size:var(--text-lg);padding:0 var(--space-8)}.timer-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2);margin-bottom:var(--space-3)}.preset-btn{background:var(--bg-hover);border:1px solid var(--border);color:var(--text-secondary);height:40px;padding:0;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:all var(--transition-base);width:100%;font-family:var(--font-body)}.preset-btn:hover{background:var(--accent-subtle);color:var(--text-primary);border-color:var(--accent-border)}.preset-btn.active{background:var(--accent);color:var(--accent-text, #090a0d);font-weight:700;border-color:transparent;box-shadow:0 2px 8px var(--accent-glow)}.grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;margin-bottom:var(--space-5);animation:fadeInUp .25s ease-out}.alert--error{background:var(--danger-subtle);border:1px solid var(--danger-border);color:var(--danger)}.alert--success{background:var(--success-subtle);border:1px solid var(--success-border);color:var(--success)}.alert--warning{background:var(--warning-subtle);border:1px solid var(--warning-border);color:var(--warning)}.alert--info{background:var(--accent-subtle);border:1px solid var(--accent-border);color:var(--accent)}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);margin-bottom:var(--space-8)}.stat-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-5);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;transition:all var(--transition-base)}.stat-card:hover{border-color:var(--border-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-card__icon{margin-bottom:var(--space-2)}.stat-value{font-family:var(--font-mono);font-size:var(--text-2xl);font-weight:700;line-height:1.2;margin-bottom:var(--space-1)}.stat-value--sm{font-size:var(--text-lg)}.stat-label{font-size:var(--text-xs);color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.profile-header{display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:1px solid var(--border)}.profile-avatar{width:56px;height:56px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;background:var(--accent);color:var(--accent-text, #090a0d);font-size:var(--text-2xl);font-weight:800;font-family:var(--font-heading);flex-shrink:0;box-shadow:0 0 16px var(--accent-glow)}.profile-info h1{font-size:var(--text-2xl);margin-bottom:var(--space-1)}.profile-info p{color:var(--text-secondary);font-size:var(--text-sm)}.section{border-top:1px solid var(--border);padding-top:var(--space-6)}.section__title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-5);color:var(--text-primary)}.status-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.status-badge--active{background:var(--success-subtle);border:1px solid var(--success-border);color:var(--success)}.status-badge--finished{background:var(--warning-subtle);border:1px solid var(--warning-border);color:var(--warning)}.status-badge--waiting{background:var(--accent-subtle);border:1px solid var(--accent-border);color:var(--accent)}.player-grid{display:grid;gap:var(--space-4);margin-bottom:var(--space-6)}.player-grid--duel{grid-template-columns:1fr 1fr}.player-grid--solo{grid-template-columns:1fr;max-width:400px;margin-left:auto;margin-right:auto}.player-card{padding:var(--space-5);background:var(--bg-elevated);border-radius:var(--radius-lg);border:1px solid var(--border);text-align:center;transition:all var(--transition-base)}.player-card:hover{border-color:var(--border-hover)}.player-card h3{font-size:var(--text-lg);margin-bottom:var(--space-1)}.player-card p{color:var(--accent);font-size:var(--text-sm);font-family:var(--font-mono)}.timer-display{font-family:var(--font-mono);font-size:3.5rem;font-weight:800;color:var(--text-primary);text-shadow:0 0 24px var(--accent-glow);letter-spacing:-1px;display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-6)}.problem-card{background:var(--accent-subtle);padding:var(--space-6);border-radius:var(--radius-lg);border:1px solid var(--accent-border);margin-bottom:var(--space-6);text-align:center}.problem-card__label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.75px;font-weight:700;margin-bottom:var(--space-2)}.problem-card__name{font-family:var(--font-heading);font-size:var(--text-2xl);margin-bottom:var(--space-2)}.problem-card__name a{color:var(--accent);text-decoration:none;display:inline-flex;align-items:center;gap:var(--space-2);transition:color var(--transition-base)}.problem-card__name a:hover{color:var(--accent-hover)}.problem-card__meta{color:var(--text-secondary);font-size:var(--text-sm)}.problem-card__meta strong{font-family:var(--font-mono)}.room-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--space-5);margin-bottom:var(--space-6);border-bottom:1px solid var(--border);gap:var(--space-4)}.room-header__title-section{display:flex;flex-direction:column;gap:var(--space-2)}.room-header h2{font-size:var(--text-xl);margin-bottom:0}.room-code-container{display:inline-flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);background:var(--bg-input);border:1px solid var(--border);padding:4px 10px;border-radius:var(--radius-md);width:fit-content}.room-code-label{font-size:var(--text-xs);color:var(--text-muted);font-weight:500;text-transform:uppercase;letter-spacing:.05em}.room-header__id{font-family:var(--font-mono);color:var(--accent);font-size:var(--text-sm);font-weight:700;letter-spacing:.08em;padding:2px 6px;background:var(--accent-subtle);border-radius:var(--radius-sm)}.copy-btn{background:var(--bg-hover);border:1px solid var(--border);color:var(--text-secondary);padding:3px 8px;margin:0;font-size:var(--text-xs);font-weight:500;display:inline-flex;align-items:center;gap:4px;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);width:auto;height:auto}.copy-btn:hover{background:var(--bg-active);color:var(--text-primary);border-color:var(--border-hover);transform:none;box-shadow:none}.copy-btn--copied{color:var(--success);background:var(--success-subtle);border-color:var(--success-border)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-backdrop);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-6);animation:fadeIn .3s ease-out}.modal-overlay h1{font-size:var(--text-4xl);color:var(--success);margin-bottom:var(--space-4);animation:scaleIn .4s var(--transition-spring)}.modal-overlay p{font-size:var(--text-lg);color:var(--text-secondary)}.league-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--text-sm)}.league-table th{text-align:left;padding:var(--space-3) var(--space-4);color:var(--text-muted);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border)}.league-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);transition:background var(--transition-fast)}.league-table tbody tr{transition:background var(--transition-fast)}.league-table tbody tr:hover{background:var(--bg-hover)}.league-table tbody tr:last-child td{border-bottom:none}.theme-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:var(--bg-hover);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-secondary);transition:all var(--transition-base);padding:0;flex-shrink:0}.theme-toggle:hover{color:var(--text-primary);background:var(--bg-active);border-color:var(--border-hover);transform:none;box-shadow:none}.theme-toggle svg{transition:transform var(--transition-slow)}.theme-toggle:hover svg{transform:rotate(15deg)}.auth-toggle{margin-top:var(--space-6);padding-top:var(--space-5);border-top:1px solid var(--border);font-size:var(--text-sm);color:var(--text-secondary);text-align:center}.auth-toggle span{color:var(--accent);cursor:pointer;font-weight:600;transition:color var(--transition-fast)}.auth-toggle span:hover{color:var(--accent-hover)}.field-error{display:block;margin-top:var(--space-1);font-size:var(--text-xs);color:var(--danger);font-weight:500;animation:fadeInUp .2s ease-out}.field-success{display:block;margin-top:var(--space-1);font-size:var(--text-xs);color:var(--success);font-weight:500;animation:fadeInUp .2s ease-out}input.input--error{border-color:var(--danger-border);box-shadow:0 0 0 3px #f871711f}input.input--error:focus{border-color:var(--danger);box-shadow:0 0 0 3px #f8717133}.password-strength{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2)}.password-strength__bar{flex:1;height:4px;border-radius:2px;background:var(--border);position:relative;overflow:hidden;transition:all var(--transition-base)}.password-strength__bar:after{content:"";position:absolute;left:0;top:0;height:100%;border-radius:2px;transition:width var(--transition-base),background var(--transition-base)}.password-strength__bar.weak:after{width:33%;background:var(--danger)}.password-strength__bar.medium:after{width:66%;background:var(--warning)}.password-strength__bar.strong:after{width:100%;background:var(--success)}.password-strength__label{font-size:var(--text-xs);font-weight:600;color:var(--text-muted);min-width:44px}.input-with-status{position:relative}.input-with-status input{padding-right:40px}.input-status-icon{position:absolute;right:var(--space-3);top:50%;transform:translateY(-50%);display:flex;align-items:center;pointer-events:none}.input-toggle-btn{position:absolute;right:var(--space-3);top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;background:transparent!important;border:none!important;padding:4px;color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:color .15s ease;height:auto!important;width:auto!important;box-shadow:none!important}.input-toggle-btn:hover{color:var(--text-primary);background:transparent!important}.otp-container{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-4);animation:fadeIn .25s ease}.otp-icon-badge{width:58px;height:58px;border-radius:var(--radius-full);background:#f59e0b1f;border:1px solid rgba(245,158,11,.3);display:flex;align-items:center;justify-content:center;color:var(--accent);box-shadow:0 0 20px #f59e0b26;margin-bottom:var(--space-1)}.otp-target-email{color:var(--accent);font-weight:600;word-break:break-all}.otp-preview-banner{width:100%;display:flex;align-items:center;justify-content:space-between;background:#f59e0b14;border:1px dashed rgba(245,158,11,.4);border-radius:var(--radius-md);padding:8px 12px;margin-top:var(--space-2);gap:var(--space-2)}.otp-preview-info{display:flex;align-items:center;gap:8px;font-size:var(--text-xs)}.otp-preview-badge{background:#f59e0b33;color:var(--accent);padding:2px 6px;border-radius:var(--radius-sm);font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:10px}.otp-preview-text{color:var(--text-secondary);font-size:var(--text-xs)}.otp-preview-text strong{color:var(--text-primary);font-family:var(--font-mono);letter-spacing:1px}.otp-autofill-btn{background:var(--accent)!important;color:#000!important;border:none!important;font-size:11px!important;font-weight:700!important;padding:4px 10px!important;border-radius:var(--radius-sm)!important;cursor:pointer;height:auto!important;width:auto!important;box-shadow:none!important;transition:transform .1s ease,opacity .15s ease}.otp-autofill-btn:hover{opacity:.9;transform:translateY(-1px)}.otp-input-field{width:100%!important;max-width:300px;height:56px!important;text-align:center;font-family:var(--font-mono);font-size:28px!important;font-weight:700;letter-spacing:12px;padding-left:18px!important;border:2px solid var(--border)!important;border-radius:var(--radius-lg)!important;background:var(--bg-input)!important;color:var(--text-primary)!important;transition:all .2s ease}.otp-input-field:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-subtle)!important;outline:none}.otp-actions{width:100%;display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-2)}.otp-resend-row{display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);color:var(--text-muted);gap:var(--space-2)}.otp-resend-btn{background:none!important;border:none!important;color:var(--accent)!important;font-weight:600;cursor:pointer;padding:0!important;font-size:var(--text-sm);text-decoration:underline;text-underline-offset:3px;transition:opacity .15s ease;height:auto!important;width:auto!important;box-shadow:none!important}.otp-resend-btn:hover:not(:disabled){opacity:.8;background:none!important}.otp-resend-btn:disabled{color:var(--text-muted)!important;cursor:not-allowed;text-decoration:none}.otp-back-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);background:transparent!important;border:1px solid var(--border)!important;color:var(--text-secondary)!important;font-size:var(--text-sm);border-radius:var(--radius-md)!important;padding:var(--space-2) var(--space-4);cursor:pointer;transition:all .15s ease;width:100%;height:40px!important;box-shadow:none!important}.otp-back-btn:hover{background:var(--bg-card-hover)!important;color:var(--text-primary)!important;border-color:var(--border-hover)!important}.timer-info{margin-top:var(--space-2);font-size:var(--text-sm);color:var(--text-muted);text-align:right}.timer-info strong{color:var(--text-primary);font-family:var(--font-mono)}.helper-text{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-1)}.empty-state{text-align:center;padding:var(--space-12) var(--space-6);color:var(--text-secondary)}.center-state{text-align:center;padding:var(--space-8) 0}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:var(--space-4);animation:fadeIn .5s ease-out}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.loading-text{font-family:var(--font-heading);font-size:var(--text-lg);color:var(--text-secondary);font-weight:600}.skeleton{background:var(--bg-elevated);border-radius:var(--radius-sm);position:relative;overflow:hidden}.skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 0%,var(--bg-hover) 50%,transparent 100%);animation:shimmer 1.5s infinite}.skeleton--row{height:48px;margin-bottom:var(--space-2);border-radius:var(--radius-md)}.winner-display{text-align:center;padding:var(--space-8) 0}.winner-display h2{font-size:var(--text-3xl);color:var(--warning);margin-top:var(--space-4)}.winner-display p{margin-top:var(--space-3);font-size:var(--text-lg)}.divider{border:none;border-top:1px solid var(--border);margin:var(--space-6) 0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input:focus-visible,select:focus-visible{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow)}@media (max-width: 768px){.container{padding:var(--space-3) var(--space-4)}.navbar{flex-wrap:wrap;gap:var(--space-3);padding:var(--space-3) var(--space-4)}.navbar-left{width:100%;justify-content:space-between}.nav-links{display:none;width:100%;flex-direction:column;order:3}.nav-links.open{display:flex}.nav-links a{padding:var(--space-3) var(--space-4)}.navbar-right{display:none;width:100%;justify-content:space-between;order:4}.navbar-right.open,.mobile-menu-btn{display:flex}.card{padding:var(--space-6)}.page-wrapper{margin:var(--space-4) auto}.grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}.player-grid--duel{grid-template-columns:1fr}.timer-display{font-size:2.5rem}.page-header__title{font-size:var(--text-2xl)}.room-header{flex-direction:column;gap:var(--space-3)}.profile-header{flex-direction:column;text-align:center}}@media (max-width: 480px){.container{padding:var(--space-3)}.card{padding:var(--space-5);border-radius:var(--radius-md)}.stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.stat-card{padding:var(--space-4)}.stat-value{font-size:var(--text-xl)}.timer-presets{grid-template-columns:repeat(2,1fr)}.timer-display{font-size:2rem}.page-header__title{font-size:var(--text-xl)}h1{font-size:var(--text-2xl)}h2{font-size:var(--text-xl)}.league-table{font-size:var(--text-xs)}.league-table th,.league-table td{padding:var(--space-2) var(--space-3)}}@media (min-width: 1280px){.container{padding:var(--space-6)}}
