.page-header{text-align:center;margin:2.5rem 0 1.875rem;padding:0 1.25rem 1.25rem;border-bottom:2px solid var(--bg-input)}.page-title{display:flex;justify-content:center;align-items:center;gap:.625rem;margin:0 0 .9375rem}.filter-group select,.filter-group .dropdown-container input,.filter-group .checkbox-group,.filter-group .reset-button{min-height:3rem;box-sizing:border-box}.filter-group select{padding:.75rem var(--spacing-sm)}.filter-group .checkbox-group{padding:.75rem var(--spacing-sm);display:flex;align-items:center}.filter-group .reset-button{padding:.75rem 1.25rem;display:flex;align-items:center;justify-content:center;white-space:nowrap}.header-status-row{display:flex;justify-content:center;align-items:center;gap:.625rem;flex-wrap:wrap}.data-age-indicator{font-size:.9em;margin:0;padding:.5rem 1rem;background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);border-radius:var(--radius-sm);display:inline-flex;align-items:center;height:2.25rem;box-sizing:border-box;transition:all .3s ease}body.dark-mode .data-age-indicator{background-color:var(--overlay-heavy);border:none;color:inherit}.data-age-indicator i{margin-right:.5rem}@keyframes pulse-error{0%,to{opacity:1}50%{opacity:.7}}.data-age-indicator[style*="rgb(231, 76, 60)"]{animation:pulse-error 2s ease-in-out infinite}.refresh-button-compact{padding:.5rem 1rem;font-size:.9em;font-weight:700;color:#fff;background-color:var(--success-color);border:2px solid #1e8449;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);display:inline-flex;align-items:center;justify-content:center;gap:.375rem;height:2.25rem;min-width:auto;white-space:nowrap;box-sizing:border-box}.refresh-button-compact:hover:not(:disabled){background-color:#1e8449;transform:translateY(-.0625rem);box-shadow:0 2px .5rem #27ae6033}.refresh-button-compact:disabled{opacity:.6;cursor:not-allowed;background-color:#bdc3c7;border-color:#95a5a6;transform:none;box-shadow:none}body.dark-mode .refresh-button-compact{color:var(--text-primary);border:2px solid #229954}body.dark-mode .refresh-button-compact:hover:not(:disabled){background-color:#229954;box-shadow:0 2px .5rem #27ae604d}body.dark-mode .refresh-button-compact:disabled{background-color:#95a5a6;border-color:#7f8c8d}.refresh-button-compact i{transition:transform .3s ease;font-size:1.1em}.refresh-button-compact.loading i{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#image-popup{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#fffffff2;z-index:1000;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity var(--transition-base),visibility var(--transition-base)}body.dark-mode #image-popup{background-color:var(--overlay-opaque)}#image-popup.visible{opacity:1;visibility:visible}.image-popup-content{position:relative;max-width:90%;max-height:90%;display:flex;flex-direction:column;align-items:center}.popup-image{max-width:100%;max-height:80vh;object-fit:contain;border-radius:var(--radius-md);box-shadow:var(--shadow-xl)}.popup-skin-info{margin-top:.9375rem;text-align:center;color:var(--text-primary);background-color:#fffffffa;border:1px solid var(--border-color);box-shadow:var(--shadow-md);padding:.75rem 1.25rem;border-radius:var(--radius-md);max-width:37.5rem}body.dark-mode .popup-skin-info{background-color:var(--overlay-opaque);border:none;box-shadow:none}.popup-skin-info .popup-skin-name{font-size:1.3em;font-weight:700;margin-bottom:.3125rem;text-shadow:none;color:var(--text-primary)}.popup-skin-info .popup-char-name{font-size:1em;color:var(--text-muted)}.close-image-popup-btn{position:absolute;top:-2.5rem;right:0;background:none;border:none;font-size:3em;color:var(--text-primary);cursor:pointer;line-height:1;transition:color var(--transition-fast),transform var(--transition-fast);text-shadow:0 2px .5rem rgba(0,0,0,.8)}.close-image-popup-btn:hover{color:#ff6b6b;transform:scale(1.1)}.leaderboard-section{max-width:50rem;margin:0 auto 1.875rem;padding:0 1.25rem}.leaderboard-toggle{width:100%;padding:.75rem 1.25rem;font-size:1.1em;font-weight:700;color:var(--text-primary);background-color:var(--primary-color);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast);text-align:center}.leaderboard-toggle:hover{background-color:var(--primary-hover)}.leaderboard-content{max-height:0;overflow:hidden;background-color:var(--bg-secondary);border-radius:0 0 var(--radius-md) var(--radius-md);transition:max-height .5s ease-in-out,padding .5s ease-in-out;padding:0 1.25rem}.leaderboard-content.visible{max-height:62.5rem;padding:.9375rem 1.25rem;border:1px solid var(--border-color);border-top:none}.leaderboard-item{display:grid;grid-template-columns:1.875rem 3.125rem 1fr auto;gap:.9375rem;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--bg-input)}.leaderboard-item:last-child{border-bottom:none}.leaderboard-rank{font-size:1.1em;font-weight:700;color:var(--text-muted);text-align:center}.leaderboard-image{width:3.125rem;height:4.0625rem;object-fit:cover;border-radius:var(--radius-sm);background-color:var(--bg-tertiary)}.leaderboard-details .skin-name{font-size:1em;font-weight:700;color:var(--text-primary)}.leaderboard-details .char-name{font-size:.8em;color:var(--text-muted)}.leaderboard-score{text-align:right}.leaderboard-score .avg-score{font-size:1.1em;font-weight:700;color:#ffc107}.leaderboard-score .total-votes{font-size:.75em;color:var(--text-dim)}.poll-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(11.25rem,1fr));gap:.9375rem;padding:0 1.25rem 1.25rem}.poll-box{background-color:var(--bg-secondary);border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border-color);box-shadow:0 2px 8px #0000000f;display:flex;flex-direction:column}.poll-box:hover{box-shadow:0 4px 12px #0071eb1f}body.dark-mode .poll-box{border:1px solid var(--bg-input);box-shadow:none}body.dark-mode .poll-box:hover{box-shadow:none}.poll-image{width:100%;aspect-ratio:3 / 4;object-fit:contain;background-color:var(--bg-tertiary);cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.poll-image:hover{transform:scale(1.02);box-shadow:0 4px 12px #7289da80}.poll-info{padding:.625rem;display:flex;flex-direction:column;flex-grow:1}.poll-info h3{margin:0 0 .1875rem;color:var(--text-primary);font-size:.95em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poll-info .character-name{font-size:.75em;color:var(--text-muted);margin-bottom:.375rem}.info-line{font-size:.75em;color:var(--text-muted)}.info-line strong{color:var(--text-dim)}.info-line:last-of-type{margin-bottom:.375rem}.rating-area{margin-top:.375rem;border-top:1px solid var(--bg-input);padding-top:.5rem}.vote-widget{display:flex;justify-content:center;align-items:center;gap:.375rem;margin-bottom:.1875rem}.vote-label{font-size:.9em;font-weight:700;color:#7c97c0;position:relative;top:2px}.star-rating{display:flex;flex-direction:row-reverse;justify-content:center}.star-rating input{display:none}.star-rating label{font-size:1.5em;color:#444;cursor:pointer;transition:color var(--transition-fast),text-shadow var(--transition-fast)}.star-rating:not(.voted):hover label:hover,.star-rating:not(.voted):hover label:hover~label{color:#ffc107}.rating-area.voted .star-rating label{cursor:not-allowed}.rating-area.voted .star-rating input:checked~label{color:#03a9f4}.confirm-vote-message{text-align:center;font-size:.7em;color:#4caf50;margin-top:.1875rem;height:0;opacity:0;transition:all var(--transition-base)}.rating-area.pending-vote .confirm-vote-message{height:1em;opacity:1}@keyframes pulse-glow{0%{text-shadow:0 0 4px #4caf50}50%{text-shadow:0 0 12px #81c784,0 0 20px #4caf50}to{text-shadow:0 0 4px #4caf50}}.rating-area.pending-vote .star-rating input:checked~label{color:#4caf50;animation:pulse-glow 1.5s ease-in-out infinite}@keyframes pop-effect{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}.rating-area.voted-animation .star-rating{animation:pop-effect .3s ease-in-out}.poll-results{margin-top:.375rem;text-align:center}.score-bar-visual{position:relative;display:inline-block;font-size:1.2em;line-height:1;color:#444;margin-bottom:.1875rem}.score-bar-foreground{position:absolute;top:0;left:0;white-space:nowrap;overflow:hidden;color:#ffc107}.score-bar-text{font-size:.85em;color:var(--text-muted)}.score-bar-text strong{font-size:1.05em;color:var(--text-primary);font-weight:700}.vote-count-number{color:var(--primary-color)}.info-text{color:var(--text-muted)}.vote-btn{box-shadow:0 4px 12px #0071eb33}.selected-indicator{color:var(--text-muted)}.stat-value{color:var(--primary-color)}.vote-date-label{color:var(--text-muted)}.vote-date{color:var(--warning-color)}.toggle-stats-btn{color:var(--primary-color)}.toggle-stats-btn:hover{color:var(--primary-hover)}.toggle-stats-btn.active{color:var(--success-color);text-shadow:none}.selected-skin-name{color:var(--success-color)}.form-disclaimer{color:var(--text-muted)}.submit-vote-btn{background-color:var(--primary-color)}.submit-vote-btn:hover:not(:disabled){background-color:var(--primary-hover)}.cancel-vote-btn{background-color:var(--danger-color)}.cancel-vote-btn:hover:not(:disabled){background-color:var(--danger-hover)}.loading-indicator,.no-results{color:var(--text-muted);text-align:center;grid-column:1 / -1;font-size:1.2em;padding:2.5rem}.skeleton-card .skeleton-image{width:100%;aspect-ratio:3 / 4;border-radius:var(--radius-sm) var(--radius-sm) 0 0}.skeleton-card .skeleton-info{padding:.625rem}.skeleton-card .skeleton-line{height:.9em;margin-bottom:.375rem}.skeleton-card .skeleton-line.short{width:60%}.notification{position:fixed;top:1.25rem;right:1.25rem;padding:.9375rem 1.25rem;border-radius:var(--radius-md);font-size:1em;font-weight:700;color:var(--text-primary);z-index:2000;box-shadow:var(--shadow-lg);animation:slideIn .3s ease-out forwards}.notification-info{background-color:var(--info-color)}.notification-success{background-color:var(--success-color)}.notification-error{background-color:var(--danger-color)}.notification.hide{animation:slideOut .3s ease-out forwards}@keyframes slideIn{0%{transform:translate(25rem);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOut{0%{transform:translate(0);opacity:1}to{transform:translate(25rem);opacity:0}}@media (max-width: 768px){body{padding:0 .625rem}.page-header{margin-top:1.25rem;padding-bottom:.9375rem;padding-left:.625rem;padding-right:.625rem}.page-title{font-size:1.3em;margin-bottom:.625rem}.header-status-row{gap:.5rem}.data-age-indicator{font-size:.85em;padding:.375rem .75rem;height:2rem}.refresh-button-compact{padding:.375rem .75rem;font-size:.85em;height:2rem}.refresh-button-compact i{font-size:1em}.leaderboard-section{padding:0 .625rem}.leaderboard-toggle{font-size:1em;padding:.625rem 1rem}.leaderboard-item{grid-template-columns:1.5625rem 2.8125rem 1fr auto;gap:.625rem;padding:.375rem 0}.leaderboard-rank{font-size:.9em}.leaderboard-image{width:2.8125rem;height:3.625rem}.leaderboard-details .skin-name{font-size:.9em}.leaderboard-details .char-name{font-size:.75em}.leaderboard-score .avg-score{font-size:1em}.leaderboard-score .total-votes{font-size:.7em}.poll-container{grid-template-columns:repeat(2,1fr);gap:.625rem;padding:0 .625rem 1.25rem}.poll-box{font-size:.9em}.poll-info{padding:.5rem}.poll-info h3{font-size:.9em;margin-bottom:.1875rem}.poll-info .character-name{font-size:.8em;margin-bottom:.375rem}.info-line{font-size:.75em;line-height:1.4}.vote-widget{gap:.25rem;margin-bottom:.125rem}.vote-label{font-size:.9em}.star-rating label{font-size:1.6em}.confirm-vote-message{font-size:.75em}.score-bar-visual{font-size:1.3em}.score-bar-text{font-size:.8em}.score-bar-text strong{font-size:1.05em}.image-popup-content{max-width:95%;max-height:95%}.popup-image{max-height:70vh}.popup-skin-info{padding:.625rem .9375rem;margin-top:.625rem}.popup-skin-info .popup-skin-name{font-size:1.1em}.popup-skin-info .popup-char-name{font-size:.9em}.close-image-popup-btn{top:-2.1875rem;font-size:2.5em}.notification{top:.625rem;right:.625rem;left:.625rem;padding:.75rem 1rem;font-size:.9em}.filter-group select,.filter-group .dropdown-container input,.filter-group .checkbox-group,.filter-group .reset-button{min-height:2.5rem}.filter-group select,.filter-group .checkbox-group{padding:.5rem var(--spacing-xs)}.filter-group .reset-button{padding:.5rem 1rem}}