/**
 * BoxMan Tournament - Frontend Styles
 * Matches the HTML prototype exactly
 *
 * @package BoxMan_Tournament
 */

 @import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Dela+Gothic+One&family=Roboto:wght@400;500;700&family=Vast+Shadow&family=Wendy+One&display=swap');

 :root {
   --bm-orange: #FF8E49;
   --bm-orange-dark: #FF7D2E;
   --bm-yellow: #F7FF00;
   --bm-gold: #FFCF2E;
   --bm-dark-1: #000000;
   --bm-dark-2: #0a0a0a;
   --bm-dark-3: #1a1a1a;
   --bm-card-bg: rgba(20, 20, 20, 0.85);
   --bm-green: #00A32A;
   --bm-red: #CC0000;
   --bm-red-dark: #990000;
   --bm-red-glow: rgba(204, 0, 0, 0.6);
   --bm-white: #FFFFFF;
   --bm-gray: #CCCCCC;
   --bm-gray-dark: #999999;
   --bm-tourney-red: #CC0000;
   --bm-tourney-red-light: #FF2222;
 }
 
 /* Reset & Base */
 .boxman-tournament-wrapper * {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }
 
 .boxman-tournament-wrapper {
   font-family: 'Roboto', sans-serif;
   background: var(--bm-dark-1);
   color: var(--bm-white);
   line-height: 1.6;
   min-height: 100vh;
   position: relative;
 }
 
 /* Parallax Stars Background */
 .boxman-tournament-wrapper::before {
   content: '';
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: url('../images/start_bg.png') repeat;
   background-size: contain;
   z-index: -2;
   pointer-events: none;
   opacity: 0.6;
   filter: brightness(1.4);
 }
 
 /* Subtle overlay for depth with glow */
 .boxman-tournament-wrapper::after {
   content: '';
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: 
     radial-gradient(ellipse at center, rgba(255, 200, 100, 0.15) 0%, transparent 50%),
     radial-gradient(ellipse at 30% 20%, rgba(255, 150, 50, 0.1) 0%, transparent 40%),
     radial-gradient(ellipse at 70% 80%, rgba(255, 180, 80, 0.1) 0%, transparent 40%),
     radial-gradient(ellipse at center, transparent 0%, rgba(0,0,0,0.2) 100%);
   z-index: -1;
   pointer-events: none;
 }
 
 /* ============================================
    TAB NAVIGATION
    ============================================ */
 .main-tabs {
   background: transparent;
   padding: 30px 20px 0;
 }
 
 .main-tabs__container {
   max-width: 1400px;
   margin: 0 auto;
   display: flex;
   gap: 10px;
   justify-content: center;
   flex-wrap: wrap;
 }
 
 .main-tab {
   padding: 15px 30px;
   background: linear-gradient(180deg, rgba(30, 30, 30, 0.9) 0%, rgba(20, 20, 20, 0.95) 100%);
   border: 3px solid rgba(204, 0, 0, 0.5);
   color: var(--bm-gray);
   font-family: 'Audiowide', sans-serif;
   font-size: 16px;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 2px;
   display: flex;
   align-items: center;
   gap: 10px;
   position: relative;
   overflow: hidden;
   border-radius: 0;
 }
 
 .main-tab::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(255, 0, 0, 0.2), transparent);
   transition: left 0.4s ease;
 }
 
 .main-tab:hover::before {
   left: 100%;
 }
 
 .main-tab:hover {
   border-color: var(--bm-tourney-red-light);
   color: var(--bm-white);
   background: linear-gradient(180deg, rgba(80, 20, 20, 0.9) 0%, rgba(40, 10, 10, 0.95) 100%);
   box-shadow: 0 0 20px var(--bm-red-glow);
   transform: translateY(-2px);
 }
 
 .main-tab.active {
   border-color: var(--bm-tourney-red-light);
   color: var(--bm-white);
   background: linear-gradient(180deg, #CC0000 0%, #880000 100%);
   box-shadow: 0 0 25px var(--bm-red-glow);
 }
 
 .main-tab__icon {
   font-size: 20px;
   line-height: 1;
 }
 
 .main-tab__label {
   font-size: 14px;
 }
 
 /* Tab Content Container */
 .tab-content-container {
   position: relative;
 }
 
 .tab-panel {
   display: none;
   animation: tab-fade-in 0.4s ease-in-out;
   padding-bottom: 60px;
 }
 
 .tab-panel.active {
   display: block;
 }
 
 @keyframes tab-fade-in {
   from {
     opacity: 0;
     transform: translateY(10px);
   }
   to {
     opacity: 1;
     transform: translateY(0);
   }
 }
 
 /* ============================================
    HERO SECTION
    ============================================ */
 .hero {
   background: transparent;
   padding: 20px 20px 0;
   text-align: center;
   position: relative;
   overflow: visible;
   display: flex;
   align-items: center;
   justify-content: center;
   padding-bottom: 0;
 }
 
 .hero-wrapper {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 15px;
   margin: 0 auto;
   width: 100%;
   max-width: 1440px;
 }
 
 /* Tournament Logo */
 .hero-logo {
   width: 100%;
   text-align: center;
   margin-bottom: 10px;
 }
 
 .hero-logo img {
   max-width: 850px;
   width: 100%;
   height: auto;
   filter: drop-shadow(0 0 20px rgba(255, 142, 73, 0.7));
   animation: logo-glow 3s ease-in-out infinite;
 }
 
 @keyframes logo-glow {
   0%, 100% { 
     filter: drop-shadow(0 0 30px rgba(255, 142, 73, 0.7));
     transform: scale(1);
   }
   50% { 
     filter: drop-shadow(0 0 50px rgba(255, 142, 73, 1));
     transform: scale(1.02);
   }
 }
 
 /* Hero Content Panel */
 .hero-content {
   position: relative;
   z-index: 1;
   max-width: 900px;
   width: 100%;
   backdrop-filter: blur(10px);
   border-radius: 0;
   padding: 40px;
   border: none;
   margin: 60px auto;
   margin-bottom: 0;
 }
 
 /* SVG Border overlay for hero content */
 .hero-content::after {
   content: '';
   position: absolute;
   top: -8px;
   left: -6px;
   right: -6px;
   bottom: -8px;
   border: 0px solid transparent;
   border-image-source: url('../images/border.svg');
   border-image-slice: 80;
   border-image-width: 90px;
   border-image-repeat: stretch;
   pointer-events: none;
   z-index: 10;
 }
 
 /* Hero Winner Display */
 .hero-winner {
   text-align: center;
 }
 
 /* Horizontal Winner Layout */
 .hero-winner--horizontal {
   padding: 40px;
 }
 
 .winner-horizontal {
   display: flex;
   align-items: center;
   justify-content: space-around;
   gap: 20px;
   flex-wrap: wrap;
 }
 
 .winner-info {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 2px;
 }
 
 .winner-details {
   display: flex;
   align-items: center;
   gap: 15px;
 }
 
 .winner-label {
   font-family: 'Vast Shadow', serif;
   font-size: 16px;
   color: var(--bm-orange);
   margin: 0;
   text-transform: uppercase;
   text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
 }
 
 .winner-name {
   font-family: 'Audiowide', sans-serif;
   font-size: 28px;
   color: var(--bm-white);
   margin: 0;
   text-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
 }
 
 .winner-fighter {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   color: var(--bm-orange);
   margin: 0;
   font-weight: 600;
 }
 
 .winner-prize {
   font-family: 'Wendy One', sans-serif;
   font-size: 42px;
   color: var(--bm-yellow);
   text-shadow: 0 0 20px rgba(247, 255, 0, 0.5), 2px 2px 4px rgba(0, 0, 0, 0.5);
   margin: 0;
   line-height: 1;
 }
 
 .winner-month {
   font-family: 'Roboto', sans-serif;
   font-size: 14px;
   color: var(--bm-gray);
   margin: 0;
 }
 
 .hero-trophy {
   font-size: 48px;
   margin: 0;
   line-height: 1;
 }
 
 .tournament-graphic {
   max-width: 100%;
   width: 100%;
   height: auto;
   margin-bottom: 15px;
 }
 
 .tournament-graphic--horizontal {
   margin-bottom: 20px;
   display: block;
 }
 
 .hero-status {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 15px;
   flex-wrap: wrap;
 }
 
 .status-badge {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   background: var(--bm-green);
   color: var(--bm-white);
   padding: 8px 18px;
   border-radius: 20px;
   font-family: 'Roboto', sans-serif;
   font-weight: 700;
   font-size: 14px;
   text-transform: uppercase;
   box-shadow: 0 0 15px rgba(0, 163, 42, 0.4);
 }
 
 .status-badge--locked {
   background: var(--bm-tourney-red);
   box-shadow: 0 0 20px var(--bm-red-glow);
 }
 
 .status-badge .dot {
   width: 8px;
   height: 8px;
   background: var(--bm-white);
   border-radius: 50%;
   animation: pulse 1.5s ease-in-out infinite;
 }
 
 @keyframes pulse {
   0%, 100% { opacity: 1; }
   50% { opacity: 0.5; }
 }
 
 .entry-count {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   color: var(--bm-gray);
 }
 
 .entry-count span {
   color: var(--bm-gold);
   font-weight: 700;
   text-shadow: 0 0 10px rgba(255, 207, 46, 0.5);
 }
 
 /* ============================================
    TOURNAMENT RULES SECTION
    ============================================ */
 .tournament-rules {
   background: transparent;
   padding: 80px 20px;
   text-align: center;
   display: flex;
   align-items: center;
   justify-content: center;
 }
 
 .tournament-rules__content {
   max-width: 1000px;
   margin: 0 auto;
   backdrop-filter: blur(10px);
   border-radius: 0;
   padding: 60px 50px;
   position: relative;
 }
 
 .tournament-rules__content::after {
   content: '';
   position: absolute;
   top: -12px;
   left: 0;
   right: 0;
   bottom: -12px;
   border: 25px solid transparent;
   border-image-source: url('../images/border.svg');
   border-image-slice: 135 fill;
   border-image-width: 90px;
   border-image-repeat: stretch;
   pointer-events: none;
   z-index: 10;
 }
 
 .tournament-rules__title {
   font-family: 'Audiowide', sans-serif;
   font-size: 48px;
   color: var(--bm-yellow);
   margin-bottom: 30px;
   text-transform: uppercase;
   letter-spacing: 3px;
   text-shadow: 
     0 0 20px rgba(247, 255, 0, 0.6),
     2px 2px 4px rgba(0, 0, 0, 0.8);
   animation: title-power 3s ease-in-out infinite;
 }
 
 .tournament-rules__text {
   font-family: 'Roboto', sans-serif;
   font-size: 24px;
   line-height: 2;
   color: var(--bm-white);
   margin: 0 0 50px 0;
   text-shadow: 0 0 10px rgba(255, 255, 255, 0.2);
 }
 
 .tournament-rules__enter-btn {
   display: inline-flex;
   align-items: center;
   gap: 15px;
   padding: 25px 50px;
   background: linear-gradient(180deg, #CC0000 0%, #880000 100%);
   border: 0;
   color: var(--bm-white);
   font-family: 'Audiowide', sans-serif;
   font-size: 24px;
   font-weight: 700;
   cursor: pointer;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 3px;
   position: relative;
   overflow: hidden;
   border-radius: 0;
 }
 
 .tournament-rules__enter-btn::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.5s ease;
 }
 
 .tournament-rules__enter-btn:hover::before {
   left: 100%;
 }
 
 .tournament-rules__enter-btn:hover {
   transform: translateY(-5px) scale(1.05);
   box-shadow: 
     0 15px 50px var(--bm-red-glow),
     inset 0 2px 0 rgba(255, 255, 255, 0.4);
   background: linear-gradient(180deg, #DD2222 0%, #AA0000 100%);
 }
 
 .tournament-rules__enter-icon {
   font-size: 32px;
   line-height: 1;
   animation: enter-pulse 2s ease-in-out infinite;
 }
 
 @keyframes enter-pulse {
   0%, 100% { 
     transform: scale(1);
     filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.5));
   }
   50% { 
     transform: scale(1.1);
     filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.8));
   }
 }
 
 .tournament-rules__enter-text {
   font-size: 24px;
 }
 
 @keyframes title-power {
   0%, 100% { 
     text-shadow: 
       2px 2px 4px rgba(0, 0, 0, 0.8),
       0 0 30px rgba(247, 255, 0, 0.5),
       0 0 60px rgba(255, 200, 0, 0.3);
   }
   50% { 
     text-shadow: 
       2px 2px 4px rgba(0, 0, 0, 0.8),
       0 0 50px rgba(247, 255, 0, 0.8),
       0 0 100px rgba(255, 200, 0, 0.5),
       0 0 150px rgba(255, 100, 0, 0.3);
   }
 }
 
 /* ============================================
    EARLY ACCESS LOCK
    ============================================ */
 .early-access-lock {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 100;
   background: rgba(0, 0, 0, 0.5);
   backdrop-filter: blur(5px);
   padding: 40px 20px;
 }
 
 .early-access-lock__content {
   position: relative;
   text-align: center;
   max-width: 800px;
   width: 100%;
   margin: 0 auto;
 }
 
 .early-access-lock__icon {
   font-size: 64px;
   margin-bottom: 20px;
   animation: star-pulse 2s ease-in-out infinite;
 }
 
 @keyframes star-pulse {
   0%, 100% { 
     transform: scale(1);
     filter: drop-shadow(0 0 10px rgba(255, 207, 46, 0.5));
   }
   50% { 
     transform: scale(1.1);
     filter: drop-shadow(0 0 20px rgba(255, 207, 46, 0.8));
   }
 }
 
 .early-access-lock__title {
   font-family: 'Audiowide', sans-serif;
   font-size: 32px;
   color: var(--bm-gold);
   margin-bottom: 20px;
   text-transform: uppercase;
   letter-spacing: 2px;
   text-shadow: 
     0 0 20px rgba(255, 207, 46, 0.6),
     2px 2px 4px rgba(0, 0, 0, 0.8);
 }
 
 .early-access-lock__text {
   font-family: 'Roboto', sans-serif;
   font-size: 18px;
   line-height: 1.8;
   color: var(--bm-white);
   margin-bottom: 20px;
   text-shadow: 0 0 10px rgba(255, 255, 255, 0.2);
 }
 
 .early-access-lock__countdown {
   font-family: 'Audiowide', sans-serif;
   font-size: 20px;
   color: var(--bm-yellow);
   margin-bottom: 30px;
   text-shadow: 0 0 15px rgba(247, 255, 0, 0.6);
   animation: countdown-glow 2s ease-in-out infinite;
 }
 
 @keyframes countdown-glow {
   0%, 100% { 
     text-shadow: 0 0 15px rgba(247, 255, 0, 0.6);
   }
   50% { 
     text-shadow: 0 0 25px rgba(247, 255, 0, 0.9);
   }
 }
 
 .early-access-lock__btn {
   display: inline-block;
   padding: 18px 40px;
   background: linear-gradient(180deg, var(--bm-gold) 0%, #CCAA00 100%);
   color: var(--bm-dark-1);
   font-family: 'Audiowide', sans-serif;
   font-size: 18px;
   font-weight: 700;
   text-decoration: none;
   border-radius: 0;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 2px;
   border: 2px solid var(--bm-yellow);
   box-shadow: 
     0 0 30px rgba(255, 207, 46, 0.5),
     inset 0 2px 0 rgba(255, 255, 255, 0.3);
   position: relative;
   overflow: hidden;
 }
 
 .early-access-lock__btn::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.5s ease;
 }
 
 .early-access-lock__btn:hover::before {
   left: 100%;
 }
 
 .early-access-lock__btn:hover {
   transform: translateY(-3px);
   box-shadow: 
     0 10px 40px rgba(255, 207, 46, 0.7),
     inset 0 2px 0 rgba(255, 255, 255, 0.4);
   background: linear-gradient(180deg, var(--bm-yellow) 0%, var(--bm-gold) 100%);
 }
 
 /* ============================================
    FIGHTER SELECTION - DBZ Budokai 3 Style
    ============================================ */
 .fighter-section {
   max-width: 1400px;
   background: transparent;
   padding: 80px 20px 60px;
   position: relative;
   overflow: hidden;
   border: 4px dashed #f7ff02;
   border-radius: 8px;
   margin: 40px auto;
   margin-bottom: 0;
   box-shadow: 0 0 30px rgba(255, 184, 77, 0.4), inset 0 0 20px rgba(255, 184, 77, 0.1);
 }
 
 .fighter-section--early-access-locked {
   max-height: 75dvh;
   overflow: hidden;
 }
 
 /* Floating Ki Energy Particles */
 .fighter-section::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-image: 
     radial-gradient(2px 2px at 20% 30%, rgba(255, 200, 0, 0.8), transparent),
     radial-gradient(2px 2px at 40% 70%, rgba(255, 100, 0, 0.6), transparent),
     radial-gradient(3px 3px at 60% 20%, rgba(255, 50, 0, 0.7), transparent),
     radial-gradient(2px 2px at 80% 50%, rgba(255, 200, 0, 0.5), transparent),
     radial-gradient(2px 2px at 10% 80%, rgba(255, 150, 0, 0.6), transparent),
     radial-gradient(3px 3px at 90% 85%, rgba(255, 100, 0, 0.7), transparent),
     radial-gradient(2px 2px at 50% 50%, rgba(255, 200, 0, 0.4), transparent),
     radial-gradient(2px 2px at 30% 90%, rgba(255, 50, 0, 0.5), transparent);
   background-size: 200% 200%;
   animation: ki-particles 20s linear infinite;
   pointer-events: none;
   z-index: 0;
   opacity: 0.6;
 }
 
 @keyframes ki-particles {
   0% { background-position: 0% 0%; }
   100% { background-position: 200% 200%; }
 }
 
 /* Character Select Header */
 .section-header {
   text-align: center;
   margin-bottom: 40px;
   position: relative;
 }
 
 .section-header::before {
   content: '';
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
   bottom: -15px;
   width: 200px;
   height: 4px;
   background: linear-gradient(90deg, transparent, var(--bm-tourney-red), transparent);
 }
 
 .section-title {
   font-family: 'Vast Shadow', serif;
   font-size: 50px;
   color: var(--bm-yellow);
   margin-bottom: 10px;
   text-transform: uppercase;
   text-shadow: 
     2px 2px 4px rgba(0, 0, 0, 0.8),
     0 0 30px rgba(247, 255, 0, 0.5),
     0 0 60px rgba(255, 200, 0, 0.3);
   letter-spacing: 4px;
   animation: title-power 3s ease-in-out infinite;
   position: relative;
 }
 
 .section-subtitle {
   font-family: 'Roboto', sans-serif;
   font-size: 22px;
   color: var(--bm-gray);
 }
 
 /* Tier Filter - Budokai Style */
 .tier-filter {
   display: flex;
   justify-content: center;
   gap: 8px;
   margin-bottom: 35px;
   flex-wrap: wrap;
   padding: 15px;
   background: rgba(0, 0, 0, 0.4);
   border-radius: 10px;
   max-width: 800px;
   margin-left: auto;
   margin-right: auto;
 }
 
 /* Tier Filter Buttons - DBZ Style */
 .tier-btn {
   padding: 12px 28px;
   border: 3px solid var(--bm-tourney-red);
   background: linear-gradient(180deg, rgba(30, 30, 30, 0.9) 0%, rgba(10, 10, 10, 0.95) 100%);
   color: var(--bm-gray);
   font-family: 'Audiowide', sans-serif;
   font-weight: 600;
   font-size: 14px;
   cursor: pointer;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 2px;
   position: relative;
   overflow: hidden;
 }
 
 .tier-btn::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(255, 0, 0, 0.2), transparent);
   transition: left 0.4s ease;
 }
 
 .tier-btn:hover::before {
   left: 100%;
 }
 
 .tier-btn:hover {
   border-color: var(--bm-tourney-red-light);
   color: var(--bm-white);
   background: linear-gradient(180deg, rgba(80, 20, 20, 0.9) 0%, rgba(40, 10, 10, 0.95) 100%);
   box-shadow: 0 0 20px var(--bm-red-glow);
 }
 
 .tier-btn.active {
   border-color: var(--bm-tourney-red-light);
   color: var(--bm-white);
   background: linear-gradient(180deg, #CC0000 0%, #880000 100%);
 }
 
 /* Fighter Grid - Character Select Screen Style */
 .fighter-grid {
   display: grid;
   grid-template-columns: repeat(5, 1fr);
   gap: 50px;
   max-width: 1400px;
   margin: 0 auto;
   position: relative;
   padding: 30px;
 }
 
 /* CRT Scanline Overlay for Retro Arcade Feel */
 .fighter-grid::before {
   content: '';
   position: absolute;
   inset: 0;
   background: repeating-linear-gradient(
     0deg,
     transparent,
     transparent 2px,
     rgba(0, 0, 0, 0.1) 2px,
     rgba(0, 0, 0, 0.1) 4px
   );
   pointer-events: none;
   z-index: 20;
   opacity: 0.3;
 }
 
 /* Corner Decorations */
 .fighter-grid::after {
   content: '';
   position: absolute;
   width: 80px;
   height: 80px;
   background: url('../images/tourney+outline.png') center/contain no-repeat;
   opacity: 0.6;
   bottom: -20px;
   right: -20px;
   transform: rotate(180deg);
   z-index: 5;
 }
 
 @media (max-width: 1200px) {
   .fighter-grid {
     grid-template-columns: repeat(4, 1fr);
   }
 }
 
 @media (max-width: 992px) {
   .fighter-grid {
     grid-template-columns: repeat(3, 1fr);
   }
 }
 
 @media (max-width: 768px) {
   .fighter-grid {
     grid-template-columns: repeat(2, 1fr);
     padding: 15px;
   }
 }
 
 @media (max-width: 480px) {
   .fighter-grid {
     grid-template-columns: 1fr;
   }
 }
 
 /* Fighter Card - Budokai 3 Character Slot Style */
 .fighter-card {
   background: linear-gradient(180deg, rgba(40, 40, 40, 0.9) 0%, rgba(20, 20, 20, 0.95) 100%);
   cursor: pointer;
   transition: all 0.3s ease;
   position: relative;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
 }
 
 /* SVG Border as pseudo-element overlay */
 .fighter-card::after {
   content: '';
   position: absolute;
   top: -13px;
   left: -6px;
   right: -6px;
   bottom: -10px;
   border: 25px solid transparent;
   border-image-source: url('../images/border.svg');
   border-image-slice: 80;
   border-image-width: 110px;
   border-image-repeat: stretch;
   pointer-events: none;
   z-index: 10;
 }
 
 .fighter-card::before {
   content: '';
   position: absolute;
   inset: 0;
   background: linear-gradient(180deg, transparent 60%, rgba(204, 0, 0, 0.2) 100%);
   opacity: 0;
   transition: opacity 0.3s ease;
   z-index: 1;
   pointer-events: none;
 }
 
 .fighter-card:hover {
   transform: translateY(-8px) scale(1.05);
   box-shadow: 
     0 0 30px var(--bm-red-glow),
     0 0 60px rgba(255, 100, 0, 0.4),
     0 20px 40px rgba(0, 0, 0, 0.5);
   filter: brightness(1.15) contrast(1.1);
   animation: ki-charge 0.5s ease-out;
 }
 
 @keyframes ki-charge {
   0% { transform: translateY(0) scale(1); }
   50% { transform: translateY(-10px) scale(1.08); }
   100% { transform: translateY(-8px) scale(1.05); }
 }
 
 .fighter-card:hover::before {
   opacity: 1;
   background: linear-gradient(
     180deg, 
     transparent 40%, 
     rgba(255, 100, 0, 0.2) 70%,
     rgba(255, 0, 0, 0.4) 100%
   );
 }
 
 .fighter-card--taken {
   cursor: not-allowed;
   filter: grayscale(0.8);
   pointer-events: none;
 }
 
 .fighter-card--taken:hover {
   transform: none;
   box-shadow: none;
   border-color: #444;
 }
 
 .fighter-card--taken .fighter-card__image {
   filter: grayscale(60%) brightness(0.5);
 }
 
 .fighter-card--selected {
   animation: selected-power 1.5s ease-in-out infinite;
   z-index: 15;
 }
 
 .fighter-card--selected::after {
   filter: hue-rotate(80deg) saturate(2) brightness(1.3);
 }
 
 @keyframes selected-power {
   0%, 100% {
     box-shadow: 
       0 0 30px rgba(0, 255, 100, 0.6),
       0 0 60px rgba(0, 200, 50, 0.3);
     transform: scale(1);
   }
   50% {
     box-shadow: 
       0 0 50px rgba(0, 255, 100, 0.8),
       0 0 100px rgba(0, 200, 50, 0.5),
       0 0 150px rgba(100, 255, 100, 0.3);
     transform: scale(1.02);
   }
 }
 
 .fighter-card--selected:hover {
   transform: scale(1.05);
   animation: none;
   box-shadow: 
     0 0 50px rgba(0, 255, 100, 0.8),
     0 0 100px rgba(0, 200, 50, 0.5);
 }
 
 /* READY! Indicator for selected cards */
 .fighter-card--selected .fighter-card__overlay {
   display: flex !important;
   background: rgba(0, 50, 0, 0.85);
   flex-direction: column;
   align-items: center;
   justify-content: center;
 }
 
 .fighter-card--selected .fighter-card__overlay::after {
   content: 'READY!';
   font-family: 'Audiowide', sans-serif;
   font-size: 24px;
   color: #00ff66;
   text-shadow: 
     0 0 10px #00ff66,
     0 0 20px #00ff66,
     0 0 40px #00aa44;
   animation: ready-flash 0.8s ease-in-out infinite;
   letter-spacing: 3px;
 }
 
 @keyframes ready-flash {
   0%, 100% { transform: scale(1); }
   50% { transform: scale(1.1); }
 }
 
 .fighter-card__image-wrapper {
   position: relative;
   aspect-ratio: 1;
   overflow: hidden;
   background: linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
 }
 
 .fighter-card__image {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: all 0.3s ease;
 }
 
 .fighter-card:hover .fighter-card__image {
   transform: scale(1.08);
 }
 
 .fighter-card__overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(0, 0, 0, 0.85);
   display: none;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   color: var(--bm-white);
   font-family: 'Roboto', sans-serif;
   font-weight: 700;
   text-transform: uppercase;
 }
 
 .fighter-card--taken .fighter-card__overlay {
   display: flex;
   background: rgba(68, 68, 68, 0.9);
 }
 
 .fighter-card__overlay-icon {
   font-size: 36px;
   margin-bottom: 8px;
 }
 
 .fighter-card__overlay-text {
   font-family: 'Audiowide', sans-serif;
   font-size: 14px;
   color: #00ff66;
 }
 
 .fighter-card__overlay-user {
   font-size: 11px;
   font-weight: 400;
   opacity: 0.9;
   margin-top: 5px;
   color: var(--bm-gray);
 }
 
 .fighter-card--selected .fighter-card__overlay {
   display: flex;
   background: rgb(0 0 0 / 56%);
 }
 
 .fighter-card__info {
   padding: 0;
   text-align: center;
   background: linear-gradient(180deg, rgba(20, 20, 20, 0.95) 0%, rgba(10, 10, 10, 0.98) 100%);
   border-top: 3px solid var(--bm-tourney-red);
   position: relative;
   z-index: 2;
 }
 
 /* Name Plate - Dramatic Header */
 .fighter-card__nameplate {
   background: linear-gradient(90deg, transparent, rgba(255, 0, 0, 0.15), transparent);
   padding: 12px 8px 10px;
   border-bottom: 1px solid rgba(255, 0, 0, 0.3);
   position: relative;
 }
 
 .fighter-card__nameplate::before {
   content: '';
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 60%;
   height: 1px;
   background: linear-gradient(90deg, transparent, var(--bm-tourney-red), transparent);
 }
 
 .fighter-card__name {
   font-family: 'Audiowide', sans-serif;
   font-size: 15px;
   color: var(--bm-white);
   margin: 0;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   text-transform: uppercase;
   letter-spacing: 1px;
   text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
 }
 
 /* Stats Row - Tier & Ki */
 .fighter-card__stats {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 15px;
   padding: 12px;
   background: rgba(0, 0, 0, 0.5);
 }
 
 .fighter-card__rank {
   font-family: 'Audiowide', sans-serif;
   font-size: 13px;
   font-weight: 700;
   letter-spacing: 2px;
   padding: 4px 10px;
   border-radius: 3px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: 30px;
   animation: rank-glow 2s ease-in-out infinite;
 }
 
 .fighter-card__ki {
   display: flex;
   align-items: center;
   gap: 4px;
   font-family: 'Audiowide', sans-serif;
   font-size: 12px;
   color: var(--bm-yellow);
   background: rgba(255, 255, 0, 0.1);
   padding: 4px 10px;
   border-radius: 3px;
   border: 1px solid rgba(255, 255, 0, 0.3);
 }
 
 .ki-icon {
   font-size: 14px;
   animation: ki-flash 1s ease-in-out infinite;
 }
 
 @keyframes ki-flash {
   0%, 100% { opacity: 1; }
   50% { opacity: 0.5; }
 }
 
 .ki-value {
   font-weight: bold;
 }
 
 @keyframes rank-glow {
   0%, 100% { filter: brightness(1); }
   50% { filter: brightness(1.3); }
 }
 
 /* Action Buttons Row */
 .fighter-card__actions {
   display: flex;
   gap: 2px;
   background: rgba(0, 0, 0, 0.6);
   flex-direction: column;
   margin-top: 4px;
 }
 
 .fighter-card__btn {
   flex: 1;
   padding: 12px 8px;
   font-family: 'Audiowide', sans-serif;
   font-size: 14px;
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 1px;
   border: none;
   cursor: pointer;
   transition: all 0.2s ease;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 4px;
 }
 
 .fighter-card__btn--select {
   background: linear-gradient(180deg, #1a3d1a 0%, #0d1f0d 100%);
   color: #4AE54A;
   border-right: 1px solid rgba(0, 0, 0, 0.5);
 }
 
 .fighter-card__btn--select:hover {
   background: linear-gradient(180deg, #2a5a2a 0%, #1a3d1a 100%);
   color: #6fff6f;
   box-shadow: inset 0 0 20px rgba(74, 229, 74, 0.3);
 }
 
 .fighter-card__btn--view {
   background: linear-gradient(180deg, #3d1a1a 0%, #1f0d0d 100%);
   color: #FF6666;
   padding-bottom: 15px;
 }
 
 .fighter-card__btn--view:hover {
   background: linear-gradient(180deg, #5a2a2a 0%, #3d1a1a 100%);
   color: #ff8888;
   box-shadow: inset 0 0 20px rgba(255, 102, 102, 0.3);
 }
 
 /* Disabled state for taken fighters */
 .fighter-card--taken .fighter-card__btn--select {
   background: linear-gradient(180deg, #2a2a2a 0%, #1a1a1a 100%);
   color: #666;
   cursor: not-allowed;
 }
 
 .fighter-card--taken .fighter-card__btn--select:hover {
   background: linear-gradient(180deg, #2a2a2a 0%, #1a1a1a 100%);
   color: #666;
   box-shadow: none;
 }
 
 /* Rank Colors */
 /* Power Level Tier Colors - DBZ Style */
 .fighter-card__rank--s { 
   color: #FF4444; 
   text-shadow: 0 0 15px rgba(255, 68, 68, 0.9);
   border: 1px solid rgba(255, 68, 68, 0.5);
   background: linear-gradient(135deg, rgba(255, 0, 0, 0.3), rgba(100, 0, 0, 0.5));
 }
 .fighter-card__rank--a { 
   color: #FF9F5A; 
   text-shadow: 0 0 12px rgba(255, 159, 90, 0.8);
   border: 1px solid rgba(255, 159, 90, 0.5);
   background: linear-gradient(135deg, rgba(255, 140, 0, 0.3), rgba(100, 50, 0, 0.5));
 }
 .fighter-card__rank--b { 
   color: #FFD93D; 
   text-shadow: 0 0 12px rgba(255, 217, 61, 0.8);
   border: 1px solid rgba(255, 217, 61, 0.5);
   background: linear-gradient(135deg, rgba(255, 200, 0, 0.3), rgba(100, 80, 0, 0.5));
 }
 .fighter-card__rank--c { 
   color: #4AE54A; 
   text-shadow: 0 0 12px rgba(74, 229, 74, 0.8);
   border: 1px solid rgba(74, 229, 74, 0.5);
   background: linear-gradient(135deg, rgba(0, 200, 0, 0.3), rgba(0, 80, 0, 0.5));
 }
 .fighter-card__rank--d { 
   color: #66AAFF; 
   text-shadow: 0 0 12px rgba(102, 170, 255, 0.8);
   border: 1px solid rgba(102, 170, 255, 0.5);
   background: linear-gradient(135deg, rgba(0, 100, 255, 0.3), rgba(0, 40, 100, 0.5));
 }
 .fighter-card__rank--z { 
   color: #FF55FF; 
   text-shadow: 0 0 15px rgba(255, 85, 255, 0.9);
   border: 1px solid rgba(255, 85, 255, 0.5);
   background: linear-gradient(135deg, rgba(255, 0, 255, 0.3), rgba(100, 0, 100, 0.5));
 }
 .fighter-card__rank--box { 
   color: #F7FF00; 
   text-shadow: 0 0 25px rgba(247, 255, 0, 1);
   border: 2px solid rgba(247, 255, 0, 0.7);
   background: linear-gradient(135deg, rgba(247, 255, 0, 0.4), rgba(100, 100, 0, 0.6));
   animation: box-tier-special 1s ease-in-out infinite;
 }
 
 @keyframes box-tier-special {
   0%, 100% { transform: scale(1); }
   50% { transform: scale(1.05); }
 }
 
 /* ============================================
    FIGHTER MODAL
    ============================================ */
 .modal-overlay {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(0, 0, 0, 0.9);
   display: none;
   justify-content: center;
   align-items: flex-start;
   z-index: 2000;
   padding: 20px;
   padding-top: 5dvh;
   opacity: 0;
   transition: opacity 0.3s ease;
   overflow: auto;
 }
 
 .modal-overlay.active {
   display: flex;
   opacity: 1;
 }
 
 .modal {
   background: linear-gradient(180deg, rgba(20, 20, 20, 0.98) 0%, rgba(10, 10, 10, 0.99) 100%);
   backdrop-filter: blur(15px);
   border-radius: 0;
   max-width: 650px;
   width: 100%;
   border: none;
   box-shadow: 0 0 80px var(--bm-red-glow), 0 0 120px rgba(255, 0, 0, 0.2);
   transform: scale(0.9);
   transition: transform 0.3s ease;
   position: relative;
 }
 
 /* SVG Border overlay for modal */
 .modal::after {
   content: '';
   position: absolute;
   top: -12px;
   left: -12px;
   right: -12px;
   bottom: -12px;
   border: 30px solid transparent;
   border-image-source: url('../images/border.svg');
   border-image-slice: 150 fill;
   border-image-width: 95px;
   border-image-repeat: stretch;
   pointer-events: none;
   z-index: 10;
 }
 
 .modal-overlay.active .modal {
   transform: scale(1);
 }
 
 .modal__header {
   position: relative;
   padding: 0;
   overflow: hidden;
 }
 
 .modal__header::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   height: 80px;
   background: linear-gradient(0deg, rgba(10, 10, 10, 1) 0%, transparent 100%);
   z-index: 2;
 }
 
 .modal__image {
   width: 100%;
   height: 280px;
   object-fit: cover;
   border-radius: 0;
   filter: contrast(1.1) saturate(1.1);
 }
 
 .modal__close {
   position: absolute;
   top: 15px;
   right: 15px;
   width: 44px;
   height: 44px;
   background: linear-gradient(180deg, rgba(20, 20, 20, 0.9) 0%, rgba(0, 0, 0, 0.95) 100%);
   border: 3px solid var(--bm-tourney-red);
   border-radius: 0;
   color: var(--bm-tourney-red-light);
   font-size: 28px;
   cursor: pointer;
   transition: all 0.2s ease;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 20;
 }
 
 .modal__close:hover {
   background: var(--bm-tourney-red);
   color: var(--bm-white);
   transform: scale(1.1);
   box-shadow: 0 0 20px var(--bm-red-glow);
 }
 
 .modal__badges {
   position: absolute;
   bottom: 15px;
   left: 15px;
   display: flex;
   gap: 10px;
   flex-wrap: wrap;
   z-index: 5;
 }
 
 .modal__badge {
   padding: 8px 16px;
   border-radius: 0;
   font-family: 'Audiowide', sans-serif;
   font-weight: 700;
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 1px;
   border: 2px solid transparent;
 }
 
 .modal__badge--rank {
   background: var(--bm-tourney-red);
   color: var(--bm-white);
 }
 
 .modal__badge--rank-s { background: #FF4444; }
 .modal__badge--rank-a { background: #FF8E49; }
 .modal__badge--rank-b { background: #FFCF2E; color: #1D2327; }
 .modal__badge--rank-c { background: #00A32A; }
 .modal__badge--rank-d { background: #6699FF; }
 .modal__badge--rank-z { background: #FF00FF; }
 .modal__badge--rank-box { background: #F7FF00; color: #1D2327; }
 
 .modal__badge--ki {
   background: rgba(0, 0, 0, 0.7);
   color: var(--bm-gold);
 }
 
 .modal__badge--taken {
   background: var(--bm-tourney-red);
   color: var(--bm-white);
 }
 
 .modal__badge--available {
   background: var(--bm-green);
   color: var(--bm-white);
 }
 
 .modal__body {
   padding: 25px;
   position: relative;
   z-index: 5;
 }
 
 /* Modal Name - Nameplate Style */
 .modal__name {
   font-family: 'Audiowide', sans-serif;
   font-size: 32px;
   color: var(--bm-white);
   margin-bottom: 15px;
   text-transform: uppercase;
   letter-spacing: 2px;
   text-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
   position: relative;
   padding-bottom: 15px;
 }
 
 .modal__name::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 2px;
   background: linear-gradient(90deg, var(--bm-tourney-red), transparent);
 }
 
 .modal__section-title {
   font-family: 'Audiowide', sans-serif;
   font-size: 13px;
   color: var(--bm-tourney-red-light);
   text-transform: uppercase;
   margin-bottom: 12px;
   letter-spacing: 2px;
   display: flex;
   align-items: center;
   gap: 10px;
 }
 
 .modal__section-title::before {
   content: '\25B8';
   color: var(--bm-tourney-red);
 }
 
 .modal__description {
   font-family: 'Roboto', sans-serif;
   font-size: 15px;
   line-height: 1.7;
   color: var(--bm-gray);
   margin-bottom: 25px;
   padding: 18px;
   background: linear-gradient(135deg, rgba(30, 30, 30, 0.9), rgba(20, 20, 20, 0.95));
   border-radius: 0;
   border-left: 4px solid var(--bm-tourney-red);
   border-top: 1px solid rgba(255, 0, 0, 0.2);
   border-bottom: 1px solid rgba(255, 0, 0, 0.2);
 }
 
 /* Modal Stats - Power Level Style */
 .modal__stats {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 12px;
   margin-bottom: 25px;
 }
 
 .modal__stat {
   background: linear-gradient(180deg, rgba(40, 40, 40, 0.9) 0%, rgba(20, 20, 20, 0.95) 100%);
   padding: 18px 15px;
   border-radius: 0;
   text-align: center;
   border: 2px solid rgba(204, 0, 0, 0.4);
   position: relative;
   overflow: hidden;
 }
 
 .modal__stat::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 3px;
   background: linear-gradient(90deg, transparent, var(--bm-tourney-red), transparent);
 }
 
 .modal__stat-value {
   font-family: 'Audiowide', sans-serif;
   font-size: 28px;
   color: var(--bm-gold);
   text-shadow: 0 0 15px rgba(255, 207, 46, 0.5);
   animation: stat-pulse 2s ease-in-out infinite;
 }
 
 @keyframes stat-pulse {
   0%, 100% { opacity: 1; }
   50% { opacity: 0.8; }
 }
 
 .modal__stat-label {
   font-family: 'Audiowide', sans-serif;
   font-size: 10px;
   color: var(--bm-gray);
   text-transform: uppercase;
   margin-top: 8px;
   letter-spacing: 1px;
 }
 
 /* Modal Actions - DBZ Button Style */
 .modal__actions {
   display: flex;
   gap: 12px;
 }
 
 .modal__btn {
   flex: 1;
   padding: 16px 20px;
   border-radius: 0;
   font-family: 'Audiowide', sans-serif;
   font-size: 13px;
   cursor: pointer;
   transition: all 0.2s ease;
   text-transform: uppercase;
   text-align: center;
   border: none;
   letter-spacing: 1px;
   position: relative;
   overflow: hidden;
 }
 
 .modal__btn::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
   transition: left 0.4s ease;
 }
 
 .modal__btn:hover::before {
   left: 100%;
 }
 
 .modal__btn--primary {
   background: linear-gradient(180deg, #CC0000 0%, #880000 100%);
   color: var(--bm-white);
   border: 2px solid var(--bm-tourney-red-light);
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
 }
 
 .modal__btn--primary:hover {
   transform: translateY(-3px);
   box-shadow: 
     0 8px 25px var(--bm-red-glow),
     inset 0 1px 0 rgba(255, 255, 255, 0.3);
   background: linear-gradient(180deg, #DD2222 0%, #AA0000 100%);
 }
 
 .modal__btn--primary:disabled {
   background: linear-gradient(180deg, #444 0%, #333 100%);
   border-color: #555;
   cursor: not-allowed;
   transform: none;
   box-shadow: none;
 }
 
 .modal__btn--secondary {
   background: linear-gradient(180deg, rgba(60, 60, 60, 0.9) 0%, rgba(30, 30, 30, 0.95) 100%);
   border: 2px solid rgba(100, 100, 100, 0.5);
   color: var(--bm-gray);
 }
 
 .modal__btn--secondary:hover {
   border-color: var(--bm-gray);
   color: var(--bm-white);
   background: linear-gradient(180deg, rgba(80, 80, 80, 0.9) 0%, rgba(50, 50, 50, 0.95) 100%);
 }
 
 @media (max-width: 576px) {
   .modal__image { height: 180px; }
   .modal__name { font-size: 24px; }
   .modal__stats { grid-template-columns: 1fr; }
   .modal__actions { flex-direction: column; }
 }
 
 /* ============================================
    BUILD SECTION
    ============================================ */
 .build-section {
   background: transparent;
   padding: 60px 20px;
   position: relative;
 }
 
 .build-container {
   max-width: 900px;
   margin: 0 auto;
 }
 
 /* Build Loader */
 .build-loader {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 60px 20px;
   gap: 16px;
 }
 
 .build-loader__spinner {
   width: 40px;
   height: 40px;
   border: 3px solid rgba(255, 255, 255, 0.1);
   border-top-color: var(--bm-red, #e53935);
   border-radius: 50%;
   animation: buildSpin 0.8s linear infinite;
 }
 
 @keyframes buildSpin {
   to { transform: rotate(360deg); }
 }
 
 .build-loader__text {
   color: rgba(255, 255, 255, 0.5);
   font-size: 14px;
   letter-spacing: 0.5px;
 }
 
 .build-loader.hidden {
   display: none;
 }
 
 /* Selection Panel */
 .selection-panel {
   background: linear-gradient(180deg, rgba(20, 20, 20, 0.95) 0%, rgba(10, 10, 10, 0.98) 100%);
   backdrop-filter: blur(10px);
   border-radius: 0;
   padding: 25px;
   margin-bottom: 30px;
   border: none;
   box-shadow: 0 0 30px var(--bm-red-glow);
   position: relative;
   border: solid 3px #ff0000;
 }
 
 .selection-panel--empty {
   text-align: center;
   padding: 50px 25px;
 }
 
 .selection-panel__empty-icon {
   font-size: 56px;
   margin-bottom: 15px;
   opacity: 0.6;
   animation: empty-pulse 2s ease-in-out infinite;
 }
 
 @keyframes empty-pulse {
   0%, 100% { transform: scale(1); opacity: 0.6; }
   50% { transform: scale(1.05); opacity: 0.8; }
 }
 
 .selection-panel__empty-text {
   font-family: 'Audiowide', sans-serif;
   font-size: 18px;
   color: var(--bm-gray);
   text-transform: uppercase;
   letter-spacing: 1px;
 }
 
 .selection-content {
   display: flex;
   align-items: center;
   gap: 25px;
 }
 
 .selection-image {
   width: 100px;
   height: 100px;
   border-radius: 0;
   object-fit: cover;
   border: 3px solid var(--bm-green);
 }
 
 .selection-info {
   flex: 1;
 }
 
 .selection-label {
   font-family: 'Roboto', sans-serif;
   font-size: 14px;
   color: var(--bm-gray);
   margin-bottom: 5px;
 }
 
 .selection-name {
   font-family: 'Audiowide', sans-serif;
   font-size: 28px;
   color: var(--bm-white);
   margin-bottom: 5px;
 }
 
 .selection-meta {
   font-family: 'Roboto', sans-serif;
   font-size: 14px;
   color: var(--bm-tourney-red-light);
 }
 
 .selection-change-btn {
   padding: 12px 25px;
   background: transparent;
   border: 2px solid var(--bm-tourney-red);
   color: var(--bm-tourney-red-light);
   font-family: 'Roboto', sans-serif;
   font-weight: 700;
   font-size: 14px;
   cursor: pointer;
   transition: all 0.3s ease;
   text-transform: uppercase;
 }
 
 .selection-change-btn:hover {
   background: var(--bm-tourney-red);
   color: var(--bm-white);
   box-shadow: 0 0 15px var(--bm-red-glow);
 }
 
 /* Build Form */
 .build-form {
   background: linear-gradient(180deg, rgba(20, 20, 20, 0.95) 0%, rgba(10, 10, 10, 0.98) 100%);
   backdrop-filter: blur(10px);
   border-radius: 0;
   padding: 30px;
   border: none;
   box-shadow: 0 0 40px var(--bm-red-glow);
   position: relative;
   border: solid 3px #ff0000;
 }
 
 .build-form__header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 25px;
   padding-bottom: 20px;
   border-bottom: none;
   flex-wrap: wrap;
   gap: 15px;
   position: relative;
 }
 
 .build-form__header::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   height: 2px;
   background: linear-gradient(90deg, var(--bm-tourney-red), transparent 80%);
 }
 
 .build-form__title {
   font-family: 'Audiowide', sans-serif;
   font-size: 24px;
   color: var(--bm-white);
   text-transform: uppercase;
   letter-spacing: 2px;
 }
 
 .build-form__tier-badge {
   background: linear-gradient(180deg, #CC0000 0%, #880000 100%);
   color: var(--bm-white);
   padding: 10px 18px;
   border-radius: 0;
   font-family: 'Audiowide', sans-serif;
   font-weight: 700;
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 1px;
   border: 2px solid rgba(255, 0, 0, 0.5);
 }
 
 /* Slot Counter - Power Meter Style */
 .slot-counter {
   margin-bottom: 30px;
   padding: 15px;
   background: linear-gradient(180deg, rgba(30, 30, 30, 0.9) 0%, rgba(20, 20, 20, 0.95) 100%);
   border: 2px solid rgba(100, 100, 100, 0.3);
   position: sticky;
   top: 0;
 }
 
 .slot-counter__header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 12px;
 }
 
 .slot-counter__label {
   font-family: 'Audiowide', sans-serif;
   font-size: 12px;
   color: var(--bm-gray);
   text-transform: uppercase;
   letter-spacing: 2px;
 }
 
 .slot-counter__value {
   font-family: 'Audiowide', sans-serif;
   font-size: 22px;
   color: var(--bm-white);
   text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
 }
 
 .slot-counter__value span {
   color: var(--bm-gold);
   text-shadow: 0 0 15px rgba(255, 207, 46, 0.5);
 }
 
 .slot-counter__bar {
   height: 18px;
   background: linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
   border-radius: 0;
   overflow: hidden;
   border: 2px solid var(--bm-tourney-red);
   position: relative;
 }
 
 .slot-counter__bar::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 50%;
   background: linear-gradient(180deg, rgba(255, 255, 255, 0.1), transparent);
   z-index: 1;
 }
 
 .slot-counter__fill {
   height: 100%;
   background: linear-gradient(180deg, #00FF44 0%, #00AA22 100%);
   border-radius: 0;
   transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
   box-shadow: 0 0 10px rgba(0, 255, 68, 0.5);
 }
 
 .slot-counter__fill--warning {
   background: linear-gradient(180deg, #FFD93D 0%, #FF9F5A 100%);
   box-shadow: 0 0 10px rgba(255, 159, 90, 0.5);
 }
 
 .slot-counter__fill--full {
   background: linear-gradient(180deg, #FF6644 0%, #CC0000 100%);
   box-shadow: 0 0 10px rgba(204, 0, 0, 0.5);
   animation: full-pulse 1s ease-in-out infinite;
 }
 
 @keyframes full-pulse {
   0%, 100% { opacity: 1; }
   50% { opacity: 0.8; }
 }
 
 /* Build Sections */
 .build-section-title {
   font-family: 'Audiowide', sans-serif;
   font-size: 14px;
   color: var(--bm-tourney-red-light);
   margin: 25px 0 15px;
   text-transform: uppercase;
   display: flex;
   align-items: center;
   gap: 12px;
   letter-spacing: 2px;
 }
 
 .build-section-title::before {
   content: '\25B8';
   color: var(--bm-tourney-red);
   font-size: 24px;
   line-height: 0.5;
 }
 
 .build-section-title::after {
   content: '';
   flex: 1;
   height: 1px;
   background: linear-gradient(90deg, rgba(204, 0, 0, 0.5), transparent);
 }
 
 .build-items {
   display: flex;
   flex-direction: column;
   gap: 8px;
 }
 
 .build-item {
   display: flex;
   align-items: center;
   padding: 15px;
   background: linear-gradient(180deg, rgba(35, 35, 35, 0.9) 0%, rgba(25, 25, 25, 0.95) 100%);
   border-radius: 0;
   transition: all 0.2s ease;
   border: 2px solid rgba(60, 60, 60, 0.5);
   border-left: 3px solid transparent;
 }
 
 .build-item:hover {
   background: linear-gradient(180deg, rgba(50, 50, 50, 0.9) 0%, rgba(35, 35, 35, 0.95) 100%);
   border-color: rgba(204, 0, 0, 0.4);
   border-left-color: var(--bm-tourney-red);
 }
 
 .build-item--selected {
   background: linear-gradient(180deg, rgba(0, 60, 20, 0.4) 0%, rgba(0, 40, 15, 0.5) 100%);
   border-color: rgba(0, 163, 42, 0.6);
   border-left-color: var(--bm-green);
 }
 
 .build-item--disabled {
   opacity: 0.4;
   cursor: not-allowed;
 }
 
 .build-item--disabled:hover {
   background: linear-gradient(180deg, rgba(35, 35, 35, 0.9) 0%, rgba(25, 25, 25, 0.95) 100%);
   border-color: rgba(60, 60, 60, 0.5);
   border-left-color: transparent;
 }
 
 .build-item__checkbox {
   width: 22px;
   height: 22px;
   accent-color: var(--bm-tourney-red);
   margin-right: 15px;
   cursor: pointer;
 }
 
 .build-item--disabled .build-item__checkbox {
   cursor: not-allowed;
 }
 
 .build-item__info {
   flex: 1;
 }
 
 .build-item__name {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   font-weight: 500;
   color: var(--bm-white);
   cursor: pointer;
 }
 
 .build-item__desc {
   font-family: 'Roboto', sans-serif;
   font-size: 12px;
   color: var(--bm-gray);
   margin-top: 3px;
 }
 
 .build-item__prereq {
   font-size: 12px;
   color: var(--bm-tourney-red-light);
   display: flex;
   align-items: center;
   gap: 5px;
   margin-top: 3px;
 }
 
 .build-item__slots {
   background: var(--bm-dark-1);
   color: var(--bm-gold);
   padding: 6px 12px;
   padding-bottom: 5px;
   font-family: 'Audiowide', sans-serif;
   font-size: 13px;
   margin-left: 15px;
   border: 1px solid var(--bm-tourney-red);
 }
 
 .build-item__double {
   display: flex;
   align-items: center;
   gap: 8px;
   margin-left: 15px;
   padding: 6px 12px;
   background: var(--bm-dark-1);
   border-radius: 6px;
   font-size: 13px;
   color: var(--bm-gray);
   border: 1px solid var(--bm-tourney-red);
 }
 
 .build-item__double input {
   accent-color: var(--bm-gold);
   cursor: pointer;
 }
 
 .build-item__double--active {
   background: rgba(255, 207, 46, 0.2);
   color: var(--bm-gold);
 }
 
 /* Submit Button - DBZ Power Style */
 .build-submit-btn {
   display: block;
   width: 100%;
   padding: 22px;
   margin-top: 30px;
   background: linear-gradient(180deg, #CC0000 0%, #880000 100%);
   border: none;
   border-radius: 0;
   font-family: 'Audiowide', sans-serif;
   font-size: 16px;
   color: var(--bm-white);
   cursor: pointer;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 2px;
   position: relative;
   overflow: hidden;
   box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2);
 }
 
 .build-submit-btn::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
   transition: left 0.5s ease;
 }
 
 .build-submit-btn:hover::before {
   left: 100%;
 }
 
 .build-submit-btn:hover {
   background: linear-gradient(180deg, #DD2222 0%, #AA0000 100%);
   transform: translateY(-3px);
   box-shadow: 
     0 10px 30px var(--bm-red-glow),
     inset 0 2px 0 rgba(255, 255, 255, 0.3);
 }
 
 .build-submit-btn:active {
   transform: translateY(-1px);
 }
 
 /* Patreon Upsell */
 .patreon-upsell {
   background: linear-gradient(135deg, var(--bm-dark-2), var(--bm-dark-3));
   border: 3px dashed var(--bm-tourney-red);
   border-radius: 12px;
   padding: 50px 30px;
   text-align: center;
 }
 
 .patreon-upsell__icon {
   font-size: 64px;
   margin-bottom: 20px;
 }
 
 .patreon-upsell__title {
   font-family: 'Wendy One', sans-serif;
   font-size: 28px;
   color: var(--bm-white);
   margin-bottom: 15px;
 }
 
 .patreon-upsell__text {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   color: var(--bm-gray);
   margin-bottom: 25px;
   max-width: 400px;
   margin-left: auto;
   margin-right: auto;
 }
 
 .patreon-upsell__btn {
   display: inline-block;
   padding: 15px 35px;
   background: var(--bm-tourney-red);
   color: var(--bm-white);
   font-family: 'Audiowide', sans-serif;
   font-size: 16px;
   text-decoration: none;
   border-radius: 8px;
   transition: all 0.3s ease;
   text-transform: uppercase;
   border: 2px solid var(--bm-tourney-red-light);
 }
 
 .patreon-upsell__btn:hover {
   background: var(--bm-tourney-red-light);
   transform: translateY(-3px);
   box-shadow: 0 8px 25px var(--bm-red-glow);
 }
 
 /* Entry Submit Panel */
 .entry-submit-panel {
   margin-top: 30px;
 }
 
 .entry-submit-panel__content {
   background: linear-gradient(180deg, rgba(20, 20, 20, 0.95) 0%, rgba(10, 10, 10, 0.98) 100%);
   backdrop-filter: blur(10px);
   border-radius: 0;
   padding: 35px;
   box-shadow: 0 0 30px rgba(0, 163, 42, 0.4);
   position: relative;
   text-align: center;
 }
 
 .entry-submit-panel__content::after {
   content: '';
   position: absolute;
   top: -12px;
   left: -8px;
   right: -8px;
   bottom: -15px;
   border: 20px solid transparent;
   border-image-source: url('../images/border.svg');
   border-image-slice: 105 fill;
   border-image-width: 87px;
   border-image-repeat: stretch;
   pointer-events: none;
   z-index: 10;
   filter: hue-rotate(120deg) saturate(1.2);
 }
 
 .entry-submit-panel__title {
   font-family: 'Audiowide', sans-serif;
   font-size: 24px;
   color: var(--bm-white);
   margin-bottom: 15px;
   text-transform: uppercase;
   letter-spacing: 2px;
   text-shadow: 0 0 15px rgba(255, 255, 255, 0.3);
 }
 
 .entry-submit-panel__text {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   line-height: 1.7;
   color: var(--bm-gray);
   margin-bottom: 25px;
 }
 
 .entry-submit-panel__text strong {
   color: var(--bm-gold);
   font-weight: 700;
 }
 
 .entry-submit-panel__btn {
   display: inline-block;
   padding: 18px 40px;
   background: linear-gradient(180deg, var(--bm-green) 0%, #008020 100%);
   color: var(--bm-white);
   font-family: 'Audiowide', sans-serif;
   font-size: 18px;
   font-weight: 700;
   text-decoration: none;
   border-radius: 0;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 2px;
   border: 2px solid var(--bm-green);
   box-shadow: 
     0 0 30px rgba(0, 163, 42, 0.5),
     inset 0 2px 0 rgba(255, 255, 255, 0.3);
   position: relative;
   overflow: hidden;
   cursor: pointer;
   border: none;
 }
 
 .entry-submit-panel__btn::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.5s ease;
 }
 
 .entry-submit-panel__btn:hover::before {
   left: 100%;
 }
 
 .entry-submit-panel__btn:hover {
   transform: translateY(-3px);
   box-shadow: 
     0 10px 40px rgba(0, 163, 42, 0.7),
     inset 0 2px 0 rgba(255, 255, 255, 0.4);
   background: linear-gradient(180deg, #00CC33 0%, var(--bm-green) 100%);
 }
 
 .entry-submit-panel__build-summary {
   margin: 20px 0;
   padding: 20px;
   background: rgba(0, 0, 0, 0.3);
   border-radius: 0;
   border: 2px solid rgba(0, 163, 42, 0.3);
 }
 
 .entry-submit-panel__build-text {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   color: var(--bm-white);
   margin-bottom: 10px;
   font-weight: 600;
 }
 
 .entry-submit-panel__build-details {
   font-family: 'Audiowide', sans-serif;
   font-size: 18px;
   color: var(--bm-green);
   text-shadow: 0 0 10px rgba(0, 163, 42, 0.5);
 }
 
 .entry-submit-panel__actions {
   display: flex;
   gap: 15px;
   justify-content: center;
   flex-wrap: wrap;
 }
 
 .entry-submit-panel__btn--edit {
   background: linear-gradient(180deg, rgba(60, 60, 60, 0.9) 0%, rgba(30, 30, 30, 0.95) 100%);
   border: 2px solid rgba(100, 100, 100, 0.5);
   color: var(--bm-gray);
   box-shadow: 
     0 0 20px rgba(100, 100, 100, 0.3),
     inset 0 2px 0 rgba(255, 255, 255, 0.1);
 }
 
 .entry-submit-panel__btn--edit:hover {
   border-color: var(--bm-gray);
   color: var(--bm-white);
   background: linear-gradient(180deg, rgba(80, 80, 80, 0.9) 0%, rgba(50, 50, 50, 0.95) 100%);
   box-shadow: 
     0 0 25px rgba(150, 150, 150, 0.4),
     inset 0 2px 0 rgba(255, 255, 255, 0.2);
 }
 
 /* ============================================
    PAST CHAMPIONS SECTION
    ============================================ */
 .past-champions {
   background: transparent;
   padding: 60px 20px;
 }
 
 .past-champions__list {
   max-width: 900px;
   margin: 0 auto;
 }
 
 .past-champion-item {
   display: flex;
   align-items: center;
   background: linear-gradient(180deg, rgba(30, 30, 30, 0.9) 0%, rgba(20, 20, 20, 0.95) 100%);
   backdrop-filter: blur(10px);
   border-radius: 0;
   padding: 20px 25px;
   margin-bottom: 12px;
   transition: all 0.3s ease;
   border: 2px solid rgba(100, 100, 100, 0.3);
   border-left: 4px solid var(--bm-gold);
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
   position: relative;
 }
 
 .past-champion-item:hover {
   transform: translateX(8px);
   box-shadow: 0 0 25px var(--bm-red-glow);
   border-color: var(--bm-tourney-red-light);
 }
 
 .past-champion-item__trophy {
   font-size: 36px;
   margin-right: 20px;
 }
 
 .past-champion-item__month {
   font-family: 'Roboto', sans-serif;
   font-size: 18px;
   color: var(--bm-gray);
   min-width: 150px;
 }
 
 .past-champion-item__name {
   font-family: 'Audiowide', sans-serif;
   font-size: 22px;
   color: var(--bm-white);
   flex: 1;
 }
 
 .past-champion-item__fighter {
   font-family: 'Roboto', sans-serif;
   font-size: 18px;
   font-weight: 600;
   color: var(--bm-tourney-red-light);
   min-width: 120px;
   text-align: center;
 }
 
 .past-champion-item__prize {
   font-family: 'Audiowide', sans-serif;
   font-size: 24px;
   color: var(--bm-gold);
   min-width: 100px;
   text-align: right;
   text-shadow: 0 0 10px rgba(255, 207, 46, 0.5);
 }
 
 /* ============================================
    MUSIC CONTROL
    ============================================ */
 .music-control {
   position: fixed;
   top: 20px;
   right: 20px;
   width: 50px;
   height: 50px;
   background: linear-gradient(180deg, rgba(30, 30, 30, 0.95) 0%, rgba(20, 20, 20, 0.98) 100%);
   border: 2px solid var(--bm-tourney-red);
   border-radius: 50%;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1000;
   transition: all 0.3s ease;
   backdrop-filter: blur(10px);
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
 }
 
 .music-control:hover {
   background: linear-gradient(180deg, rgba(50, 20, 20, 0.95) 0%, rgba(30, 10, 10, 0.98) 100%);
   border-color: var(--bm-tourney-red-light);
   box-shadow: 0 0 20px var(--bm-red-glow);
   transform: scale(1.1);
 }
 
 .music-control__icon {
   font-size: 24px;
   line-height: 1;
   transition: transform 0.2s ease;
 }
 
 .music-control:hover .music-control__icon {
   transform: scale(1.1);
 }
 
 /* ============================================
    ENTERED TOURNAMENT DISPLAY
    ============================================ */
 .entered-display {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 3000;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 20px;
 }
 
 .entered-display__overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(0, 0, 0, 0.85);
   backdrop-filter: blur(5px);
 }
 
 .entered-display__content {
   position: relative;
   backdrop-filter: blur(15px);
   border-radius: 0;
   padding: 60px 50px;
   max-width: 600px;
   width: 100%;
   text-align: center;
   position: relative;
   animation: entered-pop-in 0.5s ease-out;
 }
 
 @keyframes entered-pop-in {
   0% {
     opacity: 0;
     transform: scale(0.8) translateY(-20px);
   }
   100% {
     opacity: 1;
     transform: scale(1) translateY(0);
   }
 }
 
 .entered-display__content::after {
   content: '';
   position: absolute;
   top: -12px;
   left: -12px;
   right: -12px;
   bottom: -12px;
   border: 25px solid transparent;
   border-image-source: url('../images/border.svg');
   border-image-slice: 80 fill;
   border-image-width: 90px;
   border-image-repeat: stretch;
   pointer-events: none;
   z-index: 10;
   filter: hue-rotate(120deg) saturate(1.2);
 }
 
 .entered-display__icon {
   font-size: 80px;
   margin-bottom: 20px;
   animation: entered-check-pulse 1s ease-in-out infinite;
 }
 
 @keyframes entered-check-pulse {
   0%, 100% {
     transform: scale(1);
     filter: drop-shadow(0 0 10px rgba(0, 255, 0, 0.5));
   }
   50% {
     transform: scale(1.1);
     filter: drop-shadow(0 0 20px rgba(0, 255, 0, 0.8));
   }
 }
 
 .entered-display__title {
   font-family: 'Audiowide', sans-serif;
   font-size: 36px;
   color: var(--bm-green);
   margin-bottom: 25px;
   text-transform: uppercase;
   letter-spacing: 3px;
   text-shadow: 
     0 0 20px rgba(0, 163, 42, 0.6),
     2px 2px 4px rgba(0, 0, 0, 0.8);
 }
 
 .entered-display__fighter {
   font-family: 'Roboto', sans-serif;
   font-size: 22px;
   color: var(--bm-white);
   margin-bottom: 15px;
   line-height: 1.6;
 }
 
 .entered-display__fighter strong {
   color: var(--bm-gold);
   font-weight: 700;
   font-size: 26px;
   text-shadow: 0 0 15px rgba(255, 207, 46, 0.5);
 }
 
 .entered-display__build-info {
   font-family: 'Audiowide', sans-serif;
   font-size: 18px;
   color: var(--bm-green);
   margin-bottom: 20px;
   padding: 15px;
   background: rgba(0, 163, 42, 0.1);
   border: 2px solid rgba(0, 163, 42, 0.3);
   text-shadow: 0 0 10px rgba(0, 163, 42, 0.5);
 }
 
 .entered-display__message {
   font-family: 'Roboto', sans-serif;
   font-size: 18px;
   color: var(--bm-gray);
   margin-bottom: 30px;
   line-height: 1.6;
 }
 
 .entered-display__close-btn {
   padding: 15px 40px;
   background: linear-gradient(180deg, var(--bm-green) 0%, #008020 100%);
   border: 2px solid var(--bm-green);
   color: var(--bm-white);
   font-family: 'Audiowide', sans-serif;
   font-size: 18px;
   font-weight: 700;
   cursor: pointer;
   transition: all 0.3s ease;
   text-transform: uppercase;
   letter-spacing: 2px;
   box-shadow: 
     0 0 30px rgba(0, 163, 42, 0.5),
     inset 0 2px 0 rgba(255, 255, 255, 0.3);
   position: relative;
   overflow: hidden;
   border-radius: 0;
 }
 
 .entered-display__close-btn::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.5s ease;
 }
 
 .entered-display__close-btn:hover::before {
   left: 100%;
 }
 
 .entered-display__close-btn:hover {
   transform: translateY(-3px);
   box-shadow: 
     0 10px 40px rgba(0, 163, 42, 0.7),
     inset 0 2px 0 rgba(255, 255, 255, 0.4);
   background: linear-gradient(180deg, #00CC33 0%, var(--bm-green) 100%);
 }
 
 /* Entered Indicator (Persistent) */
 .entered-indicator {
   margin-top: 30px;
   margin-bottom: 30px;
   animation: entered-indicator-fade-in 0.5s ease-out;
 }
 
 @keyframes entered-indicator-fade-in {
   from {
     opacity: 0;
     transform: translateY(-10px);
   }
   to {
     opacity: 1;
     transform: translateY(0);
   }
 }
 
 .entered-indicator__content {
   display: flex;
   align-items: center;
   gap: 20px;
   padding: 20px 30px;
   background: linear-gradient(135deg, rgba(0, 163, 42, 0.15) 0%, rgba(0, 100, 25, 0.2) 100%);
   border: 2px solid var(--bm-green);
   border-radius: 0;
   box-shadow: 
     0 0 30px rgba(0, 163, 42, 0.4),
     inset 0 0 20px rgba(0, 163, 42, 0.1);
   position: relative;
   overflow: hidden;
 }
 
 .entered-indicator__content::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(0, 163, 42, 0.2), transparent);
   animation: entered-indicator-shine 3s ease-in-out infinite;
 }
 
 @keyframes entered-indicator-shine {
   0% {
     left: -100%;
   }
   50%, 100% {
     left: 100%;
   }
 }
 
 .entered-indicator__icon {
   font-size: 40px;
   flex-shrink: 0;
   animation: entered-check-pulse 2s ease-in-out infinite;
   filter: drop-shadow(0 0 10px rgba(0, 255, 0, 0.5));
 }
 
 .entered-indicator__text {
   display: flex;
   flex-direction: column;
   gap: 5px;
   flex: 1;
 }
 
 .entered-indicator__title {
   font-family: 'Audiowide', sans-serif;
   font-size: 24px;
   color: var(--bm-green);
   text-transform: uppercase;
   letter-spacing: 2px;
   text-shadow: 
     0 0 15px rgba(0, 163, 42, 0.6),
     1px 1px 3px rgba(0, 0, 0, 0.8);
 }
 
 .entered-indicator__subtitle {
   font-family: 'Roboto', sans-serif;
   font-size: 16px;
   color: var(--bm-gray);
   line-height: 1.4;
 }
 
 /* Hide sections based on state */
 .hidden { display: none !important; }
 
 /* ============================================
    RESPONSIVE STYLES
    ============================================ */
 @media (max-width: 992px) {
   .section-title { font-size: 36px; }
   .tournament-rules__title { font-size: 36px; }
 }
 
 @media (max-width: 768px) {
   .hero { padding: 15px 10px 0; }
   .section-title { font-size: 26px; }
   
   .hero-logo img {
     max-width: 280px;
   }
   
   .tournament-graphic--horizontal {
     max-width: 300px;
   }
   
   .winner-horizontal {
     flex-direction: column;
     gap: 10px;
   }
   
   .winner-info {
     align-items: center;
   }
   
   .winner-details {
     flex-direction: column;
     gap: 5px;
   }
   
   .winner-name {
     font-size: 22px;
   }
   
   .winner-prize {
     font-size: 32px;
   }
 
   .selection-content { flex-direction: column; text-align: center; }
   .selection-image { width: 80px; height: 80px; }
   .selection-name { font-size: 22px; }
   .build-form { padding: 20px; }
   .build-form__header { flex-direction: column; text-align: center; }
   .build-item { flex-wrap: wrap; padding: 12px; }
   .build-item__double { margin-left: 0; margin-top: 10px; width: 100%; justify-content: center; }
   .past-champion-item { flex-wrap: wrap; gap: 10px; }
   .past-champion-item__month { min-width: auto; }
   .past-champion-item__name { width: 100%; order: -1; }
   
   .tournament-rules__title { font-size: 28px; }
   .tournament-rules__text { font-size: 18px; line-height: 1.6; }
   .tournament-rules__enter-btn { padding: 18px 35px; font-size: 18px; }
 }
 
 /* ============================================================
    THE BOX MAN — Custom CSS for Smash Balloon YouTube Feed
    Drop this into: Appearance > Customize > Additional CSS
    or Elementor > Site Settings > Custom CSS
    ============================================================ */
 
 /* ── Variables ── */
 :root {
   --bm-gold: #d4a017;
   --bm-gold-bright: #f5c518;
   --bm-gold-dim: #8a6b0f;
   --bm-orange: #e85d26;
   --bm-bg-card: #111118;
   --bm-bg-card-hover: #1a1a24;
   --bm-text: #e8e4dc;
   --bm-text-dim: #8a8678;
   --bm-border: rgba(212, 160, 23, 0.15);
   --bm-border-bright: rgba(212, 160, 23, 0.4);
   --bm-nintendo-red: #e4002b;
 }
 
 
 /* ============================================================
    SCHEDULE SECTION (add HTML widget above the SB shortcode)
    ============================================================ */
 
 .bm-schedule {
   margin: 0 auto 2rem;
   padding: 0 15px;
 }
 
 .bm-schedule-header {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 0.75rem;
   margin-bottom: 1.25rem;
 }
 
 .bm-schedule-header .bm-line {
   flex: 1;
   max-width: 120px;
   height: 1px;
   background: linear-gradient(90deg, transparent, var(--bm-gold-dim), transparent);
 }
 
 .bm-schedule-header h2 {
   font-family: Audiowide, sans-serif;
   font-size: 1.3rem !important;
   font-weight: 700 !important;
   letter-spacing: 0.2em;
   text-transform: uppercase;
   color: #fdf100 !important;
   margin: 0 !important;
   padding: 0 !important;
   line-height: 1.4 !important;
 }
 
 .bm-live-dot {
   width: 8px;
   height: 8px;
   border-radius: 50%;
   background: #e53935;
   display: inline-block;
   margin-right: 0.25rem;
   vertical-align: middle;
   animation: bmLivePulse 1.5s ease-in-out infinite;
 }
 
 @keyframes bmLivePulse {
   0%, 100% { box-shadow: 0 0 0 0 rgba(229, 57, 53, 0.6); }
   50% { box-shadow: 0 0 0 6px rgba(229, 57, 53, 0); }
 }
 
 .bm-schedule-cards {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 1rem;
 }
 
 .bm-schedule-card {
   position: relative;
   border: 1px solid var(--bm-border);
   border-radius: 10px;
   padding: 1.5rem 1.5rem 1.5rem 1.5rem;
   background: var(--bm-bg-card);
   overflow: hidden;
   transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
 }
 
 .bm-schedule-card:hover {
   border-color: var(--bm-border-bright);
   transform: translateY(-3px);
   box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
 }
 
 /* Colored top stripe */
 .bm-schedule-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 3px;
 }
 
 .bm-schedule-card.bm-nintendo::before {
   background: linear-gradient(90deg, #e4002b, #e4002b 50%, #0058a3 50%);
 }
 
 .bm-schedule-card.bm-starwars::before {
   background: linear-gradient(90deg, var(--bm-gold-bright), var(--bm-gold-dim));
 }
 
 .bm-schedule-day {
   font-family: Audiowide, sans-serif;
   font-weight: 700;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   color: #eee;
   margin-bottom: 0.4rem;
 }
 
 .bm-schedule-series {
   font-family: 'Bangers', cursive;
   font-size: 2rem;
   letter-spacing: 0.04em;
   line-height: 1.1;
   margin: 20px 0;
   font-weight: bold;
 }
 
 .bm-nintendo .bm-schedule-series {
   color: var(--bm-nintendo-red);
 }
 
 .bm-starwars .bm-schedule-series {
   color: var(--bm-gold-bright);
 }
 
 .bm-schedule-desc {
   line-height: 1.5;
   color: #eee;
   margin: 0;
 }
 
 .bm-schedule-time {
   display: inline-flex;
   align-items: center;
   gap: 0.35rem;
   margin-top: 0.75rem;
   font-family: 'Orbitron', sans-serif;
   font-size: 0.75rem;
   font-weight: 700;
   letter-spacing: 0.1em;
   text-transform: uppercase;
   color: var(--bm-text);
   background: rgba(255, 255, 255, 0.06);
   padding: 0.3rem 0.6rem;
   border-radius: 4px;
   font-family: Audiowide, sans-serif;
 }
 
 .bm-schedule-emoji {
   position: absolute;
   bottom: 12px;
   right: 16px;
   font-size: 2.2rem;
   opacity: 0.12;
   pointer-events: none;
 }
 
 @media (max-width: 768px) {
   .bm-schedule-cards {
     grid-template-columns: 1fr;
   }
 }
 
 
 /* ============================================================
    SMASH BALLOON FEED — POLISH
    ============================================================ */
 
 /* ── Main container ── */
 .sb_youtube {
   background: transparent !important;
   padding: 15px !important;
 }
 
 /* ── Featured player area ── */
 .sb_youtube .sby_player_outer_wrap {
   border: 5px solid rgb(252 241 0) !important;
   border-radius: 12px !important;
   overflow: hidden !important;
   box-shadow:
     0 0 40px rgba(212, 160, 23, 0.08),
     0 20px 60px rgba(0, 0, 0, 0.5) !important;
   transition: box-shadow 0.3s !important;
   padding: 0 !important;
 }
 
 .sb_youtube .sby_player_outer_wrap:hover {
   box-shadow:
     0 0 50px rgba(212, 160, 23, 0.15),
     0 20px 60px rgba(0, 0, 0, 0.6) !important;
 }
 
 /* ── Video grid items ── */
 .sb_youtube .sby_items_wrap {
   gap: 30px !important;
   padding: 0 !important;
   margin-top: 30px;
   display: flex;
   flex-wrap: wrap;
 }
 
 .sb_youtube .sby_item {
   transition: transform 0.3s ease, box-shadow 0.3s ease !important;
   width: calc(33.33% - 20px) !important;
   overflow: hidden !important;
   padding: 5px !important;
 }
 
 .sb_youtube .sby_item .sby_inner_item {
   border-radius: 8px !important;
   overflow: hidden !important;
   border: 1px solid var(--bm-border) !important;
   background: var(--bm-bg-card) !important;
   transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s !important;
   overflow: hidden !important;
 }
 
 .sb_youtube .sby_item:hover .sby_inner_item {
   border-color: var(--bm-gold) !important;
   transform: translateY(-4px) scale(1.02) !important;
   box-shadow:
     0 8px 30px rgba(0, 0, 0, 0.5),
     0 0 15px rgba(212, 160, 23, 0.1) !important;
 }
 
 /* Currently playing item highlight */
 .sb_youtube .sby_item.sby_current .sby_inner_item {
   border-color: var(--bm-gold-bright) !important;
   box-shadow: 0 0 20px rgba(245, 197, 24, 0.15) !important;
 }
 
 /* ── Thumbnails ── */
 .sb_youtube .sby_video_thumbnail {
   border-radius: 8px 8px 0 0 !important;
   overflow: hidden !important;
 }
 
 .sb_youtube .sby_item .sby_video_thumbnail {
   transition: filter 0.3s !important;
 }
 
 .sb_youtube .sby_item:hover .sby_video_thumbnail {
   filter: brightness(1.1) !important;
 }
 
 /* ── Hover overlay ── */
 .sb_youtube .sby_thumbnail_hover {
   background: linear-gradient(
     0deg,
     rgba(0, 0, 0, 0.85) 0%,
     rgba(0, 0, 0, 0.4) 50%,
     transparent 100%
   ) !important;
   opacity: 0 !important;
   transition: opacity 0.3s ease !important;
   display: flex !important;
   align-items: flex-end !important;
 }
 
 .sb_youtube .sby_item:hover .sby_thumbnail_hover {
   opacity: 1 !important;
 }
 
 .sb_youtube .sby_thumbnail_hover_inner {
   padding: 12px !important;
   width: 100% !important;
 }
 
 /* ── Video titles ── */
 .sb_youtube .sby_video_title {
   font-family: 'Chakra Petch', sans-serif !important;
   font-size: 0.8rem !important;
   font-weight: 600 !important;
   line-height: 1.35 !important;
   color: #fff !important;
   text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
   display: -webkit-box !important;
   -webkit-line-clamp: 2 !important;
   -webkit-box-orient: vertical !important;
   overflow: hidden !important;
 }
 
 /* ── Play button ── */
 .sb_youtube .sby_play_btn {
   transition: transform 0.25s ease, opacity 0.25s ease !important;
 }
 
 .sb_youtube .sby_item:hover .sby_play_btn {
   transform: scale(1.1) !important;
 }
 
 .sb_youtube .sby_play_btn .sby_play_btn_bg {
   background: rgba(0, 0, 0, 0.5) !important;
   border-radius: 50% !important;
 }
 
 .sb_youtube .sby_play_btn svg {
   color: #fff !important;
   filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4)) !important;
 }
 
 /* ── Footer: Load More & Subscribe buttons ── */
 .sb_youtube .sby_footer {
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   gap: 1rem !important;
   padding-top: 1.5rem !important;
 }
 
 .sb_youtube .sby_load_btn {
   font-family: 'Orbitron', sans-serif !important;
   font-size: 0.7rem !important;
   font-weight: 700 !important;
   letter-spacing: 0.12em !important;
   text-transform: uppercase !important;
   color: var(--bm-text) !important;
   background: transparent !important;
   border: 1px solid var(--bm-border-bright) !important;
   padding: 0.6rem 1.8rem !important;
   border-radius: 5px !important;
   cursor: pointer !important;
   transition: all 0.3s !important;
   margin: 0 !important;
 }
 
 .sb_youtube .sby_load_btn:hover {
   background: rgba(212, 160, 23, 0.1) !important;
   border-color: var(--bm-gold) !important;
   box-shadow: 0 0 15px rgba(212, 160, 23, 0.15) !important;
 }
 
 .sb_youtube .sby_follow_btn a {
   font-family: 'Orbitron', sans-serif !important;
   font-size: 0.7rem !important;
   font-weight: 700 !important;
   letter-spacing: 0.1em !important;
   text-transform: uppercase !important;
   border-radius: 5px !important;
   padding: 0.55rem 1.2rem !important;
   transition: all 0.3s !important;
 }
 
 .sb_youtube .sby_follow_btn a:hover {
   box-shadow: 0 0 15px rgba(229, 57, 53, 0.3) !important;
 }
 
 /* ============================================================
   SOCIAL LINKS BAR
   ============================================================ */
 
.bm-socials {
  max-width: 1180px;
  text-align: center;
  animation: bmFadeUp 0.5s ease-out both;
  border: solid 4px #fdf100;
  padding: 40px;
  border-radius: 10px;
  backdrop-filter: blur(8px);
  margin-bottom: 50px;
}
 
.bm-socials-header {
  margin-bottom: 1.5rem;
}
 
.bm-socials-heading {
  font-family: Audiowide, sans-serif;
  font-size: clamp(1.8rem, 4vw, 2.5rem) !important;
  color: #fdf100 !important;
  letter-spacing: 0.04em;
  text-shadow: 0 0 10px rgba(245, 197, 24, 0.2), 0 2px 0 var(--bm-gold-dim);
  margin: 0 0 0.4rem !important;
}
 
.bm-socials-sub {
  color: #eee;
  /* max-width: 480px; */
  margin: 0 auto;
  line-height: 1.5;
  font-size: 18px;
}
 
.bm-socials-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.65rem;
}
 
/* ── Pill buttons ── */
.bm-social-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 1.1rem;
  border: 1px solid var(--bm-border);
  border-radius: 8px;
  background: var(--bm-bg-card);
  color: var(--bm-text-dim);
  text-decoration: none;
  font-family: 'Chakra Petch', sans-serif;
  font-size: 0.8rem;
  font-weight: 600;
  transition: all 0.3s ease;
}
 
.bm-social-pill:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}
 
.bm-social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
 
.bm-social-icon svg {
  width: 100%;
  height: 100%;
}
 
.bm-social-name {
  white-space: nowrap;
}
 
/* ── Per-platform hover colors ── */
.bm-social--youtube:hover {
  border-color: #ff0000;
  color: #ff0000;
  box-shadow: 0 8px 25px rgba(255, 0, 0, 0.15);
}
 
.bm-social--twitch:hover {
  border-color: #9146ff;
  color: #9146ff;
  box-shadow: 0 8px 25px rgba(145, 70, 255, 0.15);
}
 
.bm-social--discord:hover {
  border-color: #5865f2;
  color: #5865f2;
  box-shadow: 0 8px 25px rgba(88, 101, 242, 0.15);
}
 
.bm-social--facebook:hover {
  border-color: #1877f2;
  color: #1877f2;
  box-shadow: 0 8px 25px rgba(24, 119, 242, 0.15);
}
 
.bm-social--instagram:hover {
  border-color: #e4405f;
  color: #e4405f;
  box-shadow: 0 8px 25px rgba(228, 64, 95, 0.15);
}
 
.bm-social--twitter:hover {
  border-color: #ffffff;
  color: #ffffff;
  box-shadow: 0 8px 25px rgba(255, 255, 255, 0.1);
}
 
.bm-social--tiktok:hover {
  border-color: #fe2c55;
  color: #fe2c55;
  box-shadow: 0 8px 25px rgba(254, 44, 85, 0.15);
}
 
.bm-social--patreon:hover {
  border-color: #f96854;
  color: #f96854;
  box-shadow: 0 8px 25px rgba(249, 104, 84, 0.15);
}
 
.bm-social--kick:hover {
  border-color: #53fc18;
  color: #53fc18;
  box-shadow: 0 8px 25px rgba(83, 252, 24, 0.15);
}
 
.bm-social--threads:hover {
  border-color: #ffffff;
  color: #ffffff;
  box-shadow: 0 8px 25px rgba(255, 255, 255, 0.1);
}
 
@media (max-width: 480px) {
  .bm-social-pill {
    padding: 0.5rem 0.9rem;
    font-size: 0.75rem;
  }
}