.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:var(--z-overlay);padding:var(--spacing-md);animation:fadeIn var(--transition-normal) ease-out}.modal-content{background:var(--surface);border-radius:var(--radius-xl);max-width:600px;width:100%;max-height:90vh;box-shadow:var(--shadow-xl);animation:slideUp var(--transition-slow) ease-out;display:flex;flex-direction:column;overflow:auto;position:relative}.modal-content.leaderboard-modal,.modal-content.user-profile-modal{background:var(--surface);max-width:56rem;max-height:80vh;padding:1.5rem;color:var(--text-primary)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:2px solid var(--surface-border);position:sticky;top:0;background:var(--surface);z-index:var(--z-sticky)}.modal-header h2{font-size:1.5rem;margin:0;font-weight:700}.auth-modal .modal-header,.leaderboard-modal .modal-header,.user-profile-modal .modal-header{background:transparent;border-bottom:2px solid var(--border);padding:0 0 var(--spacing-lg) 0;position:relative}.leaderboard-modal .modal-header h2,.user-profile-modal .modal-header h2{font-size:1.5rem;color:var(--text-primary)}.modal-actions{display:flex;gap:var(--spacing-md);padding:var(--spacing-lg);border-top:2px solid var(--surface-border);justify-content:flex-end;background:var(--surface);position:sticky;bottom:0;z-index:1;margin-top:auto}.auth-modal{background:#fff;border-radius:var(--radius-md);padding:var(--spacing-lg);width:100%;max-width:28rem;box-shadow:var(--shadow-lg);color:#000;position:relative;animation:slideUp var(--transition-slow) ease-out}.auth-modal h2{font-size:1.5rem;font-weight:700;margin:0 0 1rem}.auth-modal-footer{margin-top:1rem;text-align:center;font-size:.875rem;color:#6b7280}.pfp-grid{display:flex;flex-wrap:wrap;gap:var(--spacing-md);justify-content:center}.pfp-option{width:80px;height:80px;border-radius:var(--radius-full);-o-object-fit:cover;object-fit:cover;cursor:pointer;border:2px solid var(--border);transition:border-color var(--transition-normal),transform var(--transition-normal)}@media (max-width: 640px){.modal-content{max-height:100vh;border-radius:0}.modal-actions{flex-direction:column-reverse}.auth-modal{margin:1rem;max-width:calc(100% - 2rem)}}.form-group{display:flex;flex-direction:column;gap:var(--spacing-sm)}.form-group label{font-weight:500;color:var(--text-primary)}.form-input{width:100%;font-family:inherit;font-size:1em;padding:.5em;border-radius:var(--radius-sm);border:1px solid var(--border);background-color:var(--surface-secondary);color:var(--text-primary);transition:border-color var(--transition-normal)}.form-input:focus{outline:none;border-color:var(--accent)}.auth-modal .form-input{background-color:#fff;border:1px solid #d1d5db;padding:.625rem .75rem;border-radius:.375rem;color:#111827}select,.form-select{width:100%;padding:.75rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:var(--surface-secondary, white);color:var(--text-primary);font-size:1rem;cursor:pointer;transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}select:focus,.form-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}label,.form-label{display:block;font-size:.875rem;font-weight:500;margin-bottom:.5rem;color:var(--text-primary)}.form-hint{font-size:.85rem;color:var(--text-muted);margin-top:var(--spacing-xs)}.parse-message{margin-left:.75rem;font-size:.85rem;color:var(--success);font-weight:400;animation:fadeIn var(--transition-slow) ease-in}.form-field-row label{min-width:150px;width:150px;display:inline-block}.form-section{display:flex;flex-direction:column;gap:var(--spacing-md)}.form-section h3{font-size:1.1rem;margin:0;color:var(--accent)}.checkbox-group{display:flex;flex-direction:column;gap:var(--spacing-sm)}.checkbox-label{display:flex;align-items:center;gap:.75rem;cursor:pointer;padding:.75rem;background:var(--surface-secondary);border-radius:var(--radius-md);transition:background var(--transition-normal);-webkit-user-select:none;-moz-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--accent);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-alt);border:2px solid var(--accent);border-radius:var(--radius-sm);position:relative;transition:background var(--transition-normal),border-color var(--transition-normal)}.checkbox-label input[type=checkbox]:checked:after{content:"";display:block;width:12px;height:12px;background:#fff;border-radius:2px;position:absolute;top:2px;left:2px}.form-group input,.form-group select,.form-group textarea{background-color:var(--surface-secondary, #2a2a2a);border-color:var(--border, #555)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent, #667eea)}.form-section h3{color:var(--accent, #667eea)}button{font-family:inherit;font-size:1em;cursor:pointer;border:none;background:none}.btn-primary{background:var(--button-bg-primary)!important;color:#fff!important;border:none!important;padding:.7em 1.5em!important;font-weight:600!important;border-radius:var(--radius-md)!important;font-size:1rem!important;transition:transform var(--transition-normal),box-shadow var(--transition-normal)}.btn-secondary{background:var(--surface-secondary);color:var(--text-primary);border:1px solid var(--border);padding:.65rem 1.25rem;border-radius:var(--radius-md);font-size:.95rem;font-weight:500;transition:background var(--transition-normal),border-color var(--transition-normal)}.btn-action{background:var(--button-bg);color:var(--button-text);border:none;padding:.7em 1.5em;font-weight:600;border-radius:var(--radius-md);font-size:.95rem;transition:transform var(--transition-fast),filter var(--transition-normal)}.btn-small{background:var(--button-bg-small);color:var(--button-text);border:none;padding:.4rem .8rem;font-size:.85rem;font-weight:500;border-radius:var(--radius-sm);transition:background var(--transition-normal)}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-full);background:var(--button-bg);color:var(--text-primary);font-size:1.5rem;box-shadow:var(--shadow-sm);transition:background var(--transition-normal),color var(--transition-normal)}.btn-danger{background:var(--error);color:#fff;padding:.65rem 1.25rem;border-radius:var(--radius-md);font-size:.95rem;font-weight:600;transition:background var(--transition-normal),transform var(--transition-fast)}.btn-remove,.btn-remove-game{background:none;border:none;font-size:1.2rem;padding:.25rem;border-radius:var(--radius-sm);opacity:.7;transition:background var(--transition-normal),transform var(--transition-fast),opacity var(--transition-normal)}.btn-remove:hover,.btn-remove-game:hover{background:#f44;opacity:1;transform:scale(1.1)}.modal-close{background:none;border:none;font-size:1.5rem;line-height:1;color:#9ca3af;padding:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);cursor:pointer;font-weight:700;transition:background var(--transition-normal),color var(--transition-normal);position:absolute;top:12px;right:12px}.btn-link{background:none;border:none;color:#3b82f6;padding:0;font-size:inherit;cursor:pointer;text-decoration:none;font-weight:500;transition:color var(--transition-normal),-webkit-text-decoration var(--transition-normal);transition:color var(--transition-normal),text-decoration var(--transition-normal);transition:color var(--transition-normal),text-decoration var(--transition-normal),-webkit-text-decoration var(--transition-normal)}.error-message{padding:.75rem;background-color:#fee2e2;border:1px solid #fecaca;border-radius:.375rem;color:#dc2626;font-size:.875rem}.info-banner{background-color:#e3f2fd;border:1px solid #90caf9;border-radius:var(--radius-md);padding:.75rem 1rem;color:#1565c0;font-size:.875rem;font-weight:500}.follow-button-container{display:flex;flex-direction:column;gap:.5rem;align-items:flex-start;justify-content:center;width:100%}.follow-button-container button{min-width:120px;align-self:flex-start}.btn-primary.loading,.btn-secondary.loading{animation:pulse 1s infinite}.follow-error{font-size:.75rem;color:var(--error-color, #e74c3c);text-align:center}.btn-edit{background:var(--button-bg);color:#fff;border:none;min-width:auto;padding:.4em .8em;border-radius:6px;cursor:pointer;transition:background .2s}.game-icon-tooltip-wrapper{position:relative;display:inline-block;cursor:help}.game-icon-tooltip-wrapper:hover .game-icon-tooltip-content{opacity:.8}.game-icon-tooltip-content{transition:opacity .2s}.game-icon-tooltip-popup{position:absolute;bottom:125%;left:50%;transform:translate(-50%);background:#222;color:#fff;padding:8px 12px;border-radius:6px;font-size:.85rem;white-space:nowrap;z-index:900;box-shadow:0 2px 8px #0000004d;pointer-events:none}.game-icon-tooltip-popup:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:#222}.game-icon-tooltip-popup-portal{position:fixed;transform:translate(-50%,-120%);background:#222;color:#fff;padding:8px 12px;border-radius:6px;font-size:.85rem;white-space:nowrap;z-index:900;box-shadow:0 8px 24px #0006;pointer-events:none}.game-icon-tooltip-arrow{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #222;position:absolute;left:50%;bottom:-6px;transform:translate(-50%)}.user-profile-body{flex:1;overflow-y:auto;padding:var(--spacing-lg)}.user-profile-modal .modal-header{justify-content:flex-start;align-items:center;gap:1rem}.user-profile-modal .user-profile-avatar-link,.user-profile-modal .user-profile-avatar-placeholder{margin-right:.5rem}.user-profile-modal .modal-close{position:absolute;top:12px;right:12px}.user-profile-header{margin-bottom:1.5rem;display:flex;align-items:center;gap:1rem}.user-profile-name{font-size:1.5rem;font-weight:700;margin:0;color:var(--text-primary)}.user-profile-stats-header{display:flex;gap:1rem;font-size:.875rem;color:var(--text-secondary)}.user-profile-followers{display:flex;align-items:center;gap:.25rem}.user-profile-avatar{width:4rem;height:4rem;border-radius:50%;-o-object-fit:cover;object-fit:cover;background:var(--surface-secondary);flex-shrink:0}.user-profile-avatar-placeholder{width:4rem;height:4rem;border-radius:50%;background:var(--surface-secondary);display:flex;align-items:center;justify-content:center;font-size:1.875rem;flex-shrink:0;color:var(--text-muted)}.user-profile-avatar-link{display:inline-block;padding:3px;border-radius:50%;background:var(--accent-gradient);transition:transform var(--transition-fast)}.user-profile-avatar-link:hover{transform:scale(1.05)}.user-profile-avatar-link img{width:calc(4rem - 6px);height:calc(4rem - 6px);border-radius:50%;display:block;border:2px solid var(--surface);box-sizing:border-box}.user-profile-games-title{font-weight:600;font-size:1.3rem;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:2px solid var(--border);color:var(--text-primary)}.user-profile-games-table{width:100%;border-collapse:collapse;table-layout:fixed;margin-bottom:1.5rem;border:1px solid var(--border);border-radius:var(--radius-md);overflow:visible}.user-profile-games-table thead{position:sticky;top:0;background:var(--surface-secondary);z-index:1}.user-profile-games-table th{padding:.75rem 1rem;text-align:left;font-size:.9rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border)}.user-profile-games-table th:not(:first-child){text-align:center}.user-profile-games-table tbody tr{border-bottom:1px solid var(--border);transition:background-color var(--transition-fast)}.user-profile-games-table tbody tr:hover{background-color:var(--surface)}.user-profile-games-table td{padding:.75rem 1rem;font-size:.875rem;color:var(--text-primary)}.user-profile-game-cell:first-child{display:flex;align-items:center;gap:.5rem}.game-icon-tooltip-wrapper{z-index:900}.user-profile-game-cell:not(:first-child){text-align:center;font-weight:500;color:var(--accent)}.user-profile-game-cell-clickable{cursor:pointer}.user-profile-game-icon{font-size:1.25rem}.user-profile-game-name{font-weight:500}.user-profile-game-name-button{background:none;border:none;padding:0;margin:0;font:inherit;font-weight:500;color:var(--text-primary);cursor:pointer;text-align:left;transition:color var(--transition-fast)}.user-profile-game-name-button:hover{color:var(--accent);text-decoration:underline}.user-profile-social-section{margin-top:1.5rem;padding-top:1.5rem;border-top:2px solid var(--border)}.user-profile-social-title{font-weight:600;font-size:1.3rem;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:2px solid var(--border);color:var(--text-primary)}.user-profile-social-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:300px;overflow-y:auto}.profile-social-item{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;border:2px solid rgba(102,126,234,.27);border-radius:var(--radius-lg);background:linear-gradient(135deg,#667eea21,#764ba221);transition:transform var(--transition-fast),box-shadow var(--transition-normal)}.profile-social-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea33}.user-profile-social-avatar-button{border:none;background:transparent;padding:3px;border-radius:50%;background:var(--accent-gradient);cursor:pointer;transition:transform var(--transition-fast);display:inline-flex;align-items:center;justify-content:center}.user-profile-social-avatar-button:hover{transform:scale(1.1)}.user-profile-social-avatar{width:calc(3rem - 6px);height:calc(3rem - 6px);border-radius:50%;-o-object-fit:cover;object-fit:cover;border:2px solid var(--surface)}.user-profile-social-avatar-button .user-profile-social-avatar{width:calc(3rem - 6px);height:calc(3rem - 6px);border-radius:50%;-o-object-fit:cover;object-fit:cover;border:2px solid var(--surface);display:block}.user-profile-social-avatar-placeholder{width:3rem;height:3rem;border-radius:50%;background:var(--surface-secondary);display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--text-muted);border:2px solid var(--border)}.user-profile-social-info{display:flex;flex-direction:column;align-items:center;gap:.25rem;width:100%}.user-profile-social-name{font-size:.875rem;font-weight:500;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;max-width:100%;color:var(--text-primary)}.user-profile-social-badge{font-size:.75rem;padding:.125rem .5rem;border-radius:9999px;font-weight:500}.user-profile-social-badge.friend{background:#10b98133;color:var(--success)}.user-profile-social-badge.following{background:#667eea33;color:var(--accent)}.user-profile-social-badge.you{background:#daa5201f;color:var(--text-primary);font-weight:700}.button-group{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-bottom:var(--spacing-md)}.btn-group-item{padding:.5rem 1rem;border:1px solid transparent;border-radius:.375rem;cursor:pointer;font-size:.875rem;font-weight:500;transition:background-color .2s,color .2s,border-color .2s,transform .2s;background-color:#e5e7eb;color:#374151}.btn-group-item.active{background-color:#3b82f6;color:#fff}.toggle-switch{--width: 300px;--height: 40px;position:relative;width:var(--width);height:var(--height);border-radius:.5rem;background:var(--surface-secondary);display:inline-flex;align-items:center;padding:4px;border:1px solid var(--border);cursor:pointer;transition:background .18s ease,box-shadow .18s ease,border-color .18s ease}.toggle-switch:focus{outline:2px solid rgba(59,130,246,.12);outline-offset:2px}.toggle-switch-label{flex:1 1 50%;display:inline-flex;align-items:center;justify-content:center;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;font-size:.95rem;transition:color .16s ease,font-weight .16s ease,opacity .16s ease,background .16s ease;color:var(--text-secondary);padding:0 8px;border-radius:.375rem}.toggle-switch-knob{position:absolute;top:4px;left:4px;width:calc(50% - 8px);height:calc(100% - 8px);border-radius:.375rem;background:var(--surface);box-shadow:0 6px 14px #0c142814;z-index:0;transition:left .22s cubic-bezier(.2,.9,.3,1),background .16s ease}@media (max-width: 520px){.toggle-switch{--width: 240px;--height: 36px}}.leaderboard-content{padding:0;display:flex;flex-direction:column;gap:1rem;flex:1}.leaderboard-table-container{height:500px;overflow-y:auto;border:1px solid var(--border);border-radius:var(--radius-md);position:relative;background:var(--surface-secondary)}.leaderboard-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--surface);opacity:.9;display:flex;align-items:center;justify-content:center;z-index:10;border-radius:var(--radius-md)}.leaderboard-loading-overlay p{color:var(--text-secondary)}.spinner{width:2rem;height:2rem;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}.leaderboard-table{width:100%;border-collapse:collapse;table-layout:fixed}.leaderboard-table thead{position:sticky;top:0;background:var(--surface-secondary);z-index:1}.leaderboard-table th{padding:.75rem 1rem;text-align:left;font-size:.9rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border)}.leaderboard-table th:nth-child(1){width:15%}.leaderboard-table th:nth-child(2){width:55%}.leaderboard-table th:nth-child(3),.leaderboard-table th:nth-child(4){width:15%;text-align:center}.leaderboard-table tbody tr{border-bottom:1px solid var(--border);transition:background-color var(--transition-fast)}.leaderboard-table tbody tr:hover{background-color:var(--surface)}.leaderboard-table td{padding:.75rem 1rem;font-size:.875rem;color:var(--text-primary)}.leaderboard-table td:nth-child(1){font-weight:600}.leaderboard-table td:nth-child(3),.leaderboard-table td:nth-child(4){text-align:center;font-weight:500;color:var(--accent)}.leaderboard-player-button{background:linear-gradient(135deg,#667eea26,#764ba226);border:2px solid rgba(102,126,234,.3);display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:var(--radius-md);cursor:pointer;font-weight:500;transition:transform var(--transition-fast),box-shadow var(--transition-normal),border-color var(--transition-normal)}.leaderboard-player-button:hover{transform:scale(1.02);box-shadow:0 4px 12px #667eea33;border-color:var(--accent)}.leaderboard-player-button:active{transform:scale(.98)}.leaderboard-player-button .leaderboard-avatar{padding:2px;border-radius:50%;background:var(--accent-gradient);display:inline-flex;align-items:center;justify-content:center}.leaderboard-player-button .leaderboard-avatar img,.leaderboard-player-button .leaderboard-avatar>*{width:2rem;height:2rem;border-radius:50%;-o-object-fit:cover;object-fit:cover;display:block;border:2px solid var(--surface);box-sizing:border-box}.leaderboard-avatar{width:2rem;height:2rem;border-radius:50%;-o-object-fit:cover;object-fit:cover;flex-shrink:0;background:var(--surface-secondary)}.leaderboard-avatar-placeholder{width:2rem;height:2rem;border-radius:50%;background:var(--surface-secondary);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:var(--text-muted)}.leaderboard-player-name{color:var(--text-primary)}.leaderboard-player-name.current-user{font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.leaderboard-table tr.current-user{background:linear-gradient(135deg,#667eea1a,#764ba21a)}.leaderboard-table tr.current-user td{font-weight:600}.groups-filter-list{display:flex;flex-direction:column;gap:0;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-secondary)}.group-filter-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--surface);border-bottom:1px solid var(--border);cursor:pointer;transition:all var(--transition-fast)}.group-filter-item:last-child{border-bottom:none}.group-filter-item:hover{background:var(--surface-secondary)}.group-filter-item.active{background:linear-gradient(135deg,#667eea26,#764ba226);border-left:3px solid var(--accent);padding-left:calc(var(--spacing-md) - 3px)}.group-filter-icon{font-size:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center}.group-filter-info{flex:1;min-width:0}.group-filter-name{font-weight:500;font-size:.95rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.25rem}.group-filter-meta{font-size:.85rem;color:var(--text-secondary)}.social-fab{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:var(--accent-gradient);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #667eea66;transition:transform .2s ease,box-shadow .2s ease;z-index:1000}.social-fab:hover{transform:scale(1.1);box-shadow:0 6px 20px #667eea80}.social-fab:active{transform:scale(.95)}.social-fab-icon{font-size:24px;line-height:1}.social-modal .modal-content{max-width:480px;max-height:80vh;display:flex;flex-direction:column}.social-modal .modal-body{flex:1;overflow-y:auto;padding:var(--spacing-lg)}.social-tabs{display:flex;border-bottom:1px solid var(--border);background:var(--surface)}.social-tab{flex:1;padding:var(--spacing-md);background:none;border:none;cursor:pointer;font-size:.95rem;font-weight:500;color:var(--text-secondary);border-bottom:2px solid transparent;transition:all var(--transition-fast)}.social-tab:hover{color:var(--text-primary);background:var(--surface-secondary)}.social-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.social-tab-content{padding:var(--spacing-lg)}.friends-list{display:flex;flex-direction:column;gap:0;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-secondary)}.friend-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--surface);border-bottom:1px solid var(--border);cursor:pointer;transition:background-color var(--transition-fast)}.friend-item:last-child{border-bottom:none}.friend-item:hover{background:var(--surface-secondary)}.friend-avatar{width:40px;height:40px;border-radius:var(--radius-full);-o-object-fit:cover;object-fit:cover;flex-shrink:0}.friend-avatar-placeholder{width:40px;height:40px;border-radius:var(--radius-full);background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:16px;flex-shrink:0}.friend-info{flex:1;min-width:0}.friend-name{font-weight:500;font-size:.95rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.25rem}.friend-followers{font-size:.85rem;color:var(--text-secondary)}.groups-list{display:flex;flex-direction:column;gap:0;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-secondary)}.group-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--surface);border-bottom:1px solid var(--border);cursor:pointer;transition:background-color var(--transition-fast)}.group-item:last-child{border-bottom:none}.group-item:hover{background:varvar(--radius-md);background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.group-info{flex:1;min-width:0}.group-name{font-weight:500;font-size:.95rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.25rem}.group-meta{font-size:.85rem;color:var(--text-secondary);display:flex;align-items:center;gap:var(--spacing-sm)}.group-private-badge{background:var(--surface-secondary);color:var(--text-secondary);padding:2px 6px;border-radius:var(--radius-sm);font-size:.75rem;font-weight:600;text-transform:uppercase}.create-group-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);width:100%;padding:var(--spacing-md);margin-bottom:var(--spacing-lg);background:var(--surface);border:2px dashed var(--border);border-radius:var(--radius-md);cursor:pointer;color:var(--text-secondary);font-size:.95rem;font-weight:500;transition:all var(--transition-fast)}.create-group-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--surface-secondary)}.create-group-form{display:flex;flex-direction:column;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--surface-secondary);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg)}.create-group-form input,.create-group-form textarea{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-primary);font-size:.9rem;transition:border-color var(--transition-fast);font-family:inherit}.create-group-form input:focus,.create-group-form textarea:focus{outline:none;border-color:var(--accent)}.create-group-form textarea{resize:vertical;min-height:60px}.create-group-form .checkbox-row{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.9rem;color:var(--text-primary)}.create-group-form .checkbox-row input[type=checkbox]{width:auto;cursor:pointer}.create-group-actions{display:flex;gap:var(--spacing-sm);justify-content:flex-end}.social-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-xl);text-align:center;color:var(--text-secondary)}.social-empty-state .empty-icon{font-size:48px;margin-bottom:var(--spacing-lg);opacity:.5}.social-empty-state h3{margin:0 0 var(--spacing-sm);color:var(--text-primary);font-size:1.1rem}.social-empty-state p{margin:0;font-size:.9rem;max-width:280px}.social-loading{display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl);color:var(--text-secondary)}@media (max-width: 480px){.social-fab{bottom:16px;right:16px;width:48px;height:48px}.social-fab-icon{font-size:20px}.social-modal .modal-content{max-height:90vh}.social-tab{padding:10px 12px;font-size:13px}}.social-members-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--spacing-md)}.group-role-badge{font-size:.75rem;padding:.125rem .5rem;border-radius:9999px;background:var(--surface);color:var(--text-secondary);border:1px solid var(--border);font-weight:600}.member-badges{display:flex;flex-direction:column;gap:6px;align-items:flex-start;margin-top:6px}.member-badges .group-role-badge,.member-badges .user-profile-social-badge{align-self:flex-start}.social-members-grid .profile-social-item{position:relative}.social-members-grid .profile-social-item>.modal-close{position:absolute;top:8px;right:8px;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;padding:0}.game-card{background:#1a1a1a;border:2px solid #333;border-radius:12px;padding:1.5rem;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;flex-direction:column;gap:1rem;min-height:420px;height:100%}.game-card.organize{min-height:auto;padding:1rem}.game-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000004d;border-color:#667eea}.game-card.error{border-color:#f59e0b;background:linear-gradient(135deg,#1a1a1a,#2e2410)}.game-card.completed{border-color:#10b981;background:linear-gradient(135deg,#1a1a1a,#1a2e1a)}.game-card-header{display:flex;align-items:center;gap:1rem;position:relative}.game-card-icon{font-size:2.5rem;cursor:help}.game-card-icon:hover{opacity:.8}.game-card-title{flex:1;display:flex;flex-direction:column;gap:.2rem}.game-card-title h3{font-size:1.3rem;font-weight:600;margin:0}.game-card-category{font-size:.85rem;color:#888;text-transform:capitalize}.game-card-header-actions{display:flex;align-items:center;gap:.5rem}.warning-badge{width:28px;height:28px;background:#f59e0b;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#fff;font-weight:700;cursor:help}.completion-badge{width:32px;height:32px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#fff;font-weight:700}.star-badge{font-size:1.5rem;filter:drop-shadow(0 0 4px gold)}.game-card-reset-time{font-size:.9rem;color:var(--text-secondary);padding:.5rem;background:var(--bg-secondary);border-radius:6px;text-align:center;font-weight:500}.game-card-body{padding:2rem 0 1rem;min-height:100px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:1rem;flex:1 1 auto}.game-card-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem;color:#999;font-size:.95rem}.loading-spinner{width:40px;height:40px;border:3px solid #333;border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite}.game-card-score{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap}.score-display{display:flex;flex-direction:column;align-items:center;gap:.3rem}.score-display.failed .score-emoji{font-size:2rem}.score-label{font-size:.9rem;color:#888;text-transform:uppercase;letter-spacing:.05em}.score-value{font-size:2.5rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hard-mode-badge{font-size:.85rem;padding:.3em .8em;background:#ff6b3544;color:#ff6b35;border-radius:20px;font-weight:600}.game-card-pending{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:#888}.pending-icon{font-size:2rem}.pending-text{font-size:.95rem}.game-card-actions{display:flex;gap:.5rem;padding-top:.5rem;border-top:1px solid #333;margin-top:auto}.game-card-actions .btn-action{flex:1}.share-texts-container{margin-top:.75rem;display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.share-text-entry-preview{color:var(--button-text);background:#222;border:3px solid;border-radius:6px;padding:.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;width:100%;height:100%}.share-text-entry-preview.success{background:#10b98133;border-color:#10b981}.share-text-entry-preview.failed{background:#ef444433;border-color:#ef4444}.share-text-entry-preview.pending{opacity:.6}.entry-preview-name{font-size:.85rem;font-weight:600;color:#667eea;text-align:center}.entry-preview-status{font-size:1.1rem;font-weight:700;text-align:center}.share-text-preview{margin-top:.5rem;font-size:.95rem;line-height:1.2;text-align:center;opacity:.7;max-width:100%;overflow:hidden}.share-text-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.share-text-line.puzzle-number{font-weight:700;font-size:.9rem;color:#667eea;opacity:1;margin-bottom:.25rem}.btn-changelog{font-size:1.4rem;margin-left:6px}.dashboard{display:flex;flex-direction:column;gap:3rem}.dashboard-section{animation:slideUp .4s ease-out;background:var(--surface);border-radius:12px;box-shadow:0 2px 8px #0000000a}.dashboard-header{background:var(--surface);border-radius:12px;box-shadow:0 2px 8px #0000000a;display:flex;align-items:center;justify-content:center;position:relative;padding:1rem 2rem}.dashboard-title{display:flex;flex-direction:column;align-items:center;gap:.25rem}.dashboard-title>div:first-child{display:flex;align-items:center;gap:.5rem}.title-icon{font-size:2rem}.title-text{font-weight:700;font-size:1.5rem;letter-spacing:.02em}.title-subtitle{font-size:.875rem;color:var(--text-secondary, #888)}.dashboard-header-actions{display:flex;gap:1rem;align-items:center;position:absolute;right:2rem}.section-header{display:flex;justify-content:space-between;align-items:center;margin:1.5rem}.section-header h2{font-size:1.8rem;font-weight:600}.offline-mode-text{font-size:.875rem;color:#6b7280;font-style:italic}.empty-state{text-align:center;padding:3rem;background:var(--surface);border-radius:12px;border:2px dashed var(--surface-border, #333);box-shadow:0 2px 8px #0000000a}.empty-state p{font-size:1.2rem;color:#888;margin-bottom:1rem}.games-grid{display:flex;flex-wrap:wrap;gap:0;margin:1.5rem;align-content:flex-start}.games-grid.organize-mode{background:#667eea0d;border:2px dashed rgba(102,126,234,.3);border-radius:12px;padding:1rem;margin:.5rem 1.5rem 1.5rem}.game-card-wrapper{transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .2s ease-out;position:relative;flex:0 1 33.333%;min-width:300px;pointer-events:auto;box-sizing:border-box;padding:.75rem}.game-card-wrapper:hover,.game-card-wrapper:focus{cursor:default}.organize-mode .game-card-wrapper:hover{cursor:grab}.game-card-wrapper.dragging{opacity:.5;z-index:1000;pointer-events:auto;cursor:grabbing}@media (max-width: 1200px){.game-card-wrapper{flex:0 1 50%}}@media (max-width: 768px){.game-card-wrapper{flex:0 1 100%}}.btn-secondary.active{background:#667eea;color:#fff;border-color:#667eea}.category-section{margin-bottom:1.5rem;background:var(--surface);border-radius:10px;box-shadow:0 1px 4px #00000008}.category-title{font-size:1.2rem;font-weight:600;padding:1rem;background:var(--surface);border-radius:8px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background .2s;display:flex;align-items:center;gap:.5rem;border-bottom:2px solid var(--border)}.category-title:hover{background:var(--surface-menu)}.category-title.expanded{border-bottom-left-radius:0;border-bottom-right-radius:0}.category-toggle{font-size:.9rem;width:20px;display:inline-block}.games-list{display:flex;flex-direction:column;gap:.5rem;padding:1rem;background:var(--surface);border-top:none;border-bottom-left-radius:8px;border-bottom-right-radius:8px;animation:slideDown .2s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.game-list-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--surface-menu);border-radius:8px;transition:background .2s}.game-list-item:hover{background:#5a5c7a}.game-card,.menu,.dropdown-menu,.account-menu{background:var(--surface-menu)!important;color:var(--text-primary)}.game-icon{font-size:1.5rem;cursor:help;display:inline-block}.game-icon:hover{opacity:.8}.game-name{flex:1;font-weight:500}.game-status{padding:.3em .8em;border-radius:20px;font-size:.85em;font-weight:600}.game-status.active{background:#10b98144;color:#10b981;border:none;cursor:pointer;transition:all .2s ease}.game-status.active:hover{background:#10b981;color:#fff;transform:scale(1.05)}@media (max-width: 768px){.section-header{flex-direction:column;align-items:flex-start;gap:1rem}.games-grid{grid-template-columns:1fr}.dashboard-header{flex-direction:column;align-items:stretch;padding:1rem .5rem}.dashboard-title{align-items:flex-start!important;text-align:left}.dashboard-header-actions{position:static;justify-content:flex-start;margin-top:.5rem;width:100%}}.organize-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--background);z-index:999;display:flex;flex-direction:column;overflow:auto}.organize-overlay-header{display:flex;justify-content:space-between;align-items:center;padding:2rem;background:var(--surface);box-shadow:0 2px 8px #0000001a;position:sticky;top:0;z-index:10}.organize-overlay-header h2{font-size:1.8rem;font-weight:600;margin:0}.organize-grid-container{flex:1;display:flex;justify-content:center;align-items:flex-start;padding:2rem;overflow:auto}.organize-grid-container .games-grid{width:100%;max-width:1400px}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.shimmer-effect{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#fff0,#fff3 20%,#ffffff80,#fff0);background-size:1000px 100%}.game-list-item.shimmer{position:relative;overflow:hidden}.game-list-item.shimmer:before{content:"";position:absolute;left:-150%;top:0;height:100%;width:300%;background:linear-gradient(90deg,#fff0,#ffeb3b40 45%,#fff0 55%);transform:skew(-20deg);pointer-events:none;animation:newCardShimmer 1.2s linear infinite;z-index:1}.game-list-item.shimmer:hover:before{display:none;animation-play-state:paused;opacity:0}.game-card.shimmer{position:relative;overflow:hidden}.game-card.shimmer:before{content:"";position:absolute;left:-150%;top:0;height:100%;width:300%;background:linear-gradient(90deg,#fff0,#ffeb3b40 45%,#fff0 55%);transform:skew(-20deg);pointer-events:none;animation:newCardShimmer 1.2s linear infinite}.game-card.shimmer:hover:before{display:none;animation-play-state:paused;opacity:0}@keyframes newCardShimmer{0%{transform:translate(-100%) skew(-20deg)}to{transform:translate(100%) skew(-20deg)}}.activity-heatmap{width:100%;padding:1.5rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--border-color)}.activity-heatmap.loading,.activity-heatmap.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;gap:1rem}.activity-heatmap .loading-spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--accent-color);border-radius:50%;animation:spin .8s linear infinite}.heatmap-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:.5rem}.heatmap-header h3{margin:0;font-size:1.1rem;font-weight:600;color:var(--text-primary)}.heatmap-stats{display:flex;gap:.5rem;font-size:.875rem;color:var(--text-secondary)}.heatmap-unified-grid{display:grid;grid-template-rows:repeat(8,12px);grid-template-columns:repeat(54,12px);gap:3px;margin-bottom:.25rem;align-items:center;justify-content:center;margin-left:auto;margin-right:auto}.month-label{font-size:.625rem;color:var(--text-secondary);white-space:nowrap;text-align:center;grid-row:1;display:flex;align-items:center;justify-content:center;height:100%}.day-label{font-size:.625rem;color:var(--text-secondary);text-align:right;padding-right:8px;line-height:12px;grid-column:1}.heatmap-cell{width:12px;height:12px;border-radius:2px;cursor:pointer;transition:all .2s ease;border:1px solid transparent}.heatmap-cell-last-of-month{border-bottom:1px solid brown!important;box-shadow:0 1px brown}.heatmap-cell:hover{border-color:var(--accent-color);transform:scale(1.2);z-index:10}.heatmap-cell.intensity-0{background-color:var(--heatmap-empty, #ebedf0)}[data-theme=dark] .heatmap-cell.intensity-0{background-color:var(--heatmap-empty, #161b22)}.heatmap-cell.intensity-1{background-color:var(--heatmap-low, #9be9a8)}[data-theme=dark] .heatmap-cell.intensity-1{background-color:var(--heatmap-low, #0e4429)}.heatmap-cell.intensity-2{background-color:var(--heatmap-medium, #40c463)}[data-theme=dark] .heatmap-cell.intensity-2{background-color:var(--heatmap-medium, #006d32)}.heatmap-cell.intensity-3{background-color:var(--heatmap-high, #30a14e)}[data-theme=dark] .heatmap-cell.intensity-3{background-color:var(--heatmap-high, #26a641)}.heatmap-cell.intensity-4{background-color:var(--heatmap-max, #216e39)}[data-theme=dark] .heatmap-cell.intensity-4{background-color:var(--heatmap-max, #39d353)}.heatmap-legend{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border-color)}.legend-label{font-size:.75rem;color:var(--text-secondary)}.legend-cells{display:flex;gap:3px}.legend-cell{width:12px;height:12px;border-radius:2px}.legend-cell.intensity-0{background-color:var(--heatmap-empty, #ebedf0)}.legend-cell.intensity-1{background-color:var(--heatmap-low, #9be9a8)}.legend-cell.intensity-2{background-color:var(--heatmap-medium, #40c463)}.legend-cell.intensity-3{background-color:var(--heatmap-high, #30a14e)}.legend-cell.intensity-4{background-color:var(--heatmap-max, #216e39)}[data-theme=dark] .legend-cell.intensity-0{background-color:var(--heatmap-empty, #161b22)}[data-theme=dark] .legend-cell.intensity-1{background-color:var(--heatmap-low, #0e4429)}[data-theme=dark] .legend-cell.intensity-2{background-color:var(--heatmap-medium, #006d32)}[data-theme=dark] .legend-cell.intensity-3{background-color:var(--heatmap-high, #26a641)}[data-theme=dark] .legend-cell.intensity-4{background-color:var(--heatmap-max, #39d353)}@media (max-width: 768px){.activity-heatmap{padding:1rem}.heatmap-header{flex-direction:column;align-items:flex-start}.heatmap-container{overflow-x:scroll}.heatmap-grid{grid-auto-columns:10px;grid-template-rows:repeat(7,10px)}.heatmap-cell{width:10px;height:10px}.heatmap-months{grid-auto-columns:13px}.day-label{font-size:.55rem}}.profile-page{min-height:100vh;background:var(--background);padding:2rem}.profile-container{max-width:1200px;margin:0 auto}.profile-header{margin-bottom:2rem}.back-button{background:none;border:none;color:var(--text-secondary);font-size:.95rem;cursor:pointer;padding:.5rem 0;margin-bottom:1.5rem;transition:color .2s ease;display:flex;align-items:center;gap:.25rem}.back-button:hover{color:var(--accent-color)}.profile-info{display:flex;align-items:center;gap:1.5rem;padding:2rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--border-color)}.profile-avatar{font-size:4rem;width:100px;height:100px;display:flex;align-items:center;justify-content:center;background:var(--background);border-radius:50%;border:3px solid var(--border-color);flex-shrink:0;transition:transform .15s cubic-bezier(.7,.98,.86,.98);overflow:hidden}.profile-avatar[style*=pointer]{padding:3px;background:var(--accent-gradient);border:none}.profile-avatar img{width:100%;height:100%;border-radius:50%;-o-object-fit:cover;object-fit:cover;display:block}.profile-avatar[style*=pointer] img{width:calc(100% - 6px);height:calc(100% - 6px);border:2px solid var(--surface);box-sizing:border-box}.profile-avatar[style*=pointer]:hover{transform:scale(1.1);cursor:pointer}.profile-details{flex:1}.profile-details h1{margin:0 0 .5rem;font-size:2rem;font-weight:600;color:var(--text-primary)}.profile-email{margin:0 0 1rem;font-size:1rem;color:var(--text-secondary)}.profile-meta{display:flex;gap:1rem;font-size:.875rem;color:var(--text-secondary)}.profile-id{font-family:monospace;background:var(--background);padding:.25rem .5rem;border-radius:4px}.profile-sync{display:flex;align-items:center;gap:.25rem}.profile-content{display:flex;flex-direction:column;gap:2rem}.profile-section{width:100%}.profile-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;text-align:center;gap:1.5rem;padding:2rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--border-color)}.profile-empty h2{margin:0;font-size:1.5rem;color:var(--text-primary)}.profile-empty p{margin:0;font-size:1rem;color:var(--text-secondary)}@media (max-width: 768px){.profile-page{padding:1rem}.profile-info{flex-direction:column;text-align:center;padding:1.5rem}.profile-avatar{font-size:3rem;width:80px;height:80px}.profile-details h1{font-size:1.5rem}.profile-meta{flex-direction:column;gap:.5rem}}.profile-section h2{margin:0 0 1rem;font-size:1.25rem;font-weight:600;color:var(--text-primary)}.profile-social-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;padding:2rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--border-color)}.profile-social-avatar{width:3rem;height:3rem;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:2px solid var(--border-color)}.profile-social-avatar-button{border:none;background:transparent;padding:2px;cursor:pointer;transition:transform .15s cubic-bezier(.7,.98,.86,.98);border-radius:50%;background:var(--accent-gradient);display:inline-flex;align-items:center;justify-content:center}.profile-social-avatar-button:hover{transform:scale(1.1)}.profile-social-avatar-button .profile-social-avatar{width:calc(3rem - 4px);height:calc(3rem - 4px);border-radius:50%;-o-object-fit:cover;object-fit:cover;display:block;border:2px solid var(--surface);box-sizing:border-box}.profile-social-avatar-placeholder{width:3rem;height:3rem;border-radius:50%;background:var(--background);display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--text-secondary);border:2px solid var(--border-color)}.profile-social-info{display:flex;flex-direction:column;align-items:center;gap:.25rem;width:100%}.profile-social-name{font-size:.875rem;font-weight:500;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;max-width:100%;color:var(--text-primary)}.profile-social-badge{font-size:.75rem;padding:.125rem .5rem;border-radius:9999px;font-weight:500}.profile-social-badge.friend{background:#dcfce7;color:#166534}.profile-social-badge.following{background:#dbeafe;color:#1e40af}.app{max-width:1200px;margin:0 auto;padding:2rem;min-height:100vh}body,.app{background:var(--background);color:var(--text-primary)}.app-header{text-align:center;margin-bottom:3rem;padding-bottom:1.5rem;border-bottom:2px solid var(--border)}.app-header h1{font-size:2.5rem;margin-bottom:.5rem;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.app-header p{font-size:1.1rem;color:var(--text-secondary)}.app-main{animation:fadeIn .5s ease-in}.app-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:1rem}/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}:root{--font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;--spacing-xs:.25rem;--spacing-sm:.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:50%;--transition-fast:.1s;--transition-normal:.2s;--transition-slow:.3s;--z-base:0;--z-sticky:10;--z-shimmer:20;--z-drag:500;--z-overlay:1000;--z-tooltip:1100;--z-auth-overlay:9999;--shadow-sm:0 1px 4px #0000000a;--shadow-md:0 4px 12px #0000001a;--shadow-lg:0 8px 24px #0003;--shadow-xl:0 20px 60px #00000080;--button-bg:#f59e0b;--button-bg-small:var(--button-bg);--button-bg-primary:linear-gradient(135deg,#667eea 0%,#764ba2 100%);--button-bg-signup:#3b82f6;--button-bg-login:#fff;--button-bg-account:#3b82f6;--button-bg-leaderboard:#f59e0b;--button-text:#fff;--background:#f0f0f0;--background-alt:#f4f3ef;--surface:#efeee8;--surface-secondary:#eae8e0;--surface-menu:#e5e3d9;--surface-border:#e5e3d9;--text-primary:#000;--text-secondary:#484b6a;--text-muted:#888;--border:#e5e3d9;--accent:#667eea;--accent-secondary:#764ba2;--accent-gradient:linear-gradient(135deg,#667eea 0%,#764ba2 100%);--success:#10b981;--warning:#f59e0b;--error:#dc2626;--error-hover:#b91c1c}[data-theme=dark]{--button-bg:#2a2a2a;--button-bg-small:var(--button-bg);--button-bg-primary:#2a2a2a;--button-bg-signup:#2a2a2a;--button-bg-login:#2a2a2a;--button-bg-account:#2a2a2a;--button-bg-leaderboard:#2a2a2a;--background:#18181b;--background-alt:#1a1a1a;--surface:#23232a;--surface-secondary:#2a2a2a;--surface-menu:#23232a;--surface-border:#333;--text-primary:#f3f3f3;--text-secondary:#aaa;--text-muted:#888;--border:#333}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);color:var(--text-primary);background-color:var(--background);font-synthesis:none;min-width:320px;min-height:100vh;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.5}#root{min-height:100vh}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.loading-spinner{border:4px solid var(--border);border-top-color:var(--accent);border-radius:var(--radius-full);width:50px;height:50px;animation:1s linear infinite spin}.loading-spinner--small{border-width:2px;width:24px;height:24px}.text-right{text-align:right}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.gap-2{gap:.5rem}.gap-4{gap:1rem}.error-message{color:#dc2626;border-radius:var(--radius-md);background:#fee2e2;padding:.75rem;font-size:.875rem}.success-message{color:#166534;border-radius:var(--radius-md);background:#dcfce7;padding:.75rem;font-size:.875rem}.empty-state,.stats-loading,.stats-error,.no-stats{text-align:center;color:var(--text-muted);padding:3rem}.stats-loading{align-items:center;gap:var(--spacing-md);flex-direction:column;display:flex}button{cursor:pointer;background:0 0;border:none;font-family:inherit;font-size:1em}button:disabled{cursor:not-allowed;opacity:.5}.btn-primary{transition:transform var(--transition-normal),box-shadow var(--transition-normal);background:var(--button-bg-primary)!important;color:#fff!important;border-radius:var(--radius-md)!important;border:none!important;padding:.7em 1.5em!important;font-size:1rem!important;font-weight:600!important}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-secondary{background:var(--surface-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-md);transition:background var(--transition-normal),border-color var(--transition-normal);padding:.65rem 1.25rem;font-size:.95rem;font-weight:500}.btn-secondary:hover:not(:disabled){background:var(--surface);border-color:var(--accent)}.btn-secondary.active{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-action{background:var(--button-bg);color:var(--button-text);border-radius:var(--radius-md);transition:transform var(--transition-fast),filter var(--transition-normal);border:none;padding:.7em 1.5em;font-size:.95rem;font-weight:600}.btn-action:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px)}.btn-small{background:var(--button-bg-small);color:var(--button-text);border-radius:var(--radius-sm);transition:background var(--transition-normal);border:none;padding:.4rem .8rem;font-size:.85rem;font-weight:500}.btn-small:hover:not(:disabled){filter:brightness(1.1)}.btn-icon{border-radius:var(--radius-full);background:var(--button-bg);width:2.5rem;height:2.5rem;color:var(--text-primary);box-shadow:var(--shadow-sm);transition:background var(--transition-normal),color var(--transition-normal);justify-content:center;align-items:center;font-size:1.5rem;display:inline-flex}.btn-icon:hover{background:var(--surface-secondary);color:var(--accent)}.btn-danger{background:var(--error);color:#fff;border-radius:var(--radius-md);transition:background var(--transition-normal),transform var(--transition-fast);padding:.65rem 1.25rem;font-size:.95rem;font-weight:600}.btn-danger:hover:not(:disabled){background:var(--error-hover);transform:translateY(-1px)}.btn-remove,.btn-remove-game{border-radius:var(--radius-sm);opacity:.7;transition:background var(--transition-normal),transform var(--transition-fast),opacity var(--transition-normal);background:0 0;border:none;padding:.25rem;font-size:1.2rem}.btn-remove:hover,.btn-remove-game:hover{opacity:1;background:#f44;transform:scale(1.1)}.modal-close{color:#9ca3af;border-radius:var(--radius-sm);cursor:pointer;width:28px;height:28px;transition:background var(--transition-normal),color var(--transition-normal);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:1.5rem;font-weight:700;line-height:1;display:flex;position:absolute;top:12px;right:12px}.modal-close:hover{color:#374151}.btn-login{background:var(--button-bg-login)!important;color:#000!important;border:1px solid var(--border)!important}.btn-signup{background:var(--button-bg-signup)!important}.btn-account{background:var(--button-bg-account)!important}.btn-leaderboard{background:var(--button-bg-leaderboard)!important}.btn-link{color:#3b82f6;font-size:inherit;cursor:pointer;transition:color var(--transition-normal),-webkit-text-decoration var(--transition-normal);transition:color var(--transition-normal),text-decoration var(--transition-normal);transition:color var(--transition-normal),text-decoration var(--transition-normal),-webkit-text-decoration var(--transition-normal);background:0 0;border:none;padding:0;font-weight:500;text-decoration:none}.btn-link:hover{color:#2563eb;text-decoration:underline}.error-message{color:#dc2626;background-color:#fee2e2;border:1px solid #fecaca;border-radius:.375rem;padding:.75rem;font-size:.875rem}.info-banner{border-radius:var(--radius-md);color:#1565c0;background-color:#e3f2fd;border:1px solid #90caf9;padding:.75rem 1rem;font-size:.875rem;font-weight:500}.follow-button-container{flex-direction:column;justify-content:center;align-items:flex-start;gap:.5rem;width:100%;display:flex}.follow-button-container button{align-self:flex-start;min-width:120px}.btn-primary.loading,.btn-secondary.loading{animation:1s infinite pulse}.follow-error{color:var(--error-color,#e74c3c);text-align:center;font-size:.75rem}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.btn-edit{background:var(--button-bg);color:#fff;cursor:pointer;border:none;border-radius:6px;min-width:auto;padding:.4em .8em;transition:background .2s}.btn-edit:hover{background:#d97706}.btn-leaderboard:hover{background:#d97706;transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b66}.btn-login:hover{background:#f0f9ff;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.btn-signup:hover,.btn-account:hover{background:#2563eb;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.btn-action:hover,.btn-small:hover{background:#484b6a}.button-group{margin-bottom:var(--spacing-md);flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.btn-group-item{cursor:pointer;color:#374151;background-color:#e5e7eb;border:1px solid #0000;border-radius:.375rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;transition:background-color .2s,color .2s,border-color .2s,transform .2s}.btn-group-item:hover:not(.active){background-color:#d1d5db;transform:translateY(-1px)}.btn-group-item.active{color:#fff;background-color:#3b82f6}.btn-group-item.active:hover{background-color:#2563eb}.toggle-switch{--width:300px;--height:40px;width:var(--width);height:var(--height);background:var(--surface-secondary);border:1px solid var(--border);cursor:pointer;border-radius:.5rem;align-items:center;padding:4px;transition:background .18s,box-shadow .18s,border-color .18s;display:inline-flex;position:relative}.toggle-switch:focus{outline-offset:2px;outline:2px solid #3b82f61f}.toggle-switch-label{z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;height:100%;color:var(--text-secondary);border-radius:.375rem;flex:50%;justify-content:center;align-items:center;padding:0 8px;font-size:.95rem;transition:color .16s,font-weight .16s,opacity .16s,background .16s;display:inline-flex}.toggle-switch-label.left,.toggle-switch-label.right{border-radius:.375rem}.toggle-switch.off .toggle-switch-label.left,.toggle-switch.on .toggle-switch-label.right{background:var(--accent);color:#fff;font-weight:600}.toggle-switch-knob{background:var(--surface);z-index:0;border-radius:.375rem;width:calc(50% - 8px);height:calc(100% - 8px);transition:left .22s cubic-bezier(.2,.9,.3,1),background .16s;position:absolute;top:4px;left:4px;box-shadow:0 6px 14px #0c142814}.toggle-switch.on .toggle-switch-knob{left:calc(50% + 4px)}@media (max-width:520px){.toggle-switch{--width:240px;--height:36px}}.form-group{gap:var(--spacing-sm);flex-direction:column;display:flex}.form-group label{color:var(--text-primary);font-weight:500}.form-input{border-radius:var(--radius-sm);border:1px solid var(--border);background-color:var(--surface-secondary);width:100%;color:var(--text-primary);transition:border-color var(--transition-normal);padding:.5em;font-family:inherit;font-size:1em}.form-group select{cursor:pointer}.form-group textarea,textarea.form-input{resize:vertical;min-height:100px}.form-input:focus{border-color:var(--accent);outline:none}.form-input:disabled{opacity:.6;cursor:not-allowed}.auth-modal .form-input{color:#111827;background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;padding:.625rem .75rem}.auth-modal .form-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.auth-modal .form-group label{color:#374151}.auth-modal .required{color:#dc2626}select,.form-select{background-color:var(--surface-secondary,white);width:100%;color:var(--text-primary);cursor:pointer;transition:border-color var(--transition-normal),box-shadow var(--transition-normal);border:1px solid #d1d5db;border-radius:.375rem;padding:.75rem;font-size:1rem}select:focus,.form-select:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 3px #3b82f61a}label,.form-label{color:var(--text-primary);margin-bottom:.5rem;font-size:.875rem;font-weight:500;display:block}.required{color:var(--error)}.form-hint{color:var(--text-muted);margin-top:var(--spacing-xs);font-size:.85rem}.parse-message{color:var(--success);animation:fadeIn var(--transition-slow)ease-in;margin-left:.75rem;font-size:.85rem;font-weight:400}.form-field-row{padding-top:.75rem;padding-bottom:.75rem}.form-field-row label{width:150px;min-width:150px;display:inline-block}.form-section{gap:var(--spacing-md);flex-direction:column;display:flex}.form-section h3{color:var(--accent);margin:0;font-size:1.1rem}.checkbox-group{gap:var(--spacing-sm);flex-direction:column;display:flex}.checkbox-label{cursor:pointer;background:var(--surface-secondary);border-radius:var(--radius-md);transition:background var(--transition-normal);-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;gap:.75rem;padding:.75rem;display:flex}.checkbox-label:hover{background:var(--surface)}.checkbox-label input[type=checkbox]{cursor:pointer;width:20px;height:20px;accent-color:var(--accent);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-alt);border:2px solid var(--accent);border-radius:var(--radius-sm);transition:background var(--transition-normal),border-color var(--transition-normal);position:relative}.checkbox-label input[type=checkbox]:checked{background-color:var(--accent);border-color:var(--accent)}.checkbox-label input[type=checkbox]:checked:after{content:"";background:#fff;border-radius:2px;width:12px;height:12px;display:block;position:absolute;top:2px;left:2px}.checkbox-label span{flex:1;font-size:.95rem}.form-group input,.form-group select,.form-group textarea{background-color:var(--surface-secondary,#2a2a2a);border-color:var(--border,#555)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent,#667eea)}.form-section h3{color:var(--accent,#667eea)}.modal-overlay{z-index:var(--z-overlay);padding:var(--spacing-md);animation:fadeIn var(--transition-normal)ease-out;background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;top:0;right:0;bottom:0;left:0}.modal-overlay.auth-overlay{z-index:var(--z-auth-overlay)}.modal-overlay.leaderboard-overlay{z-index:calc(var(--z-overlay) + 100);background-color:#00000080}.modal-content{background:var(--surface);border-radius:var(--radius-xl);width:100%;max-width:600px;max-height:90vh;box-shadow:var(--shadow-xl);animation:slideUp var(--transition-slow)ease-out;flex-direction:column;display:flex;position:relative;overflow:auto}.modal-content.leaderboard-modal,.modal-content.user-profile-modal{background:var(--surface);max-width:56rem;max-height:80vh;color:var(--text-primary);padding:1.5rem}.modal-header{padding:var(--spacing-lg);border-bottom:2px solid var(--surface-border);background:var(--surface);z-index:var(--z-sticky);justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.modal-header h2{margin:0;font-size:1.5rem;font-weight:700}.auth-modal .modal-header,.leaderboard-modal .modal-header,.user-profile-modal .modal-header{border-bottom:2px solid var(--border);padding:0 0 var(--spacing-lg)0;background:0 0;position:relative}.leaderboard-modal .modal-header h2,.user-profile-modal .modal-header h2{color:var(--text-primary);font-size:1.5rem}.modal-body{padding:var(--spacing-lg);flex:1;overflow-y:auto}.modal-actions{gap:var(--spacing-md);padding:var(--spacing-lg);border-top:2px solid var(--surface-border);background:var(--surface);z-index:1;justify-content:flex-end;margin-top:auto;display:flex;position:sticky;bottom:0}.modal-actions button{flex:1}.stats-modal{max-width:700px}.ticket-modal{min-width:320px;max-width:400px}.score-entry-modal{max-width:650px}.auth-modal{border-radius:var(--radius-md);padding:var(--spacing-lg);width:100%;max-width:28rem;box-shadow:var(--shadow-lg);color:#000;animation:slideUp var(--transition-slow)ease-out;background:#fff;position:relative}.auth-modal h2{margin:0 0 1rem;font-size:1.5rem;font-weight:700}.auth-modal-footer{text-align:center;color:#6b7280;margin-top:1rem;font-size:.875rem}.pfp-picker-modal{max-width:480px}.pfp-grid{gap:var(--spacing-md);flex-wrap:wrap;justify-content:center;display:flex}.pfp-option{border-radius:var(--radius-full);-o-object-fit:cover;object-fit:cover;cursor:pointer;border:2px solid var(--border);width:80px;height:80px;transition:border-color var(--transition-normal),transform var(--transition-normal)}.pfp-option:hover{border-color:var(--accent);transform:scale(1.05)}@media (max-width:640px){.modal-content{border-radius:0;max-height:100vh}.modal-actions{flex-direction:column-reverse}.auth-modal{max-width:calc(100% - 2rem);margin:1rem}}.tooltip-with-arrow{z-index:var(--z-tooltip)}.account-menu-overlay{z-index:var(--z-auth-overlay)}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.static{position:static}.sticky{position:sticky}.container{width:100%}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.table{display:table}.w-full{width:100%}.flex-1{flex:1}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.overflow-auto{overflow:auto}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.text-center{text-align:center}.text-left{text-align:left}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition\!{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events!important;transition-timing-function:var(--tw-ease,ease)!important;transition-duration:var(--tw-duration,0s)!important}input,textarea{border:1px solid var(--border,#555);background-color:var(--surface-secondary,#2a2a2a);color:inherit;border-radius:4px;padding:.5em;font-family:inherit;font-size:1em}input:focus,textarea:focus{border-color:var(--accent,#646cff);outline:none}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}