:root {
                    --primary-pink: #ff6b9d;
                    --primary-blue: #4dabf7;
                    --primary-yellow: #ffd43b;
                    --primary-green: #51cf66;
                    --primary-purple: #9775fa;
                    --primary-orange: #ff8c42;
                    --text-dark: #2d3436;
                    --bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
                    --shadow-glow: 0 0 30px rgba(255, 107, 157, 0.3);
                }
                
                body {
                    font-family: 'Poppins', sans-serif;
                    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
                    min-height: 100vh;
                    position: relative;
                }
                
                body::before {
                    content: '';
                    position: fixed;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    background: radial-gradient(circle at 20% 80%, rgba(120, 119, 198, 0.3) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(255, 107, 157, 0.3) 0%, transparent 50%), radial-gradient(circle at 40% 40%, rgba(81, 207, 102, 0.2) 0%, transparent 50%);
                    pointer-events: none;
                    z-index: -1;
                }
                
                .page-title {
                    font-family: 'Fredoka One', cursive;
                    font-size: 3.5rem;
                    text-align: center;
                    color: white;
                    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
                    margin: 40px 0 60px 0;
                    animation: titleBounce 2s ease-in-out infinite alternate;
                }
                
                @keyframes titleBounce {
                    0% {
                        transform: translateY(0px) scale(1);
                    }
                    100% {
                        transform: translateY(-10px) scale(1.05);
                    }
                }
                
                .floating-shapes {
                    position: fixed;
                    width: 100%;
                    height: 100%;
                    overflow: hidden;
                    top: 0;
                    left: 0;
                    z-index: -1;
                }
                
                .cartoon-shape {
                    position: absolute;
                    opacity: 0.15;
                    animation: cartoonFloat 15s infinite linear;
                    font-size: 4rem;
                }
                
                .cartoon-shape:nth-child(1) {
                    left: 5%;
                    animation-delay: 0s;
                    animation-duration: 20s;
                }
                
                .cartoon-shape:nth-child(2) {
                    left: 15%;
                    animation-delay: 3s;
                    animation-duration: 18s;
                }
                
                .cartoon-shape:nth-child(3) {
                    left: 25%;
                    animation-delay: 6s;
                    animation-duration: 22s;
                }
                
                .cartoon-shape:nth-child(4) {
                    left: 35%;
                    animation-delay: 9s;
                    animation-duration: 16s;
                }
                
                .cartoon-shape:nth-child(5) {
                    left: 45%;
                    animation-delay: 12s;
                    animation-duration: 24s;
                }
                
                .cartoon-shape:nth-child(6) {
                    left: 55%;
                    animation-delay: 15s;
                    animation-duration: 19s;
                }
                
                .cartoon-shape:nth-child(7) {
                    left: 65%;
                    animation-delay: 18s;
                    animation-duration: 21s;
                }
                
                .cartoon-shape:nth-child(8) {
                    left: 75%;
                    animation-delay: 21s;
                    animation-duration: 17s;
                }
                
                .cartoon-shape:nth-child(9) {
                    left: 85%;
                    animation-delay: 24s;
                    animation-duration: 23s;
                }
                
                .cartoon-shape:nth-child(10) {
                    left: 95%;
                    animation-delay: 27s;
                    animation-duration: 20s;
                }
                
                @keyframes cartoonFloat {
                    0% {
                        transform: translateY(100vh) rotate(0deg) scale(0.8);
                        opacity: 0.1;
                    }
                    10% {
                        opacity: 0.15;
                        transform: translateY(90vh) rotate(36deg) scale(1);
                    }
                    50% {
                        transform: translateY(50vh) rotate(180deg) scale(1.2);
                        opacity: 0.2;
                    }
                    90% {
                        opacity: 0.15;
                        transform: translateY(10vh) rotate(324deg) scale(1);
                    }
                    100% {
                        transform: translateY(-10vh) rotate(360deg) scale(0.8);
                        opacity: 0.1;
                    }
                }
                /* Additional cartoon characters floating */
                
                .cartoon-character {
                    position: absolute;
                    font-size: 3rem;
                    animation: characterBounce 8s infinite ease-in-out;
                    opacity: 0.2;
                }
                
                .cartoon-character:nth-child(odd) {
                    animation-direction: alternate;
                }
                
                @keyframes characterBounce {
                    0%,
                    100% {
                        transform: translateX(0) translateY(0) rotate(0deg);
                    }
                    25% {
                        transform: translateX(50px) translateY(-30px) rotate(10deg);
                    }
                    50% {
                        transform: translateX(100px) translateY(0) rotate(-5deg);
                    }
                    75% {
                        transform: translateX(50px) translateY(30px) rotate(15deg);
                    }
                }
                /* Leaderboard Styles */
                
                .leaderboard-section {
                    margin-top: 40px;
                    padding: 60px 0;
                    background: rgba(255, 255, 255, 0.1);
                    backdrop-filter: blur(10px);
                }
                
                @keyframes slideInUp {
                    from {
                        opacity: 0;
                        transform: translateY(50px);
                    }
                    to {
                        opacity: 1;
                        transform: translateY(0);
                    }
                }
                
                .nav-pills .nav-link {
                    background: linear-gradient(135deg, var(--primary-pink), var(--primary-purple));
                    color: white;
                    border-radius: 50px;
                    margin: 0 10px;
                    padding: 15px 25px;
                    font-weight: 600;
                    border: none;
                    transition: all 0.3s ease;
                    position: relative;
                    overflow: hidden;
                }
                
                .nav-pills .nav-link::before {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: -100%;
                    width: 100%;
                    height: 100%;
                    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
                    transition: left 0.6s;
                }
                
                .nav-pills .nav-link:hover::before {
                    left: 100%;
                }
                
                .nav-pills .nav-link.active {
                    background: linear-gradient(135deg, var(--primary-yellow), var(--primary-orange));
                    transform: scale(1.1);
                    box-shadow: var(--shadow-glow);
                }
                
                .leaderboard-table-content {
                    background: rgba(255, 255, 255, 0.95);
                    border-radius: 20px;
                    overflow: hidden;
                    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
                }
                
                .leaderboard-table-content thead {
                    background: linear-gradient(135deg, var(--primary-blue), var(--primary-green));
                }
                
                .leaderboard-table-content thead th {
                    color: black;
                    font-weight: 600;
                    padding: 20px;
                    border: none;
                    text-align: center;
                }
                
                .leaderboard-table-content tbody tr {
                    transition: all 0.3s ease;
                    animation: fadeInUp 0.6s ease-out;
                    animation-fill-mode: backwards;
                }
                
                .leaderboard-table-content tbody tr:nth-child(1) {
                    animation-delay: 0.1s;
                    background: linear-gradient(135deg, #ffd700, #ffed4a);
                }
                
                .leaderboard-table-content tbody tr:nth-child(2) {
                    animation-delay: 0.2s;
                    background: linear-gradient(135deg, #c0c0c0, #e2e8f0);
                }
                
                .leaderboard-table-content tbody tr:nth-child(3) {
                    animation-delay: 0.3s;
                    background: linear-gradient(135deg, #cd7f32, #d69e2e);
                }
                
                .leaderboard-table-content tbody tr:nth-child(n+4) {
                    animation-delay: 0.4s;
                }
                
                @keyframes fadeInUp {
                    from {
                        opacity: 0;
                        transform: translateY(20px);
                    }
                    to {
                        opacity: 1;
                        transform: translateY(0);
                    }
                }
                
                .leaderboard-table-content tbody tr:hover {
                    transform: scale(1.02);
                    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
                }
                
                .leaderboard-table-content td {
                    padding: 15px;
                    text-align: center;
                    font-weight: 500;
                    border: none;
                }
                
                .rank-cell {
                    font-size: 1.2em;
                    font-weight: bold;
                }
                
                .rank-cell:nth-child(1)::before {
                    content: '🥇 ';
                }
                
                .contestant-photo {
                    width: 80px;
                    height: 80px;
                    border-radius: 50%;
                    object-fit: cover;
                    border: 3px solid var(--primary-pink);
                    transition: all 0.3s ease;
                    animation: pulse 2s ease-in-out infinite;
                }
                
                @keyframes pulse {
                    0%,
                    100% {
                        transform: scale(1);
                    }
                    50% {
                        transform: scale(1.05);
                    }
                }
                
                .contestant-photo:hover {
                    transform: scale(1.2);
                    border-color: var(--primary-yellow);
                }
                
                .contestant-name {
                    font-weight: 600;
                    color: var(--text-dark);
                }
                
                .votes-badge {
                    background: linear-gradient(135deg, var(--primary-pink), var(--primary-purple));
                    color: white;
                    padding: 8px 15px;
                    border-radius: 25px;
                    font-weight: 600;
                    display: inline-block;
                    animation: bounce 1s ease-in-out infinite alternate;
                }
                
                @keyframes bounce {
                    0% {
                        transform: translateY(0);
                    }
                    100% {
                        transform: translateY(-5px);
                    }
                }
                /* Contest Info Sidebar */
                
                .contest-info-card {
                    background: rgba(255, 255, 255, 0.9);
                    border-radius: 20px;
                    padding: 30px;
                    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
                    backdrop-filter: blur(15px);
                    border: 3px solid rgba(255, 255, 255, 0.3);
                    animation: slideInRight 0.8s ease-out;
                    margin-top: 20px;
                }
                
                .contest-info-card h5 {
                    color: var(--primary-blue);
                    font-family: 'Fredoka One', cursive;
                    font-size: 1.3em;
                    margin-bottom: 20px;
                }
                
                .info-item {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    padding: 10px 0;
                    border-bottom: 2px solid #f8f9fa;
                }
                
                .info-value {
                    background: linear-gradient(135deg, var(--primary-green), var(--primary-blue));
                    color: white;
                    padding: 8px 15px;
                    border-radius: 20px;
                    font-weight: 600;
                    animation: countUp 1s ease-out;
                }
                
                @keyframes countUp {
                    from {
                        transform: scale(0);
                    }
                    to {
                        transform: scale(1);
                    }
                }
                /* Champions Section */
                
                .champions-section {
                    padding: 80px 0;
                    margin-top: 60px;
                    background: rgba(255, 255, 255, 0.05);
                    backdrop-filter: blur(5px);
                }
                
                .champions-section h2 {
                    font-family: 'Fredoka One', cursive;
                    font-size: 2.5rem;
                    color: white;
                    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
                    margin-bottom: 50px;
                    animation: sparkle 2s ease-in-out infinite;
                }
                
                @keyframes sparkle {
                    0%,
                    100% {
                        text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
                    }
                    50% {
                        text-shadow: 0 4px 20px rgba(255, 215, 0, 0.6), 0 0 30px rgba(255, 215, 0, 0.4);
                    }
                }
                
                .champion-card {
                    background: rgba(255, 255, 255, 0.9);
                    border-radius: 30px;
                    padding: 40px;
                    transition: all 0.4s ease;
                    cursor: pointer;
                    backdrop-filter: blur(15px);
                    border: 3px solid transparent;
                    background-clip: padding-box;
                    animation: championEntry 1s ease-out;
                    animation-fill-mode: backwards;
                    position: relative;
                    overflow: hidden;
                }
                
                .champion-card::before {
                    content: '';
                    position: absolute;
                    top: -50%;
                    left: -50%;
                    width: 200%;
                    height: 200%;
                    background: conic-gradient(from 0deg, var(--primary-pink), var(--primary-blue), var(--primary-green), var(--primary-yellow), var(--primary-pink));
                    animation: rotate 4s linear infinite;
                    z-index: -2;
                }
                
                .champion-card::after {
                    content: '';
                    position: absolute;
                    inset: 3px;
                    background: rgba(255, 255, 255, 0.95);
                    border-radius: 27px;
                    z-index: -1;
                }
                
                @keyframes rotate {
                    100% {
                        transform: rotate(360deg);
                    }
                }
                
                .champion-card:nth-child(1) {
                    animation-delay: 0.2s;
                }
                
                .champion-card:nth-child(2) {
                    animation-delay: 0.4s;
                }
                
                .champion-card:nth-child(3) {
                    animation-delay: 0.6s;
                }
                
                @keyframes championEntry {
                    from {
                        opacity: 0;
                        transform: translateY(50px) rotateY(-90deg);
                    }
                    to {
                        opacity: 1;
                        transform: translateY(0) rotateY(0deg);
                    }
                }
                
                .champion-card:hover {
                    transform: translateY(-20px) scale(1.05);
                    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
                }
                
                .champion-crown {
                    font-size: 3rem;
                    animation: crownFloat 3s ease-in-out infinite;
                }
                
                @keyframes crownFloat {
                    0%,
                    100% {
                        transform: translateY(0px) rotate(0deg);
                    }
                    33% {
                        transform: translateY(-10px) rotate(5deg);
                    }
                    66% {
                        transform: translateY(-5px) rotate(-3deg);
                    }
                }
                
                .champion-img {
                    width: 100%;
                    max-height: 500px;
                    object-fit: cover;
                    border-radius: 20px;
                    transition: all 0.4s ease;
                    border: 4px solid var(--primary-pink);
                }
                
                .champion-img:hover {
                    transform: scale(1.1) rotate(2deg);
                    border-color: var(--primary-yellow);
                    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
                }
                
                .champion-stats {
                    margin-top: 15px;
                }
                
                .champion-stats>div {
                    background: linear-gradient(135deg, var(--primary-blue), var(--primary-purple));
                    color: white;
                    padding: 10px 15px;
                    border-radius: 20px;
                    font-size: 0.9em;
                    font-weight: 600;
                    animation: statsPop 0.8s ease-out;
                    animation-fill-mode: backwards;
                }
                
                .champion-stats>div:nth-child(1) {
                    animation-delay: 0.8s;
                }
                
                .champion-stats>div:nth-child(2) {
                    animation-delay: 1s;
                }
                
                @keyframes statsPop {
                    from {
                        transform: scale(0) rotate(180deg);
                    }
                    to {
                        transform: scale(1) rotate(0deg);
                    }
                }
                
                .category-label {
                    font-family: 'Fredoka One', cursive;
                    font-size: 1.1rem;
                    color: var(--primary-purple);
                    margin-bottom: 15px;
                }
                
                .btn-primary {
                    background: linear-gradient(135deg, var(--primary-pink), var(--primary-purple));
                    border: none;
                    border-radius: 25px;
                    padding: 12px 25px;
                    font-weight: 600;
                    transition: all 0.3s ease;
                    position: relative;
                    overflow: hidden;
                }
                
                .btn-primary::before {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: -100%;
                    width: 100%;
                    height: 100%;
                    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
                    transition: left 0.6s;
                }
                
                .btn-primary:hover::before {
                    left: 100%;
                }
                
                .btn-primary:hover {
                    transform: translateY(-3px);
                    box-shadow: 0 10px 25px rgba(255, 107, 157, 0.4);
                }
                /* Modal Styling */
                
                .modal-content {
                    border-radius: 30px;
                    border: none;
                    overflow: hidden;
                }
                
                .modal-header {
                    background: linear-gradient(135deg, var(--primary-pink), var(--primary-purple));
                    color: white;
                }
                
                .modal-body {
                    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
                }
                
                #championModalImage {
                    max-width: 90%;
                    max-height: 70vh;
                    border-radius: 20px;
                    border: 4px solid white;
                    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
                }
                /* Footer */
                
                .custom-footer {
                    background: rgba(0, 0, 0, 0.8);
                    color: white;
                    padding: 40px 0;
                    margin-top: 60px;
                    backdrop-filter: blur(10px);
                }
                /* Responsive Design */
                
                @media (max-width: 768px) {
                    .page-title {
                        font-size: 2.5rem;
                        margin: 20px 0 40px 0;
                    }
                    .leaderboard-section {
                        margin-top: 40px;
                        width: 400px;
                        padding: 60px 0;
                        background: rgba(255, 255, 255, 0.1);
                        backdrop-filter: blur(10px);
                    }
                    .leaderboard-table-content {
                        width: 300px;
                        background: rgba(255, 255, 255, 0.95);
                        border-radius: 20px;
                        overflow: hidden;
                        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
                    }
                    .nav-pills .nav-link {
                        margin: 5px;
                        padding: 10px 15px;
                        font-size: 0.9em;
                    }
                    .champion-card,
                    .contest-info-card {
                        margin-bottom: 40px;
                    }
                    .contest-info-card {
                        margin-top: 30px;
                    }
                    .contestant-photo {
                        width: 70px;
                        height: 70px;
                    }
                }
                
                @media (max-width: 576px) {
                    .page-title {
                        font-size: 2rem;
                    }
                    .champions-section h2 {
                        font-size: 2rem;
                    }
                    .nav-pills .nav-link {
                        display: block;
                        margin: 5px 0;
                        text-align: center;
                    }
                    .table-responsive {
                        font-size: 0.8em;
                    }
                    .champion-img {
                        max-height: 350px;
                    }
                }