.language-switcher{display:flex;gap:.5rem;background:#0003;padding:.25rem;border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.lang-btn{padding:.5rem 1rem;background:transparent;border:2px solid transparent;color:#ffffffb3;font-weight:600;font-size:.875rem;cursor:pointer;border-radius:6px;transition:all .3s ease;min-width:45px}.lang-btn:hover{color:#fff;background:#ffffff1a}.lang-btn.active{background:linear-gradient(135deg,#d4af37,#f4d03f);color:#1a1a1a;border-color:#d4af37;box-shadow:0 2px 8px #d4af374d}.lang-btn.active:hover{background:linear-gradient(135deg,#f4d03f,#d4af37);transform:translateY(-1px);box-shadow:0 4px 12px #d4af3766}.navigation{background:linear-gradient(135deg,#0a0a0a,#1a1a1a);box-shadow:0 2px 10px #00000080;position:sticky;top:0;z-index:1000;border-bottom:2px solid #b8860b}.nav-container{max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center;height:70px}.logo{text-decoration:none;display:flex;align-items:center;gap:.75rem}.logo-image{height:40px;width:auto;object-fit:contain}.logo-icon{font-size:1.75rem;color:#b8860b}.logo-text{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#b8860b,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:1px}.nav-menu{display:flex;list-style:none;gap:.5rem;align-items:center;margin:0;padding:0}.lang-switcher-item{margin-left:.5rem}.nav-link{color:#fff;text-decoration:none;font-size:.95rem;font-weight:500;padding:.5rem .75rem;border-radius:8px;transition:all .3s ease;position:relative;white-space:nowrap}.nav-link:hover{background:#b8860b26}.nav-link.active{background:#b8860b33;color:gold}.nav-link.active:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:6px;height:6px;background:#b8860b;border-radius:50%}.nav-button{background:#b8860b26;border:1px solid rgba(184,134,11,.3);cursor:pointer;font-family:inherit;font-size:.95rem;font-weight:500;white-space:nowrap}.nav-button:hover{background:#b8860b40;border-color:#b8860b}.nav-login{background:#b8860b33;border:1px solid rgba(184,134,11,.4)}.nav-login:hover{background:#b8860b4d;border-color:#b8860b}.nav-uno{background:linear-gradient(135deg,#ff3b3b26,#ffd53426,#2dd36f26);border:1px solid rgba(168,85,247,.3);font-weight:700;letter-spacing:1px}.nav-uno:hover{background:linear-gradient(135deg,#ff3b3b40,#ffd53440,#2dd36f40);border-color:#a855f7;transform:translateY(-1px);box-shadow:0 4px 15px #a855f74d}.nav-uno.active{background:linear-gradient(135deg,#ff3b3b4d,#ffd5344d,#2dd36f4d);border-color:#a855f7}.mobile-menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:5px}.mobile-menu-btn span{width:25px;height:3px;background:#fff;border-radius:3px;transition:all .3s ease}@media (max-width: 1024px){.nav-link{font-size:.85rem;padding:.4rem .5rem}.nav-button{font-size:.85rem}.nav-menu{gap:.25rem}}@media (max-width: 768px){.mobile-menu-btn{display:flex}.nav-menu{position:absolute;top:70px;left:0;right:0;background:linear-gradient(135deg,#0a0a0a,#1a1a1a);flex-direction:column;padding:1rem 0;gap:0;transform:translateY(-120%);transition:transform .3s ease;box-shadow:0 4px 10px #00000080;border-bottom:2px solid #b8860b}.nav-menu.active{transform:translateY(0)}.nav-menu li{width:100%}.nav-link{display:block;padding:1rem 2rem;border-radius:0;font-size:1rem}.nav-link.active:after{display:none}}.landing-page{flex:1;background:#0a0a0a}.hero{background:linear-gradient(135deg,#1a1a1ad9,#0a0a0ae6),url(/where-winds-meet-cropped.gif) center/cover fixed;color:#fff;padding:8rem 2rem;text-align:center;position:relative;overflow:hidden;border-bottom:2px solid #b8860b}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(184,134,11,.03) 2px,rgba(184,134,11,.03) 4px);pointer-events:none;z-index:1}.hero-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at center,transparent 0%,rgba(0,0,0,.7) 100%);pointer-events:none;z-index:0}.hero-content{max-width:900px;margin:0 auto;position:relative;z-index:2}.guild-emblem{font-size:5rem;margin-bottom:1rem;color:#b8860b;text-shadow:0 0 20px rgba(184,134,11,.5);animation:glow 2s ease-in-out infinite alternate}.guild-emblem-logo{height:auto;width:auto;margin-bottom:1rem;filter:drop-shadow(0 0 20px rgba(184,134,11,.5));animation:logoGlow 2s ease-in-out infinite alternate}.hero-logo-large{max-width:600px;width:90%;height:auto;margin-bottom:2rem;filter:drop-shadow(0 0 30px rgba(184,134,11,.6));animation:logoGlow 2s ease-in-out infinite alternate}@keyframes logoGlow{0%{filter:drop-shadow(0 0 20px rgba(184,134,11,.5))}to{filter:drop-shadow(0 0 30px rgba(255,215,0,.7))}}@keyframes glow{0%{text-shadow:0 0 20px rgba(184,134,11,.5),0 0 30px rgba(184,134,11,.3)}to{text-shadow:0 0 30px rgba(184,134,11,.8),0 0 40px rgba(184,134,11,.5)}}.hero-title{font-size:4.5rem;font-weight:900;margin-bottom:1.5rem;line-height:1.1;background:linear-gradient(135deg,#b8860b,gold,#b8860b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 4px 20px rgba(184,134,11,.3);letter-spacing:2px}.hero-subtitle{font-size:1.5rem;margin-bottom:2.5rem;opacity:.9;line-height:1.6;color:#d4d4d4;text-transform:uppercase;letter-spacing:3px;font-weight:300}.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.btn{padding:1rem 2.5rem;border-radius:4px;font-size:1.125rem;font-weight:700;text-decoration:none;transition:all .3s ease;cursor:pointer;border:none;text-transform:uppercase;letter-spacing:1px}.btn-primary{background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;box-shadow:0 4px 15px #b8860b66}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px #b8860b99;background:linear-gradient(135deg,gold,#b8860b)}.btn-secondary{background:transparent;color:#b8860b;border:2px solid #b8860b}.btn-secondary:hover{background:#b8860b1a;transform:translateY(-3px);border-color:gold;color:gold}.btn-large{padding:1.25rem 3rem;font-size:1.25rem}.about{padding:5rem 2rem;background:#141414;border-bottom:1px solid #333}.about-container{max-width:900px;margin:0 auto;text-align:center}.about-text{font-size:1.25rem;line-height:1.8;color:#d4d4d4;white-space:pre-line}.features{padding:5rem 2rem;background:linear-gradient(#0a0a0ad9,#0a0a0ad9),url(/where-winds-meet-cropped.gif) center/cover fixed;position:relative}.features-container{max-width:1200px;margin:0 auto}.section-title{text-align:center;font-size:3rem;font-weight:800;color:#b8860b;margin-bottom:3rem;text-transform:uppercase;letter-spacing:2px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}.feature-card{background:linear-gradient(135deg,#1a1a1a,#141414);padding:2.5rem;border-radius:8px;text-align:center;transition:all .3s ease;border:1px solid #333}.feature-card:hover{transform:translateY(-8px);box-shadow:0 12px 35px #b8860b4d;border-color:#b8860b}.feature-icon{width:70px;height:70px;margin:0 auto 1.5rem;background:linear-gradient(135deg,#b8860b,gold);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#0a0a0a}.feature-icon svg{width:36px;height:36px}.feature-card h3{font-size:1.5rem;color:gold;margin-bottom:1rem;font-weight:700}.feature-card p{font-size:1rem;color:#b8b8b8;line-height:1.6}.footer{background:#0a0a0a;color:#666;padding:2rem;text-align:center;border-top:1px solid #333}.footer-content{max-width:1200px;margin:0 auto}.footer p{opacity:.8;font-size:.95rem}.footer-links{display:flex;justify-content:center;align-items:center;gap:.75rem;margin-top:.5rem}.footer-privacy-link{color:#888;font-size:.8rem;text-decoration:none;transition:color .2s}.footer-privacy-link:hover{color:#a855f7}.footer-divider{color:#444;font-size:.8rem}.hero.hero-with-slider{padding:0;position:relative;min-height:80vh;display:flex;align-items:center;justify-content:center;background:none}.hero-slider{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden}.hero-slider-track{display:flex;height:100%;transition:transform .7s ease-in-out}.hero-slide{min-width:100%;height:100%;position:relative}.hero-slide img{width:100%;height:100%;object-fit:cover}.hero-slide-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom,#0000004d,#00000080,#000000b3)}.hero.hero-with-slider .hero-content{position:relative;z-index:10;padding:2rem}.hero-slider-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:20;width:50px;height:50px;border-radius:50%;background:#00000080;border:2px solid rgba(255,215,0,.5);color:gold;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.hero-slider-btn:hover{background:#b8860bcc;border-color:gold;transform:translateY(-50%) scale(1.1)}.hero-slider-btn svg{width:24px;height:24px}.hero-slider-btn.prev{left:1.5rem}.hero-slider-btn.next{right:1.5rem}.hero-slider-dots{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);z-index:20;display:flex;gap:.5rem}.hero-slider-dots .dot{width:12px;height:12px;border-radius:50%;background:#fff6;border:none;cursor:pointer;transition:all .3s ease}.hero-slider-dots .dot:hover{background:#ffffffb3}.hero-slider-dots .dot.active{background:gold;transform:scale(1.2)}.lightbox{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;z-index:1000;display:flex;align-items:center;justify-content:center;cursor:pointer}.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;width:50px;height:50px;border-radius:50%;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);color:#fff;font-size:1.25rem;cursor:pointer;transition:all .3s ease}@media (max-width: 768px){.hero{padding:5rem 1rem}.hero.hero-with-slider{min-height:60vh}.guild-emblem{font-size:3.5rem}.guild-emblem-logo{height:80px}.hero-logo-large{max-width:350px}.hero-title{font-size:2.5rem}.hero-subtitle{font-size:1.125rem}.section-title,.cta h2{font-size:2rem}.features,.about,.cta{padding:3rem 1rem}.stat-number{font-size:2.5rem}.hero-slider-btn{width:40px;height:40px}.hero-slider-btn.prev{left:.5rem}.hero-slider-btn.next{right:.5rem}.hero-slider-dots{bottom:1rem}.hero-slider-dots .dot{width:10px;height:10px}}.welcome-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;z-index:2000;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .3s ease}.welcome-modal{background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:20px;padding:2.5rem;max-width:450px;width:100%;text-align:center;border:2px solid #b8860b;box-shadow:0 25px 80px #b8860b4d;position:relative;animation:slideUp .4s ease}.welcome-modal-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;background:#ffffff1a;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.welcome-modal-close svg{width:20px;height:20px;color:#888}.welcome-modal-close:hover{background:#fff3}.welcome-modal-close:hover svg{color:#fff}.welcome-modal-content{display:flex;flex-direction:column;align-items:center}.welcome-modal-icon{width:100px;height:100px;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;box-shadow:0 10px 40px #d4af3780;border-radius:50%}.welcome-modal-icon svg{width:45px;height:45px;color:#0a0a0a}.welcome-modal-logo{width:100%;height:100%;object-fit:contain}.welcome-modal-title{font-size:1.75rem;font-weight:800;color:gold;margin:0 0 1rem;text-transform:uppercase;letter-spacing:1px}.welcome-modal-text{color:#ccc;font-size:1rem;line-height:1.7;margin:0 0 2rem}.welcome-modal-articles{max-height:300px;overflow-y:auto;margin-bottom:1.5rem;padding-right:.5rem}.welcome-modal-articles::-webkit-scrollbar{width:6px}.welcome-modal-articles::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.welcome-modal-articles::-webkit-scrollbar-thumb{background:#d4af3780;border-radius:3px}.welcome-article{background:#d4af371a;border:1px solid rgba(212,175,55,.3);border-radius:10px;padding:1rem;margin-bottom:1rem;text-align:left}.welcome-article:last-child{margin-bottom:0}.welcome-article-title{color:gold;font-size:1.1rem;font-weight:700;margin:0 0 .5rem}.welcome-article-content{color:#ccc;font-size:.95rem;line-height:1.6;margin:0;white-space:pre-wrap}.welcome-modal-actions{display:flex;flex-direction:row;gap:1rem;width:100%;justify-content:center}.welcome-register-btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;background:linear-gradient(135deg,#d4af37,gold,#d4af37);color:#1a1a2e;padding:1rem 1.5rem;border-radius:12px;font-size:1.1rem;font-weight:700;text-decoration:none;transition:all .3s ease;border:none;cursor:pointer;box-shadow:0 4px 15px #d4af374d}.welcome-register-btn:hover{background:linear-gradient(135deg,gold,#d4af37,gold);transform:translateY(-3px);box-shadow:0 10px 30px #d4af3780}.welcome-register-btn svg{width:22px;height:22px}.welcome-discord-btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;background:#5865f2;color:#fff;padding:1rem 1.5rem;border-radius:12px;font-size:1.1rem;font-weight:700;text-decoration:none;transition:all .3s ease;border:none;cursor:pointer}.welcome-discord-btn:hover{background:#4752c4;transform:translateY(-3px);box-shadow:0 10px 30px #5865f280}.welcome-discord-btn .discord-icon{width:24px;height:24px}@media (max-width: 480px){.welcome-modal{padding:2rem 1.5rem;margin:1rem}.welcome-modal-title{font-size:1.4rem}.welcome-modal-icon{width:80px;height:80px}.welcome-modal-icon svg{width:38px;height:38px}.welcome-modal-logo{width:80px;height:80px}.welcome-modal-actions{flex-direction:column}.welcome-register-btn,.welcome-discord-btn{width:100%;padding:1rem}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:2000;padding:1rem;animation:fadeIn .2s ease}.modal-content{background:#1a1a1a;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #000c;animation:slideUp .3s ease;border:2px solid #333}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:2px solid #333;background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;border-radius:12px 12px 0 0}.modal-header h2{font-size:1.5rem;font-weight:700}.close-btn{background:none;border:none;color:#0a0a0a;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;transition:all .2s ease;border-radius:50%;width:32px;height:32px}.close-btn:hover{background:#0003;transform:rotate(90deg)}.close-btn svg{width:20px;height:20px}.registration-form{padding:2rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:gold;font-size:.95rem}.form-group input,.form-group select{width:100%;padding:.875rem;border:2px solid #333;border-radius:8px;font-size:1rem;transition:all .2s ease;font-family:inherit;background:#0a0a0a;color:#d4d4d4}.form-group input:focus,.form-group select:focus{outline:none;border-color:#b8860b;box-shadow:0 0 0 3px #b8860b33}.form-actions{display:flex;gap:1rem;margin-top:2rem}.btn-cancel,.btn-submit{flex:1;padding:.875rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.btn-cancel{background:#333;color:#d4d4d4;border:2px solid #555}.btn-cancel:hover{background:#444;transform:translateY(-2px);border-color:#666}.btn-submit{background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;box-shadow:0 4px 10px #b8860b66}.btn-submit:hover{transform:translateY(-2px);box-shadow:0 6px 15px #b8860b99}.btn-submit:active,.btn-cancel:active{transform:translateY(0)}@media (max-width: 576px){.modal-content{max-width:100%;margin:0;border-radius:12px}.modal-header{padding:1rem}.modal-header h2{font-size:1.25rem}.registration-form{padding:1.5rem}.form-actions{flex-direction:column}}.tournament-page{flex:1;background:#0a0a0a}.tournament-header{background:linear-gradient(135deg,#1a1a1a,#0a0a0a);color:#fff;padding:4rem 2rem;border-bottom:2px solid #b8860b;text-align:center}.header-content h1{font-size:3rem;font-weight:800;margin-bottom:1rem;background:linear-gradient(135deg,#b8860b,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;letter-spacing:2px}.header-content p{font-size:1.25rem;color:#d4d4d4;opacity:.9}.header-content{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}.header-info h1{font-size:2.5rem;font-weight:700;margin-bottom:1rem}.tournament-meta{display:flex;gap:2rem;flex-wrap:wrap;opacity:.95}.meta-item{font-size:1rem}.register-btn{padding:1rem 2.5rem;background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;border:none;border-radius:10px;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #b8860b66;white-space:nowrap}.register-btn:hover{transform:translateY(-3px);box-shadow:0 6px 20px #b8860b99;background:linear-gradient(135deg,gold,#b8860b)}.tournament-content{max-width:1200px;margin:0 auto;padding:3rem 2rem;display:flex;flex-direction:column;gap:4rem;background:#0a0a0a}.section-title{font-size:2rem;font-weight:800;margin-bottom:2rem;background:linear-gradient(135deg,#b8860b,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;letter-spacing:2px}.rules-section,.current-tournament-section,.past-tournaments-section{background:linear-gradient(135deg,#1a1a1a,#141414);padding:2.5rem;border-radius:12px;box-shadow:0 2px 10px #00000080;border:1px solid #333}.rules-content{display:grid;gap:1.5rem}.rule-card{display:flex;gap:1.5rem;padding:1.5rem;background:#0a0a0a;border-radius:8px;border:2px solid #333;transition:all .3s ease}.rule-card:hover{border-color:#b8860b;transform:translate(8px);box-shadow:0 4px 12px #b8860b4d}.rule-number{width:50px;height:50px;flex-shrink:0;background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:900}.rule-info h3{color:gold;font-size:1.25rem;margin-bottom:.5rem;font-weight:700}.rule-info p{color:#d4d4d4;line-height:1.6}.tournament-card{background:#0a0a0a;padding:2rem;border-radius:12px;border:2px solid #333;position:relative;transition:all .3s ease}.tournament-card.active{border-color:#b8860b;box-shadow:0 4px 16px #b8860b66}.tournament-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #00000080}.tournament-badge{position:absolute;top:1rem;right:1rem;padding:.5rem 1rem;border-radius:20px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:1px}.tournament-badge.completed{background:#6464644d;color:#999;border:1px solid #555}.tournament-badge:not(.completed){background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 10px #b8860b80}50%{box-shadow:0 0 20px #b8860bcc}}.tournament-card h3{font-size:1.5rem;color:gold;margin-top:2rem;margin-bottom:1.5rem;font-weight:700;min-height:3.5rem;display:flex;align-items:center;line-height:1.4}.tournament-details{display:grid;gap:1rem;margin-bottom:1.5rem}.detail-item{display:flex;justify-content:space-between;padding:.75rem 1.25rem;background:#1a1a1a;border-radius:6px;border:1px solid #333;min-height:3rem;align-items:center}.detail-label{color:#999;font-weight:600;font-size:.95rem}.detail-value{color:#d4d4d4;font-weight:600;font-size:.95rem;text-align:right}.detail-value.champion{color:gold;font-weight:700;font-size:1rem}.tournament-actions{display:flex;gap:1rem;margin-top:2rem}.btn-view-bracket,.btn-register{flex:1;padding:1rem 2rem;border:none;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px}.btn-view-bracket{background:#333;color:#d4d4d4;border:2px solid #555}.btn-view-bracket:hover{background:#444;border-color:#b8860b;color:gold;transform:translateY(-2px)}.btn-register{background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;box-shadow:0 4px 15px #b8860b66}.btn-register:hover{transform:translateY(-2px);box-shadow:0 6px 20px #b8860b99}.tournaments-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.tournaments-grid .tournament-card{display:flex;flex-direction:column;height:auto;min-height:480px;max-height:550px;overflow:hidden;padding:1.75rem}.tournaments-grid .tournament-card h3{font-size:1.25rem;margin-top:1.75rem;margin-bottom:1.25rem;min-height:auto}.tournaments-grid .tournament-card .tournament-results{max-height:150px;overflow-y:auto;margin:1rem 0;padding:1rem}.tournaments-grid .tournament-card .tournament-details{margin-top:auto;gap:.75rem}.tournaments-grid .tournament-card .detail-item{padding:.75rem 1.25rem}.empty-tournaments{display:flex;justify-content:center;align-items:center;min-height:200px;color:#999;font-size:1.1rem;text-align:center}@media (max-width: 768px){.tournament-content{padding:2rem 1rem;gap:3rem}.rule-card{flex-direction:column;align-items:center;text-align:center}.tournament-actions{flex-direction:column}.tournaments-grid{grid-template-columns:1fr}}.section-title{font-size:2rem;font-weight:700;color:gold;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:3px solid #b8860b;text-transform:uppercase;letter-spacing:1px}.bracket-section{background:linear-gradient(135deg,#1a1a1a,#141414);padding:2rem;border-radius:12px;box-shadow:0 2px 10px #00000080;border:1px solid #333}.stage-tabs{display:flex;gap:.5rem;margin-bottom:2rem;border-bottom:2px solid #333;overflow-x:auto}.stage-tab{padding:1rem 1.5rem;background:transparent;border:none;border-bottom:3px solid transparent;font-size:1rem;font-weight:600;color:#999;cursor:pointer;transition:all .3s ease;white-space:nowrap;position:relative;display:flex;align-items:center;gap:.5rem}.stage-tab:hover:not(.disabled){color:gold;background:#b8860b1a}.stage-tab.active{color:gold;border-bottom-color:#b8860b;background:#b8860b26}.stage-tab.disabled{color:#ccc;cursor:not-allowed;opacity:.6;text-decoration:line-through}.empty-bracket{text-align:center;padding:4rem 2rem;color:#999;background:#f9f9f9;border-radius:8px}.empty-bracket p{font-size:1.125rem}.bracket-container{overflow-x:auto;overflow-y:hidden;padding:2rem 1rem;display:flex;justify-content:center;align-items:center}.bracket-tree{display:flex;gap:2rem;justify-content:center;align-items:center;width:100%;max-width:1400px;margin:0 auto;transform:scale(.9);transform-origin:center}.bracket-side{display:flex;gap:2rem;align-items:center;flex:1}.left-bracket{flex-direction:row;justify-content:flex-end}.right-bracket{flex-direction:row-reverse;justify-content:flex-end}.bracket-round{display:flex;flex-direction:column;justify-content:center;position:relative;flex:0 0 auto}.round-title{font-size:.85rem;font-weight:600;color:gold;margin-bottom:1rem;text-align:center;white-space:nowrap}.matches{display:flex;flex-direction:column;justify-content:center;position:relative}.match-wrapper{position:relative;margin:.5rem 0}.left-bracket .bracket-round:first-child .matches{gap:.75rem}.left-bracket .bracket-round:nth-child(2) .matches{gap:3.5rem}.right-bracket .bracket-round:nth-child(2) .matches{gap:3.5rem}.right-bracket .bracket-round:first-child .matches{gap:.75rem}.left-bracket .match-wrapper:after{content:"";position:absolute;top:50%;right:-2rem;width:2rem;height:2px;background:#cbd5e0;z-index:0}.left-bracket .bracket-round:first-child .match-wrapper:nth-child(1):before,.left-bracket .bracket-round:first-child .match-wrapper:nth-child(2):before{content:"";position:absolute;right:-2rem;width:2px;background:#cbd5e0;z-index:0}.left-bracket .bracket-round:first-child .match-wrapper:nth-child(1):before{top:50%;height:calc(50% + 3.25rem)}.left-bracket .bracket-round:first-child .match-wrapper:nth-child(2):before{bottom:50%;height:calc(50% + 3.25rem)}.right-bracket .match-wrapper:after{content:"";position:absolute;top:50%;left:-2rem;width:2rem;height:2px;background:#cbd5e0;z-index:0}.right-bracket .bracket-round:first-child .match-wrapper:nth-child(1):before,.right-bracket .bracket-round:first-child .match-wrapper:nth-child(2):before{content:"";position:absolute;left:-2rem;width:2px;background:#cbd5e0;z-index:0}.right-bracket .bracket-round:first-child .match-wrapper:nth-child(1):before{top:50%;height:calc(50% + 3.25rem)}.right-bracket .bracket-round:first-child .match-wrapper:nth-child(2):before{bottom:50%;height:calc(50% + 3.25rem)}.left-bracket .bracket-round:last-child .match-wrapper:after,.right-bracket .bracket-round:last-child .match-wrapper:after{display:none}.left-bracket .bracket-round:last-child .match-wrapper:after{display:block;right:-2rem}.right-bracket .bracket-round:last-child .match-wrapper:after{display:block;left:-2rem}.match{background:#1a1a1a;border-radius:6px;overflow:hidden;border:2px solid #333;box-shadow:0 2px 8px #0000004d;min-width:180px;position:relative;transition:all .2s ease;z-index:1}.match:hover{border-color:#b8860b;box-shadow:0 4px 12px #b8860b66;transform:scale(1.02)}.match-player{display:flex;justify-content:space-between;align-items:center;padding:.75rem .875rem;background:#1a1a1a;transition:all .2s ease;position:relative;color:#d4d4d4}.match-player:first-child{border-bottom:2px solid #333}.match-player.winner{background:linear-gradient(90deg,#b8860b33,#1a1a1a);font-weight:600;color:gold}.match-player.winner:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#b8860b}.player-name{flex:1;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-score{font-weight:700;font-size:1rem;min-width:28px;text-align:center;color:#333}.match-player.winner .player-score{color:gold}.champion-slot{background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;padding:2rem 1.5rem;border-radius:12px;text-align:center;min-width:160px;max-width:160px;box-shadow:0 8px 24px #b8860b99;flex-shrink:0;position:relative;z-index:2}.champion-slot h3{font-size:1.1rem;margin-bottom:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:1px}.champion-slot .champion-name{font-size:1.3rem;font-weight:700}.bracket-list{padding:1rem}.list-round{margin-bottom:3rem;background:#f9f9f9;padding:1.5rem;border-radius:12px}.list-round:last-child{margin-bottom:0}.list-round .round-title{font-size:1.25rem;margin-bottom:.5rem;text-align:left;color:#667eea}.round-subtitle{font-size:.875rem;color:#666;margin-bottom:1.5rem;font-style:italic}.groups-container{display:flex;gap:2rem;justify-content:space-between}.group-section{flex:1;background:#fff;padding:1.5rem;border-radius:8px;border:2px solid #e0e0e0}.group-title{font-size:1.125rem;font-weight:700;color:#667eea;margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:2px solid #667eea;text-align:center}.matches-column{display:flex;flex-direction:column;gap:1.25rem}.matches-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}@media (max-width: 992px){.groups-container{flex-direction:column}}.match-label{background:#667eea;color:#fff;padding:.5rem;text-align:center;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.player-stats{display:flex;align-items:center;gap:.75rem}.player-lives{display:flex;gap:.25rem;font-size:.875rem}.life-indicator{transition:all .2s ease}.life-indicator.active{color:#e74c3c;filter:drop-shadow(0 0 2px rgba(231,76,60,.5))}.life-indicator.lost{color:#ddd;opacity:.3}.match-player.eliminated{background:linear-gradient(90deg,#e74c3c1a,#fff);opacity:.7}.match-player.eliminated:before{background:#e74c3c}.match-player.eliminated .player-name{text-decoration:line-through;color:#999}.match-player.qualified{background:linear-gradient(90deg,#2ecc7126,#fff)}.match-player.qualified:before{background:#2ecc71}.match-player.qualified .player-score{color:#2ecc71;font-weight:700}.match-player.direct-qual{background:linear-gradient(90deg,#3498db33,#fff);border-left:4px solid #3498db}.match-player.direct-qual:before{background:#3498db;width:6px}.match-player.direct-qual .player-score{color:#3498db;font-weight:700;position:relative}.match-player.direct-qual .player-score:after{content:"★";margin-left:.25rem;color:#f39c12}.qualified-match{border-color:#2ecc71;box-shadow:0 2px 8px #2ecc7133}@media (max-width: 1200px){.bracket-tree{transform:scale(.8)}}@media (max-width: 992px){.bracket-tree{transform:scale(.7)}}@media (max-width: 768px){.bracket-tree{transform:scale(.6);gap:1.5rem}.bracket-side{gap:1.5rem}.champion-slot{min-width:140px;max-width:140px;padding:1.5rem 1rem}.champion-slot h3{font-size:.95rem}.champion-slot .champion-name{font-size:1.1rem}.match{min-width:160px}}@media (max-width: 576px){.bracket-tree{transform:scale(.5)}.bracket-container{padding:1rem .5rem}}.participants-section{background:linear-gradient(135deg,#1a1a1a,#141414);padding:2rem;border-radius:12px;box-shadow:0 2px 10px #00000080;border:1px solid #333}.participants-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}.participant-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:#f9f9f9;border-radius:8px;border:2px solid #e0e0e0;transition:all .2s ease}.participant-card:hover{border-color:#667eea;transform:translate(4px);box-shadow:0 2px 8px #667eea33}.participant-rank{width:40px;height:40px;background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;flex-shrink:0}.participant-info{flex:1}.participant-name{font-weight:600;color:gold;font-size:1rem;display:block;margin-bottom:.25rem}.participant-meta{font-size:.875rem;color:#999}.participant-status{padding:.375rem .875rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase}.participant-status.confirmed{background:#2ecc7133;color:#2ecc71;border:1px solid #2ecc71}.participant-status.pending{background:#f1c40f33;color:#f1c40f;border:1px solid #f1c40f}@media (max-width: 768px){.header-content{flex-direction:column;align-items:flex-start}.header-info h1{font-size:2rem}.tournament-meta{flex-direction:column;gap:.5rem}.register-btn{width:100%}.tournament-content{padding:2rem 1rem}.section-title{font-size:1.5rem}.bracket-container{gap:2rem}.bracket-round{min-width:200px}.participants-list{grid-template-columns:1fr}}.gallery-section{margin-bottom:4rem}.gallery-slider{position:relative;max-width:900px;margin:0 auto;overflow:hidden;border-radius:16px;background:#1a1a1a;border:2px solid #333}.slider-container{overflow:hidden;border-radius:14px}.slider-track{display:flex;transition:transform .5s ease-in-out}.slide{min-width:100%;position:relative;cursor:pointer;aspect-ratio:16/9}.slide img{width:100%;height:100%;object-fit:cover;display:block}.slide-caption{position:absolute;bottom:0;left:0;right:0;padding:1.5rem;background:linear-gradient(transparent,#000c);color:#fff;font-size:1.1rem;text-align:center}.slider-btn{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;background:#b8860be6;border:none;border-radius:50%;color:#fff;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.slider-btn:hover{background:#b8860b;transform:translateY(-50%) scale(1.1)}.slider-btn svg{width:24px;height:24px}.slider-btn.prev{left:1rem}.slider-btn.next{right:1rem}.slider-dots{display:flex;justify-content:center;gap:.5rem;padding:1rem;background:#1a1a1a}.dot{width:12px;height:12px;border-radius:50%;border:2px solid #b8860b;background:transparent;cursor:pointer;transition:all .3s ease}.dot:hover{background:#b8860b80}.dot.active{background:#b8860b;transform:scale(1.2)}.lightbox{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;z-index:1000;display:flex;align-items:center;justify-content:center;padding:2rem;cursor:pointer}.lightbox img{max-width:90%;max-height:85vh;object-fit:contain;border-radius:8px}.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;width:50px;height:50px;background:#ffffff1a;border:2px solid #b8860b;border-radius:50%;color:#fff;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .3s ease}.lightbox-close:hover{background:#b8860b}.lightbox-caption{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);color:#fff;font-size:1.1rem;text-align:center;padding:1rem 2rem;background:#000000b3;border-radius:8px;max-width:80%}@media (max-width: 768px){.slider-btn{width:40px;height:40px}.slider-btn svg{width:20px;height:20px}.slider-btn.prev{left:.5rem}.slider-btn.next{right:.5rem}.slide-caption{font-size:.9rem;padding:1rem}}.tournament-results{margin:.75rem 0;padding:.75rem;background:#0000004d;border-radius:8px;border:1px solid #333}.result-row{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;border-bottom:1px solid rgba(255,255,255,.1);font-size:.9rem}.result-row:last-child{border-bottom:none}.result-rank{min-width:40px;padding:.2rem .4rem;border-radius:4px;font-weight:700;font-size:.75rem;text-align:center}.result-row.rank-1 .result-rank{background:linear-gradient(135deg,gold,#ffb800);color:#7a5800}.result-row.rank-2 .result-rank{background:linear-gradient(135deg,silver,#a8a8a8);color:#555}.result-row.rank-3 .result-rank{background:linear-gradient(135deg,#cd7f32,#b8702e);color:#fff}.result-row:not(.rank-1):not(.rank-2):not(.rank-3) .result-rank{background:#444;color:#ccc}.result-player{flex:1;color:#fff;font-weight:500;font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-row.rank-1 .result-player{color:gold}.result-prize{color:#b8860b;font-weight:600;font-size:.8rem;white-space:nowrap}.media-toggle-btn{display:flex;align-items:center;gap:.5rem;width:100%;padding:.75rem 1.25rem;margin-top:.75rem;background:#b8860b1a;border:1px solid rgba(184,134,11,.3);border-radius:6px;color:#b8860b;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s ease}.media-toggle-btn:hover{background:#b8860b33;border-color:#b8860b}.media-toggle-btn.active{background:#b8860b33;border-color:gold}.media-toggle-btn svg{width:18px;height:18px}.media-toggle-btn span{flex:1;text-align:left}.media-toggle-btn .chevron{width:16px;height:16px;transition:transform .2s ease}.media-toggle-btn .chevron.open{transform:rotate(180deg)}.tournament-media-section{margin-top:1rem;padding:1rem;background:#0000004d;border-radius:8px;border:1px solid #333;max-height:220px;overflow-y:auto}.tournament-media-section::-webkit-scrollbar{width:6px}.tournament-media-section::-webkit-scrollbar-track{background:#0003;border-radius:3px}.tournament-media-section::-webkit-scrollbar-thumb{background:gold;border-radius:3px}.tournament-media-section::-webkit-scrollbar-thumb:hover{background:#e6c200}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem}.media-thumbnail{aspect-ratio:1;border-radius:6px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:all .2s ease}.media-thumbnail:hover{border-color:gold;transform:scale(1.05)}.media-thumbnail img{width:100%;height:100%;object-fit:cover}.media-thumbnail.video{position:relative}.media-thumbnail .video-play-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;background:#ff0000d9;border-radius:50%;display:flex;align-items:center;justify-content:center;pointer-events:none;transition:all .3s ease}.media-thumbnail .video-play-icon svg{width:24px;height:24px;color:#fff;margin-left:3px}.media-thumbnail.video:hover .video-play-icon{background:red;transform:translate(-50%,-50%) scale(1.1)}.no-media{text-align:center;color:#666;font-style:italic;padding:1rem;font-size:.85rem}.media-lightbox{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;z-index:1000;display:flex;align-items:center;justify-content:center;cursor:pointer}.media-lightbox .lightbox-close{position:absolute;top:1.5rem;right:1.5rem;width:50px;height:50px;border-radius:50%;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);color:#fff;font-size:1.25rem;cursor:pointer;transition:all .3s ease;z-index:1001}.media-lightbox .lightbox-close:hover{background:#b8860b}.lightbox-content{max-width:90vw;max-height:85vh;cursor:default}@media (max-width: 768px){.media-grid{grid-template-columns:repeat(3,1fr)}.lightbox-content iframe{width:95vw;height:53vw}}.bracket-page{min-height:100vh;background:#0a0a0a;color:#e0e0e0}.bracket-header{background:linear-gradient(135deg,#1a1a1a,#0a0a0a);color:#fff;padding:3rem 2rem;border-bottom:2px solid #b8860b;text-align:center}.bracket-header h1{font-size:2.5rem;font-weight:800;margin-bottom:.5rem;background:linear-gradient(135deg,#b8860b,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.bracket-header p{font-size:1.1rem;color:#d4d4d4}.loading-container{display:flex;justify-content:center;align-items:center;min-height:400px;font-size:1.2rem;color:#999}.bracket-content{max-width:1400px;margin:0 auto;padding:2rem}.stage-tabs{display:flex;gap:1rem;margin-bottom:0;border-bottom:2px solid #333;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.stage-tabs::-webkit-scrollbar{display:none}.stage-tab{padding:1rem 2rem;background:none;border:none;color:#999;font-size:1rem;font-weight:700;cursor:pointer;position:relative;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px;white-space:nowrap}.stage-tab:hover,.stage-tab.active{color:gold}.stage-tab.active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:linear-gradient(90deg,#b8860b,gold)}.stage-content{background:linear-gradient(135deg,#1a1a1a,#141414);padding:2rem;border-radius:12px;border:1px solid #333;min-height:500px}.stage-content .selection-round-tabs{display:flex;gap:.5rem;margin-bottom:2rem;padding:1rem;background:#0000004d;border-radius:12px;justify-content:center}.stage-content .round-tab{padding:.75rem 1.5rem;background:#ffffff0d;border:2px solid rgba(255,215,0,.3);color:#d4d4d4;font-weight:600;font-size:.95rem;cursor:pointer;border-radius:8px;transition:all .3s ease}.stage-content .round-tab:hover:not(:disabled){background:#ffd7001a;border-color:gold;color:gold;transform:translateY(-2px)}.stage-content .round-tab.active{background:linear-gradient(135deg,gold,#ffed4e);border-color:gold;color:#1a1a1a;box-shadow:0 4px 12px #ffd7004d}.stage-content .round-tab:disabled{opacity:.3;cursor:not-allowed;border-color:#ffffff1a}.selection-container{display:grid;grid-template-columns:1fr 1fr;gap:3rem}.group-column{display:flex;flex-direction:column;gap:1.5rem}.group-title{font-size:1.5rem;color:gold;font-weight:700;text-align:center;padding:1rem;background:#0a0a0a;border:2px solid #b8860b;border-radius:8px}.matches-list{display:flex;flex-direction:column;gap:1.5rem}.match-card{background:#0a0a0a;border:2px solid #333;border-radius:10px;padding:1.5rem;display:flex;flex-direction:column;gap:1rem;transition:all .3s ease;position:relative}.match-card:hover{border-color:#b8860b;box-shadow:0 4px 16px #b8860b4d;transform:translateY(-2px)}.match-player{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#1a1a1a;border:1px solid #333;border-radius:6px}.player-info{display:flex;flex-direction:column;gap:.25rem;flex:1}.player-name{color:#d4d4d4;font-weight:600;font-size:1.1rem}.player-game-id{color:#888;font-size:.8rem;font-weight:500}.player-score{font-weight:700;color:gold;font-size:1.1rem;min-width:30px;text-align:right;margin-left:1rem}.match-status{text-align:center;padding:.5rem;background:#4caf5033;color:#4caf50;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;border-top:1px solid rgba(255,255,255,.1)}.match-card.completed{border-color:#4caf50;background:#4caf500d}.match-card.pending{border-color:#ff9800;background:#ff98000d}.player-lives{color:#f44;font-weight:700;font-size:1rem}.bracket-container{overflow-x:auto;padding:2rem 0}.main-bracket-container{display:flex;gap:2rem;align-items:stretch;justify-content:center;overflow-x:auto;padding:2rem;min-height:500px}.bracket-side{display:flex;flex-direction:column;gap:1rem;flex:1;max-width:450px}.bracket-side.left-side .bracket-wrapper{flex-direction:row}.bracket-side.right-side .bracket-wrapper{flex-direction:row-reverse}.group-bracket-title{text-align:center;color:gold;font-weight:700;font-size:1.5rem;margin-bottom:1rem;text-transform:uppercase;letter-spacing:2px}.bracket-wrapper{display:flex;gap:2rem;min-width:max-content;justify-content:flex-start;align-items:center;height:100%}.bracket-center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;min-width:220px;padding:1rem}.finals-match{display:flex;flex-direction:column;align-items:center;gap:.5rem}.finals-label{color:gold;font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}.finals-match.championship .bracket-match{border-color:gold;box-shadow:0 0 20px #ffd7004d}.finals-match.third-place .bracket-match{border-color:#cd7f32}.champion-slot{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1.5rem;background:linear-gradient(135deg,#b8860b33,#ffd7001a);border:2px solid #ffd700;border-radius:12px;min-width:180px}.champion-label{color:gold;font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:2px}.champion-name{background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;padding:1rem 2rem;border-radius:8px;font-weight:700;font-size:1.1rem;text-align:center;min-width:120px}.bracket-round{display:flex;flex-direction:column;gap:1rem;min-width:200px;justify-content:center}.round-label{text-align:center;color:gold;font-weight:700;font-size:1.1rem;margin-bottom:1rem;text-transform:uppercase;letter-spacing:1px}.round-matches{display:flex;flex-direction:column;gap:1.5rem;justify-content:center;flex:1}.bracket-match{background:#0a0a0a;border:2px solid #333;border-radius:8px;overflow:hidden;min-width:180px;transition:all .3s ease}.bracket-match:hover{border-color:#b8860b;box-shadow:0 4px 12px #b8860b4d}.bracket-match.completed{border-color:#4caf50}.bracket-match.pending{border-color:#ff9800}.bracket-player{padding:.75rem 1rem;color:#999;font-weight:600;border-bottom:1px solid #333;transition:all .3s ease;display:flex;justify-content:space-between;align-items:center}.bracket-player-info{display:flex;flex-direction:column;gap:.15rem;flex:1;overflow:hidden}.bracket-player-info span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bracket-game-id{color:#888;font-size:.7rem;font-weight:500}.bracket-player span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bracket-player strong{color:gold;margin-left:.5rem;min-width:24px;text-align:right}.bracket-player:last-child{border-bottom:none}.bracket-player.has-player{color:#d4d4d4;background:#1a1a1a}.bracket-player.has-player:hover{background:#222;color:gold}.empty-bracket{display:flex;justify-content:center;align-items:center;min-height:300px;color:#999;font-size:1.2rem}.participants-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem}.participant-card{background:#0a0a0a;border:2px solid #333;border-radius:8px;padding:1.5rem;transition:all .3s ease;display:flex;align-items:center}.participant-card:hover{border-color:#b8860b;box-shadow:0 4px 12px #b8860b4d;transform:translateY(-2px)}.participant-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;width:100%}.participant-info-block{display:flex;flex-direction:column;gap:.25rem;flex:1;overflow:hidden}.participant-name{font-size:1.2rem;font-weight:700;color:#d4d4d4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.participant-game-id{color:#888;font-size:.85rem;font-weight:500}.participant-badges{display:flex;flex-direction:column;gap:.5rem;align-items:flex-end;flex-shrink:0;min-width:80px}.participant-status{padding:.4rem .8rem;border-radius:12px;font-size:.85rem;font-weight:600;text-transform:capitalize}.participant-status[data-status=active]{background:#4caf5033;color:#4caf50;border:1px solid #4caf50}.participant-status[data-status=eliminated]{background:#f4433633;color:#f44336;border:1px solid #f44336}.participant-status[data-status=qualified]{background:#b8860b33;color:gold;border:1px solid #b8860b}.participant-lives{color:#f44;font-weight:700;font-size:1rem}.empty-participants{display:flex;justify-content:center;align-items:center;min-height:300px;color:#999;font-size:1.2rem;text-align:center}@media (max-width: 1024px){.selection-container{grid-template-columns:1fr}.bracket-wrapper{gap:2rem}.bracket-round{min-width:180px}}@media (max-width: 768px){.bracket-content{padding:1rem}.stage-tabs{gap:.5rem}.stage-tab{padding:.75rem 1rem;font-size:.9rem}.participants-grid{grid-template-columns:1fr}.match-card{padding:1rem}.bracket-round{min-width:160px}}.tactical-map-container{background:#0a0a0a;border-radius:16px;padding:1.5rem;margin-top:1rem;position:relative}.tactical-map-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #b8860b}.tactical-map-header h2{color:gold;font-size:1.5rem;font-weight:700;margin:0;letter-spacing:1px}.mode-toggle{display:flex;gap:.5rem;background:#1a1a1a;padding:.25rem;border-radius:8px;border:1px solid #333}.mode-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:transparent;border:none;border-radius:6px;color:#888;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease}.mode-btn svg{width:18px;height:18px}.mode-btn:hover{color:#fff;background:#ffffff0d}.mode-btn.active{background:linear-gradient(135deg,#b8860b,#8b6914);color:#fff}.mode-btn:disabled{cursor:not-allowed;opacity:.6}.view-only-badge{display:flex;align-items:center;padding:.6rem 1rem;background:#ff6b6b33;border:1px solid rgba(255,107,107,.3);border-radius:6px;color:#ff6b6b;font-size:.85rem;font-weight:600}.viewer-notice{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffa5021a;border:1px solid rgba(255,165,2,.3);border-radius:8px;color:#ffa502;font-size:.85rem}.viewer-notice svg{width:16px;height:16px;flex-shrink:0}.tactical-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;padding:1rem;background:linear-gradient(145deg,#1a1a2e,#16213e);border-radius:12px;margin-bottom:1rem;border:1px solid rgba(255,215,0,.2)}.tactical-toolbar.disabled{opacity:.6;pointer-events:none}.tool-group{display:flex;flex-direction:column;gap:.5rem}.tool-group-label{font-size:.7rem;color:#888;text-transform:uppercase;letter-spacing:1px}.tool-buttons{display:flex;gap:.25rem}.tool-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#0a0a0a;border:2px solid #333;border-radius:8px;color:#888;cursor:pointer;transition:all .2s ease}.tool-btn svg{width:20px;height:20px}.tool-btn:hover:not(:disabled){border-color:gold;color:gold;transform:translateY(-2px)}.tool-btn.active{background:linear-gradient(135deg,#b8860b,#8b6914);border-color:gold;color:#fff}.tool-btn:disabled{opacity:.4;cursor:not-allowed}.color-palette{display:flex;gap:.25rem}.color-btn{width:28px;height:28px;border:2px solid transparent;border-radius:50%;cursor:pointer;transition:all .2s ease}.color-btn:hover:not(:disabled){transform:scale(1.15)}.color-btn.active{border-color:#fff;box-shadow:0 0 8px #ffffff80}.color-btn:disabled{opacity:.4;cursor:not-allowed}.brush-slider{width:120px;height:8px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#333;border-radius:4px;outline:none;cursor:pointer;margin:0;padding:0}.brush-slider::-webkit-slider-runnable-track{width:100%;height:8px;background:#333;border-radius:4px}.brush-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;background:linear-gradient(135deg,gold,#b8860b);border-radius:50%;cursor:grab;margin-top:-6px;border:2px solid #fff;box-shadow:0 2px 6px #0000004d}.brush-slider::-webkit-slider-thumb:hover{transform:scale(1.15);cursor:grab}.brush-slider::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.1)}.brush-slider::-moz-range-track{width:100%;height:8px;background:#333;border-radius:4px}.brush-slider::-moz-range-thumb{width:20px;height:20px;background:linear-gradient(135deg,gold,#b8860b);border-radius:50%;border:2px solid #fff;cursor:grab;box-shadow:0 2px 6px #0000004d}.brush-slider::-moz-range-thumb:active{cursor:grabbing}.brush-slider:disabled{opacity:.4;cursor:not-allowed}.brush-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.brush-slider:disabled::-moz-range-thumb{cursor:not-allowed}.tool-btn.icon-panel-toggle{position:relative;padding-right:20px}.tool-btn.icon-panel-toggle .panel-indicator{position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:8px;opacity:.7}.tool-btn.icon-panel-toggle.panel-open{background:linear-gradient(135deg,#5352ed,#3742fa);border-color:#5352ed}.tool-btn.player-panel-toggle{position:relative;padding-right:20px;background:linear-gradient(135deg,#666,#555);border-color:#666}.tool-btn.player-panel-toggle .panel-indicator{position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:8px;opacity:.7}.tool-btn.player-panel-toggle.panel-open{background:linear-gradient(135deg,#888,#777);border-color:#888;box-shadow:0 0 10px #88888880}.icon-panel{display:flex;gap:.75rem;padding:.75rem;background:#1e1e32f2;border-radius:10px;border:2px solid #5352ed;box-shadow:0 4px 20px #5352ed4d;animation:slideDown .2s ease-out}.icon-type-group{background:#6464ff1a;padding:.5rem .75rem;border-radius:8px;border:1px solid rgba(100,100,255,.3)}.icon-type-buttons{display:flex;gap:.25rem;margin-top:.25rem}.icon-type-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#2a2a2a;border:2px solid #444;border-radius:6px;color:#aaa;cursor:pointer;transition:all .2s ease;padding:4px}.icon-type-btn svg{width:18px;height:18px}.icon-type-btn .icon-btn-img{width:22px;height:22px;object-fit:contain;filter:grayscale(100%) brightness(.7);transition:filter .2s ease}.icon-type-btn:hover:not(:disabled) .icon-btn-img,.icon-type-btn.active .icon-btn-img{filter:grayscale(0%) brightness(1)}.icon-type-btn:hover:not(:disabled){background:#3a3a3a;border-color:#666;color:#fff}.icon-type-btn.active{background:linear-gradient(135deg,#5352ed,#3742fa);border-color:#5352ed;color:#fff;box-shadow:0 0 8px #5352ed66}.icon-type-btn:disabled{opacity:.4;cursor:not-allowed}.icon-size-group{background:#ffd7001a;padding:.5rem .75rem;border-radius:8px;border:1px solid rgba(255,215,0,.3)}.brush-slider.icon-slider{width:140px}.brush-slider.icon-slider::-webkit-slider-thumb{background:linear-gradient(135deg,#51cf66,#40c057);border-color:#fff}.brush-slider.icon-slider::-moz-range-thumb{background:linear-gradient(135deg,#51cf66,#40c057)}.map-area-container{display:flex;gap:1rem;align-items:flex-start;padding-bottom:1rem}.player-panel{width:220px;min-width:220px;max-height:600px;background:#1e1e28fa;border:1px solid rgba(255,255,255,.15);border-radius:12px;box-shadow:0 8px 32px #0006;display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}.player-panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#5352ed4d;border-bottom:1px solid rgba(255,255,255,.1);font-weight:600;font-size:14px;color:#fff}.close-panel-btn{background:#ffffff1a;border:none;color:#fff;width:24px;height:24px;border-radius:4px;cursor:pointer;font-weight:700;transition:background .2s}.close-panel-btn:hover{background:#ff464680}.player-panel-list{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:4px}.player-panel-list::-webkit-scrollbar{width:6px}.player-panel-list::-webkit-scrollbar-track{background:#ffffff0d}.player-panel-list::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.no-players{color:#ffffff80;text-align:center;padding:20px;font-size:13px}.team-group{margin-bottom:12px}.team-group:last-child{margin-bottom:0}.team-group-header{font-size:11px;font-weight:700;text-transform:uppercase;color:gold;padding:6px 8px;background:#ffd70026;border-radius:6px;margin-bottom:6px;letter-spacing:.5px;border-left:3px solid #ffd700}.team-group.unassigned .team-group-header{color:#ffffff80;background:#ffffff0d;border-left-color:#ffffff4d}.player-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;cursor:pointer;transition:all .2s;font-size:13px;text-align:left}.player-item:hover{background:#5352ed33;border-color:#5352ed80}.player-item.selected{background:#5352ed66;border-color:#5352ed;box-shadow:0 0 8px #5352ed4d}.player-item[draggable=true]{cursor:grab}.player-item[draggable=true]:active{cursor:grabbing;opacity:.7}.player-role-icon{font-size:14px;margin-right:8px;width:20px;text-align:center}.player-item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-indicator{color:#2ecc71;font-weight:700;font-size:14px}.player-item.role-tank{border-left:3px solid #3498db}.player-item.role-healer{border-left:3px solid #2ecc71}.player-item.role-damage{border-left:3px solid #e74c3c}.player-item.role-support{border-left:3px solid #9b59b6}.selected-player-info{padding:12px 16px;background:#2ecc7126;border-top:1px solid rgba(46,204,113,.3);font-size:13px;color:#fff}.selected-player-info strong{color:#2ecc71}.selected-player-info small{color:#fff9}.icon-type-btn.player-btn svg{fill:currentColor}.tool-group.actions{flex-direction:row;gap:.25rem;margin-left:auto}.action-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#0a0a0a;border:2px solid #333;border-radius:8px;color:#888;cursor:pointer;transition:all .2s ease}.action-btn svg{width:18px;height:18px}.action-btn:hover:not(:disabled){border-color:#4dabf7;color:#4dabf7}.action-btn.danger:hover:not(:disabled){border-color:#ff4757;color:#ff4757}.action-btn.export{background:linear-gradient(135deg,#20c997,#12b886);border-color:#12b886;color:#fff}.action-btn.export:hover:not(:disabled){background:linear-gradient(135deg,#38d9a9,#20c997);border-color:#20c997;color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #20c99766}.action-btn:disabled{opacity:.4;cursor:not-allowed}.tool-group.save-actions{flex-direction:row;gap:.5rem}.action-btn.save,.action-btn.load{width:auto;padding:0 1rem;gap:.5rem;font-size:.85rem;font-weight:600}.action-btn.save{background:linear-gradient(135deg,#28a745,#20c997);border-color:#28a745;color:#fff}.action-btn.save:hover:not(:disabled){background:linear-gradient(135deg,#20c997,#17a2b8);border-color:#20c997;color:#fff}.action-btn.load{background:linear-gradient(135deg,#4dabf7,#339af0);border-color:#4dabf7;color:#fff}.action-btn.load:hover:not(:disabled){background:linear-gradient(135deg,#339af0,#228be6);border-color:#339af0;color:#fff}.zoom-controls{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.75rem 1rem;background:#1a1a1a;border-radius:12px;margin-bottom:1rem;border:1px solid #333}.zoom-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#2a2a2a;border:1px solid #444;border-radius:8px;color:#ccc;cursor:pointer;transition:all .2s ease}.zoom-btn:hover{background:#3a3a3a;border-color:gold;color:gold}.zoom-btn svg{width:18px;height:18px}.zoom-btn.reset{background:#333}.zoom-btn.reset:hover{background:#ff6b6b;border-color:#ff6b6b;color:#fff}.zoom-level{min-width:50px;text-align:center;color:gold;font-weight:600;font-size:.9rem}.zoom-slider{width:120px;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,#333,gold);border-radius:3px;outline:none;cursor:pointer}.zoom-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:gold;border-radius:50%;cursor:grab;border:2px solid #fff;box-shadow:0 2px 4px #0000004d}.zoom-slider::-moz-range-thumb{width:16px;height:16px;background:gold;border-radius:50%;cursor:grab;border:2px solid #fff;box-shadow:0 2px 4px #0000004d}.canvas-wrapper{position:relative;background:#0a0a0a;border-radius:12px;border:2px solid #333;display:inline-block}.canvas-zoom-container{position:relative;display:inline-block}.tactical-canvas{display:block;max-width:100%;cursor:crosshair;touch-action:none}.tactical-canvas.view-only{cursor:default}.tactical-canvas.eraser-mode{cursor:pointer}.tactical-canvas.move-mode{cursor:grab}.tactical-canvas.move-mode:active{cursor:grabbing}.text-input-overlay{position:absolute;display:flex;gap:.25rem;padding:.25rem;background:#000000e6;border:1px solid #ffd700;border-radius:6px;z-index:10}.text-input-overlay input{padding:.5rem;background:#1a1a1a;border:1px solid #333;border-radius:4px;color:inherit;font-size:.9rem;min-width:150px}.text-input-overlay input:focus{outline:none;border-color:gold}.text-input-overlay button{padding:.5rem .75rem;background:#333;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.8rem;transition:background .2s ease}.text-input-overlay button:first-of-type{background:linear-gradient(135deg,#28a745,#20c997)}.text-input-overlay button:last-of-type{background:#ff4757}.text-input-overlay button:hover{opacity:.8}.tactical-instructions{margin-top:1rem;padding:.75rem 1rem;background:#b8860b1a;border:1px solid rgba(184,134,11,.3);border-radius:8px;text-align:center}.tactical-instructions p{margin:0;color:#b8860b;font-size:.9rem}.tactical-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.tactical-modal{background:linear-gradient(145deg,#1a1a2e,#16213e);border:2px solid #ffd700;border-radius:16px;padding:2rem;width:100%;max-width:400px;box-shadow:0 20px 60px #ffd70033}.tactical-modal.large{max-width:700px}.tactical-modal h3{color:gold;font-size:1.25rem;margin:0 0 1.5rem;text-align:center}.modal-content{margin-bottom:1.5rem}.modal-content label{display:block;color:#d4d4d4;font-size:.9rem;margin-bottom:.5rem}.modal-content input{width:100%;padding:.75rem 1rem;background:#0a0a0a;border:2px solid #333;border-radius:8px;color:#fff;font-size:1rem}.modal-content input:focus{outline:none;border-color:gold}.modal-actions{display:flex;gap:1rem;justify-content:center}.modal-actions .btn-save{padding:.75rem 2rem;background:linear-gradient(135deg,#28a745,#20c997);border:none;border-radius:8px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.modal-actions .btn-save:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 15px #28a74566}.modal-actions .btn-save:disabled{opacity:.5;cursor:not-allowed}.modal-actions .btn-cancel{padding:.75rem 2rem;background:transparent;border:1px solid #555;border-radius:8px;color:#888;font-size:1rem;cursor:pointer;transition:all .2s ease}.modal-actions .btn-cancel:hover{border-color:#888;color:#fff}.maps-list .loading-text,.maps-list .empty-text{text-align:center;color:#888;padding:2rem}.maps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;max-height:400px;overflow-y:auto;padding-right:.5rem}.map-card{background:#0a0a0a;border:2px solid #333;border-radius:10px;overflow:hidden;cursor:pointer;transition:all .2s ease}.map-card:hover{border-color:gold;transform:translateY(-3px);box-shadow:0 8px 20px #ffd70026}.map-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-bottom:1px solid #333}.map-info{padding:.75rem;display:flex;flex-direction:column;gap:.25rem}.map-name{color:#fff;font-weight:600;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-date{color:#888;font-size:.75rem}.map-card{position:relative}.map-delete-btn{position:absolute;top:8px;right:8px;width:28px;height:28px;padding:4px;background:#dc3545e6;border:none;border-radius:6px;cursor:pointer;opacity:0;transition:opacity .2s ease,background .2s ease;display:flex;align-items:center;justify-content:center}.map-card:hover .map-delete-btn{opacity:1}.map-delete-btn:hover{background:#dc3545}.map-delete-btn svg{width:16px;height:16px;stroke:#fff}@media (max-width: 768px){.tactical-map-header{flex-direction:column;text-align:center}.tactical-toolbar{flex-direction:column;align-items:stretch}.tool-group{flex-direction:column;align-items:center}.tool-group.actions,.tool-group.save-actions{justify-content:center;margin-left:0;margin-top:.5rem}.tool-buttons,.color-palette{flex-wrap:wrap;justify-content:center}.canvas-wrapper{margin:0 -1rem;border-radius:0;border-left:none;border-right:none}.maps-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.tactical-map-container{padding:1rem}.tool-btn{width:36px;height:36px}.color-btn{width:24px;height:24px}.action-btn{width:36px;height:36px}.action-btn.save,.action-btn.load{padding:0 .75rem;font-size:.8rem}.maps-grid{grid-template-columns:1fr}}.guild-roster-page{flex:1;background:#0a0a0a;min-height:100vh}.roster-header{background:linear-gradient(135deg,#1a1a1a,#0a0a0a);color:#fff;padding:4rem 2rem;text-align:center;border-bottom:2px solid #b8860b;position:relative;overflow:hidden}.roster-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23b8860b' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");opacity:.5;pointer-events:none}.roster-header .header-content{position:relative;z-index:1}.roster-header h1{font-size:3rem;font-weight:800;margin-bottom:.5rem;background:linear-gradient(135deg,#b8860b,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;letter-spacing:3px}.roster-header p{font-size:1.2rem;color:#d4d4d4}.roster-content{max-width:1200px;margin:0 auto;padding:2rem}.roster-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-bottom:2rem}.stat-card{background:#1a1a1a;border:1px solid #333;border-radius:12px;padding:1.5rem;text-align:center;transition:all .3s ease}.stat-card:hover{border-color:#b8860b;transform:translateY(-2px)}.stat-number{display:block;font-size:2.5rem;font-weight:800;color:gold;line-height:1}.stat-label{display:block;margin-top:.5rem;color:#888;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}.register-section{margin-bottom:3rem}.btn-register-soldier{display:block;width:100%;max-width:400px;margin:0 auto;padding:1.25rem 2rem;background:linear-gradient(135deg,#b8860b,gold);color:#0a0a0a;border:none;border-radius:12px;font-size:1.2rem;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:2px;transition:all .3s ease;box-shadow:0 4px 15px #b8860b66}.btn-register-soldier:hover{transform:translateY(-3px);box-shadow:0 10px 30px #b8860b80}.register-form-container{background:#1a1a1a;border:2px solid #333;border-radius:16px;padding:2rem;max-width:700px;margin:0 auto;position:relative;z-index:1}.register-form-container h2{color:gold;margin:0 0 1.5rem;font-size:1.5rem;text-align:center}.register-form .form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:1rem}.register-form .form-group{margin-bottom:1rem;position:relative}.register-form .form-group input[type=text],.register-form .form-group input[type=number]{position:relative;z-index:1}.register-form label{display:block;margin-bottom:.5rem;color:#d4d4d4;font-size:.9rem;font-weight:500}.register-form input,.register-form textarea{width:100%;padding:.75rem 1rem;background:#1a1a1a!important;border:2px solid #444!important;border-radius:8px;color:#fff!important;font-size:1rem;transition:border-color .3s ease;box-sizing:border-box;display:block;position:relative;z-index:10}.register-form input:focus,.register-form textarea:focus{outline:none!important;border-color:#b8860b!important;background:#222!important}.register-form input::placeholder,.register-form textarea::placeholder{color:#666!important;opacity:1}.register-form input[type=text],.register-form input[type=number]{height:48px;line-height:48px;padding:0 1rem}.register-form input.error{border-color:#dc3545}.register-form input::placeholder,.register-form textarea::placeholder{color:#666}.error-msg{display:block;color:#dc3545;font-size:.85rem;margin-top:.25rem}.role-selector{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}.role-btn{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;background:#0a0a0a;border:2px solid #333;border-radius:10px;color:#888;cursor:pointer;transition:all .3s ease}.role-btn:hover{border-color:#b8860b80;color:#d4d4d4}.role-btn.active{background:#b8860b26;border-color:#b8860b;color:gold}.role-btn .role-icon{font-size:1.5rem}.day-availability-selector{display:flex;gap:1rem}.day-checkbox{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:#0a0a0a;border:2px solid #333;border-radius:10px;cursor:pointer;transition:all .3s ease;flex:1;justify-content:center}.day-checkbox:hover{border-color:#b8860b80}.day-checkbox.active{background:#b8860b26;border-color:#b8860b}.day-checkbox input[type=checkbox]{width:18px;height:18px;accent-color:#ffd700;cursor:pointer}.day-label{font-weight:600;color:#888;transition:color .3s ease}.day-checkbox.active .day-label{color:gold}.day-label.saturday,.day-label.sunday{color:inherit}.day-checkbox.active .day-label.saturday{color:#4dabf7}.day-checkbox.active .day-label.sunday{color:#ff6b6b}.form-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #333}.btn-cancel{padding:.75rem 1.5rem;background:transparent;border:2px solid #666;border-radius:8px;color:#888;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-cancel:hover{border-color:#888;color:#d4d4d4}.btn-submit{padding:.75rem 2rem;background:linear-gradient(135deg,#b8860b,gold);border:none;border-radius:8px;color:#0a0a0a;font-weight:700;cursor:pointer;transition:all .3s ease}.btn-submit:hover{transform:translateY(-2px);box-shadow:0 5px 15px #b8860b66}.btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}.otp-section{margin-bottom:1rem}.otp-flow{display:flex;flex-direction:column;gap:8px}.otp-phone-row{display:flex;gap:8px;align-items:center}.phone-country-select{width:90px!important;min-width:90px;max-width:90px;flex:0 0 90px!important;padding:.45rem .3rem;font-size:.75rem;font-weight:600;background:#0a0a1499;border:2px solid rgba(255,255,255,.15);border-radius:8px;color:#fff;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center;padding-right:18px}.phone-country-select:focus{outline:none;border-color:#a855f7}.phone-country-select:disabled{opacity:.5;cursor:not-allowed}.phone-country-select option{background:#1a1a2e;color:#fff}.otp-phone-row input[type=tel]{flex:1}.btn-send-otp,.btn-verify-otp,.btn-resend-otp{padding:.5rem 1rem;border:none;border-radius:8px;font-size:.85rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .2s}.btn-send-otp{background:linear-gradient(135deg,#a855f7,#7c3aed);color:#fff}.btn-send-otp:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #a855f766}.btn-send-otp:disabled{opacity:.5;cursor:not-allowed;transform:none}.otp-code-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.otp-input{width:140px;text-align:center;font-size:1.2rem;font-weight:700;letter-spacing:6px;padding:.5rem;background:#0a0a1499;border:2px solid rgba(168,85,247,.4);border-radius:8px;color:#fff}.otp-input:focus{border-color:#a855f7;outline:none;box-shadow:0 0 12px #a855f74d}.btn-verify-otp{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}.btn-verify-otp:hover:not(:disabled){box-shadow:0 4px 12px #22c55e66}.btn-verify-otp:disabled{opacity:.5;cursor:not-allowed}.btn-resend-otp{background:transparent;color:#a0a0b0;border:1px solid rgba(255,255,255,.15);font-size:.8rem}.btn-resend-otp:hover:not(:disabled){color:#fff;border-color:#ffffff4d}.btn-resend-otp:disabled{opacity:.4;cursor:not-allowed}.otp-verified-badge{display:inline-flex;align-items:center;gap:4px;padding:.4rem .8rem;background:#22c55e26;color:#22c55e;border:1px solid rgba(34,197,94,.3);border-radius:8px;font-size:.85rem;font-weight:600;white-space:nowrap}.otp-error{color:#ef4444;font-size:.8rem;margin-top:2px}.soldiers-section{margin-bottom:3rem}.soldiers-section h2{color:#fff;font-size:1.5rem;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:2px solid #b8860b}.soldiers-section.inactive h2{color:#666;border-bottom-color:#333}.empty-roster{text-align:center;padding:3rem;background:#1a1a1a;border:2px dashed #333;border-radius:12px;color:#666}.soldiers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.soldier-card{background:#1a1a1a;border:2px solid #333;border-radius:12px;padding:1.25rem;position:relative;transition:all .3s ease}.soldier-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px #0000004d;border-color:#b8860b}.soldier-card.role-damage{border-left:4px solid #4dabf7}.soldier-card.role-tank{border-left:4px solid #ff6b6b}.soldier-card.role-healer{border-left:4px solid #51cf66}.soldier-card.role-support{border-left:4px solid #ffd43b}.soldier-card.inactive{opacity:.5;border-color:#222}.soldier-role-badge{display:none}.soldier-role-badge .role-icon{font-size:1rem}.soldier-info{margin-bottom:1rem}.soldier-name{margin:0 0 .25rem;font-size:1.25rem;color:#fff;font-weight:700}.soldier-game-id{margin:0 0 .75rem;color:#b8860b;font-size:.9rem;font-family:monospace}.soldier-stats{display:flex;flex-wrap:wrap;gap:.5rem}.soldier-stat{padding:.25rem .6rem;background:#b8860b1a;border:1px solid rgba(184,134,11,.3);border-radius:4px;font-size:.8rem;color:#d4d4d4}.soldier-notes{margin:.75rem 0 0;padding:.75rem;background:#0a0a0a;border-radius:6px;font-size:.85rem;color:#888;font-style:italic}.soldier-joined{font-size:.75rem;color:#555;text-align:right}.loading-container{display:flex;align-items:center;justify-content:center;min-height:50vh;color:#888}.view-toggle{display:flex;justify-content:center;gap:.5rem;margin-bottom:2rem}.toggle-btn{padding:.75rem 1.5rem;background:#1a1a1a;border:2px solid #333;border-radius:8px;color:#888;font-weight:600;cursor:pointer;transition:all .3s ease}.toggle-btn:hover{border-color:#555;color:#fff}.toggle-btn.active{background:linear-gradient(135deg,#b8860b,#8b6914);border-color:gold;color:#fff}.toggle-btn.tactical{display:flex;align-items:center;justify-content:center}.toggle-btn.tactical:hover{border-color:#51cf66;color:#51cf66}.toggle-btn.tactical.active{background:linear-gradient(135deg,#51cf66,#40c057);border-color:#51cf66;color:#fff}.day-filter-buttons{display:flex;justify-content:center;gap:.75rem;margin-bottom:2rem}.day-filter-btn{padding:.75rem 1.5rem;background:#1a1a1a;border:2px solid #333;border-radius:8px;color:#888;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .3s ease}.day-filter-btn:hover{border-color:#555;color:#fff}.day-filter-btn.saturday:hover{border-color:#4dabf7;color:#4dabf7}.day-filter-btn.saturday.active{background:linear-gradient(135deg,#4dabf7,#339af0);border-color:#4dabf7;color:#fff}.day-filter-btn.sunday:hover{border-color:#ff6b6b;color:#ff6b6b}.day-filter-btn.sunday.active{background:linear-gradient(135deg,#ff6b6b,#fa5252);border-color:#ff6b6b;color:#fff}.tac-map-preview-section{margin-bottom:1.5rem;background:#111;border:2px solid #a855f7;border-radius:12px;overflow:hidden;min-height:100px}.tac-map-preview-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:#1a1a1a;border-bottom:1px solid #2a2a2a}.tac-map-preview-title{font-size:.95rem;font-weight:700;color:#ddd;letter-spacing:1px}.btn-pick-map{padding:.35rem .75rem;background:#a855f726;border:1px solid rgba(168,85,247,.4);border-radius:6px;color:#a855f7;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-pick-map:hover{background:#a855f740;border-color:#a855f7}.tac-map-preview-img-wrap{position:relative;cursor:pointer;max-height:250px;overflow:hidden;transition:max-height .4s ease}.tac-map-preview-img-wrap.expanded{max-height:none}.tac-map-preview-img{width:100%;display:block}.tac-map-no-preview{padding:2rem;text-align:center;color:#555;font-size:.85rem}.tac-map-expand-hint{position:absolute;bottom:0;left:0;right:0;text-align:center;padding:.5rem;background:linear-gradient(transparent,#000c);color:#888;font-size:.7rem;letter-spacing:1px}.tac-map-preview-img-wrap.expanded .tac-map-expand-hint{background:#0009}.tac-map-picker-modal{background:#1a1a24;border:1px solid #333;border-radius:16px;padding:1.5rem;max-width:500px;width:90%;max-height:70vh;overflow-y:auto}.tac-map-picker-modal h3{font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:1rem;text-align:center}.tac-map-picker-list{display:flex;flex-direction:column;gap:8px;margin-bottom:1rem}.tac-map-picker-empty{color:#666;text-align:center;padding:1rem}.tac-map-picker-item{display:flex;align-items:center;gap:12px;padding:.6rem .8rem;background:#ffffff08;border:2px solid transparent;border-radius:10px;cursor:pointer;transition:all .2s}.tac-map-picker-item:hover{background:#ffffff0f;border-color:#444}.tac-map-picker-item.active{border-color:#a855f7;background:#a855f71a}.tac-map-picker-thumb{width:80px;height:50px;object-fit:cover;border-radius:6px;border:1px solid #333}.tac-map-picker-name{font-size:.9rem;font-weight:600;color:#ccc}.day-teams-section{margin-bottom:3rem}.day-section-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;margin-bottom:1.5rem;border-radius:12px;background:linear-gradient(135deg,#1a1a2e,#16213e);border:2px solid #333}.day-section-header h2{margin:0;font-size:1.5rem;font-weight:700;letter-spacing:1px}.day-section-header.saturday{border-color:#4dabf7}.day-section-header.saturday h2{color:#4dabf7}.day-section-header.sunday{border-color:#ff6b6b}.day-section-header.sunday h2{color:#ff6b6b}.day-team-count{background:#ffffff1a;padding:.5rem 1rem;border-radius:20px;font-size:.9rem;color:#ccc}.teams-roster{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;align-items:start}@media (max-width: 1200px){.teams-roster{grid-template-columns:repeat(2,1fr)}}.team-roster-section{background:#1a1a1a;border-radius:16px;border:2px solid #333;overflow:hidden;display:flex;flex-direction:column;height:fit-content}.team-roster-header{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid #333}.team-rank-badge{display:none}.team-roster-header h2{flex:1;margin:0;font-size:1.5rem;font-weight:700}.team-role-stats{display:flex;gap:.5rem;flex-wrap:wrap}.role-stat{padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:600;background:#0a0a0a;border:1px solid #333}.role-stat.dps{color:#4dabf7;border-color:#4dabf744}.role-stat.tank{color:#ff6b6b;border-color:#ff6b6b44}.role-stat.healer{color:#51cf66;border-color:#51cf6644}.role-stat.support{color:#ffd43b;border-color:#ffd43b44}.team-member-count{color:#888;font-size:.9rem;background:#0a0a0a;padding:.35rem .75rem;border-radius:20px;margin-left:auto}.team-roster-description{padding:1rem 1.5rem;margin:0;color:#888;font-style:italic;background:#0000004d;border-bottom:1px solid #222}.team-roster-content{padding:1.25rem;max-height:500px;overflow-y:auto}.members-title{font-size:.75rem;text-transform:uppercase;letter-spacing:1px;color:#666;margin-bottom:.5rem}.members-showcase{margin-top:1rem}.members-list{list-style:none;padding:0;margin:0}.member-item,.leader-item{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.5rem .75rem;border-left:3px solid #333;cursor:pointer;transition:all .2s ease;border-bottom:1px solid #222}.member-item:hover,.leader-item:hover{background:#252525}.member-item.role-damage{border-left-color:#4dabf7}.member-item.role-tank{border-left-color:#ff6b6b}.member-item.role-healer{border-left-color:#51cf66}.member-item.role-support{border-left-color:#ffd43b}.leader-item{background:#ffd7000d;border-left:3px solid #ffd700;margin-bottom:.5rem}.leader-item.role-damage,.leader-item.role-tank,.leader-item.role-healer,.leader-item.role-support{border-left-color:gold}.leader-badge,.guild-role-badge{background:linear-gradient(135deg,gold,#b8860b);color:#000;font-size:.65rem;font-weight:800;padding:.2rem .4rem;border-radius:3px;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 4px #0000004d}.member-name{font-weight:600;color:#fff;font-size:.9rem}.member-id{color:#888;font-size:.8rem;font-family:monospace}.member-details{width:100%;display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.4rem;padding-top:.4rem;border-top:1px solid #333}.detail-tag{padding:.15rem .4rem;background:#b8860b26;border:1px solid rgba(184,134,11,.3);border-radius:3px;font-size:.75rem;color:#d4d4d4}.detail-notes{width:100%;font-size:.75rem;color:#888;font-style:italic}.empty-team{text-align:center;padding:2rem;color:#555}.soldiers-section.unassigned{margin-top:2rem;background:#1a1a1a;border-radius:12px;padding:1.5rem;border:1px dashed #444}.soldiers-section.unassigned h2{color:#888}.leader-crown{position:absolute;top:.5rem;right:.5rem;background:linear-gradient(135deg,gold,#b8860b);color:#000;font-size:.65rem;font-weight:800;padding:.25rem .5rem;border-radius:4px;letter-spacing:1px;text-transform:uppercase}.soldier-team{margin:.25rem 0 .5rem;font-size:.85rem;font-weight:600}@media (max-width: 768px){.roster-header h1{font-size:2rem}.roster-stats{grid-template-columns:repeat(2,1fr)}.roster-stats .stat-card:nth-child(5){grid-column:span 2}.role-selector{grid-template-columns:repeat(2,1fr)}.soldiers-grid,.soldiers-grid.compact{grid-template-columns:1fr}.form-actions{flex-direction:column}.btn-cancel,.btn-submit{width:100%}.view-toggle{flex-direction:column}.toggle-btn{width:100%}.teams-roster{grid-template-columns:1fr}.team-roster-header{flex-wrap:wrap;gap:.5rem}.team-roster-header h2{width:100%;order:2;margin-top:.5rem}.team-role-stats{order:3;width:100%}.team-member-count{order:1;margin-left:0}.battles-grid{grid-template-columns:1fr}}.battles-section{padding:1rem 0}.battles-section h2{color:gold;margin-bottom:1.5rem;font-size:1.5rem}.battles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.battle-card{background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:12px;padding:1.5rem;border:2px solid #333;cursor:pointer;transition:all .3s ease}.battle-card:hover{border-color:gold;transform:translateY(-4px);box-shadow:0 8px 20px #ffd70026}.battle-card.victory{border-color:#28a74580}.battle-card.defeat{border-color:#dc354580}.battle-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.75rem;gap:.75rem}.battle-card-header h3{color:gold;font-size:1.15rem;margin:0;flex:1}.battle-result{padding:.3rem .8rem;border-radius:20px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.battle-result.large{font-size:.85rem;padding:.5rem 1rem}.battle-description{color:#aaa;font-size:.9rem;margin-bottom:1rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.battle-view-gallery{color:gold;font-size:.85rem;font-weight:600;padding-top:.75rem;border-top:1px solid #333}.battle-gallery-section{padding:1rem 0}.btn-back{background:transparent;border:1px solid #ffd700;color:gold;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.9rem;margin-bottom:1.5rem;transition:all .2s ease}.btn-back:hover{background:#ffd7001a}.battle-gallery-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.battle-gallery-header h2{color:gold;font-size:1.75rem;margin:0}.battle-info-bar{display:flex;gap:1.5rem;color:#888;margin-bottom:1rem;font-size:.95rem}.battle-full-description{color:#ccc;font-size:1rem;line-height:1.7;margin-bottom:2rem;white-space:pre-line}.battle-media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.media-item{aspect-ratio:16/9;border-radius:8px;overflow:hidden;cursor:pointer;position:relative;border:2px solid transparent;transition:all .2s ease}.media-item:hover{border-color:gold;transform:scale(1.02)}.media-item img{width:100%;height:100%;object-fit:cover}.media-item.video .video-play-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;background:#ff0000d9;border-radius:50%;display:flex;align-items:center;justify-content:center;pointer-events:none}.media-item.video .video-play-icon svg{width:24px;height:24px;color:#fff;margin-left:3px}.no-media{grid-column:1 / -1;text-align:center;color:#888;padding:3rem;background:#0003;border-radius:12px;border:2px dashed #333}.media-lightbox{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;z-index:1000;display:flex;align-items:center;justify-content:center;padding:2rem}.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;background:#ffffff1a;border:none;color:#fff;width:40px;height:40px;border-radius:50%;font-size:1.2rem;cursor:pointer;transition:background .2s;z-index:1001}.lightbox-close:hover{background:#fff3}.lightbox-content{max-width:90vw;max-height:85vh}.lightbox-content img{max-width:100%;max-height:85vh;object-fit:contain;border-radius:8px}.lightbox-content iframe{width:80vw;height:45vw;max-height:80vh;border-radius:8px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem}.discord-modal{background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:16px;padding:2.5rem;max-width:420px;width:100%;text-align:center;border:2px solid #5865F2;box-shadow:0 20px 60px #5865f24d}.discord-modal-header{margin-bottom:1.5rem}.discord-modal-header .success-icon{width:60px;height:60px;background:linear-gradient(135deg,#28a745,#218838);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}.discord-modal-header .success-icon svg{width:32px;height:32px;color:#fff}.discord-modal-header h2{color:gold;font-size:1.5rem;margin:0}.discord-modal-message{color:#ccc;font-size:1rem;line-height:1.6;margin-bottom:2rem}.discord-modal-actions{display:flex;gap:1rem;justify-content:center}.btn-discord{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:#5865f2;color:#fff;padding:.875rem 1.5rem;border-radius:8px;font-size:.95rem;font-weight:600;text-decoration:none;transition:all .3s ease;border:none}.btn-discord:hover{background:#4752c4;transform:translateY(-2px);box-shadow:0 8px 20px #5865f266}.btn-discord .discord-icon{width:20px;height:20px}.btn-close-modal{background:transparent;border:1px solid #444;color:#999;padding:.875rem 1.5rem;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-close-modal:hover{border-color:#666;color:#fff;background:#ffffff0d}.battle-participants-section{background:#1a1a2e;border-radius:12px;padding:1.5rem;margin-bottom:2rem;border:1px solid #333}.battle-participants-section h3{color:gold;margin:0 0 1rem;font-size:1.1rem}.participants-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.participants-column h4{font-size:.9rem;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid #333}.participants-column.attended h4{color:#28a745}.participants-column.absent h4{color:#888}.participants-list{display:flex;flex-direction:column;gap:.5rem;max-height:200px;overflow-y:auto}.participant-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;border-radius:6px;font-size:.85rem}.participant-item.present{background:#28a7451a;border:1px solid rgba(40,167,69,.2)}.participant-item.present .participant-name{color:#28a745}.participant-item.absent{background:#6c757d1a;border:1px solid rgba(108,117,125,.2);opacity:.7}.participant-item.absent .participant-name{color:#888;text-decoration:line-through}.participant-id{color:#666;font-size:.8rem}.no-participants{color:#555;font-size:.85rem;font-style:italic;margin:0;padding:.5rem}@media (max-width: 600px){.participants-grid{grid-template-columns:1fr}}.soldier-day-availability{display:flex;gap:.25rem;margin:.5rem 0}.day-tag{padding:.15rem .4rem;border-radius:4px;font-size:.65rem;font-weight:700;opacity:.3;transition:opacity .2s ease}.day-tag.active{opacity:1}.day-tag.saturday{background:#4dabf733;color:#4dabf7;border:1px solid rgba(77,171,247,.3)}.day-tag.saturday.active{background:#4dabf74d;border-color:#4dabf7}.day-tag.sunday{background:#ff6b6b33;color:#ff6b6b;border:1px solid rgba(255,107,107,.3)}.day-tag.sunday.active{background:#ff6b6b4d;border-color:#ff6b6b}.officers-section{margin-bottom:1rem;border-bottom:1px solid rgba(184,134,11,.2);padding-bottom:.75rem}.regular-members-section{margin-top:.5rem}.section-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#b8860b;margin-bottom:.5rem;padding-left:.5rem;display:flex;align-items:center;gap:.5rem}.section-label:before{content:"";width:3px;height:12px;background:linear-gradient(180deg,gold,#b8860b);border-radius:2px}.officers-list{background:#b8860b0d;border-radius:8px;padding:.25rem}.officers-list .leader-item{background:#0000004d;border-left:3px solid #ffd700;margin-bottom:.25rem}.leader-section{margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,215,0,.3)}.leader-list{background:#ffd70014;border-radius:8px;padding:.25rem}.leader-list .leader-item{background:#0006;border-left:3px solid #ffd700}.section-label.leader-label{color:gold}.section-label.leader-label:before{background:linear-gradient(180deg,gold,#daa520)}.section-label.officers-label{color:#4dabf7}.section-label.officers-label:before{background:linear-gradient(180deg,#4dabf7,#228be6)}.officer-item{padding:.5rem .75rem;background:#0003;border-radius:6px;margin-bottom:.25rem;border-left:2px solid rgba(77,171,247,.5)}.section-label.members-label{color:#69db7c}.section-label.members-label:before{background:linear-gradient(180deg,#69db7c,#40c057)}.section-label .label-indicator{width:3px;height:12px;border-radius:2px;display:inline-block;margin-right:.5rem}.section-label.officers-label{display:flex;align-items:center}.section-label.officers-label:before{display:none}.btn-edit-availability{display:block;width:100%;margin-top:.5rem;padding:.4rem .8rem;font-size:.75rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#4dabf7,#228be6);border:none;border-radius:4px;cursor:pointer;transition:all .2s ease}.btn-edit-availability:hover{background:linear-gradient(135deg,#228be6,#1c7ed6);transform:translateY(-1px)}.availability-modal{background:linear-gradient(145deg,#1a1a1a,#2a2a2a);border:1px solid rgba(255,215,0,.3);border-radius:12px;padding:2rem;max-width:400px;width:90%;box-shadow:0 20px 60px #00000080;animation:modalSlideIn .3s ease}.availability-modal-header{text-align:center;margin-bottom:1.5rem}.availability-modal-header h2{color:gold;font-size:1.4rem;margin-bottom:.5rem}.availability-modal-header .editing-name{color:#4dabf7;font-size:1.1rem;font-weight:600}.availability-modal-body{margin-bottom:1.5rem}.availability-instruction{color:#d4d4d4;text-align:center;margin-bottom:1rem;font-size:.9rem}.availability-checkboxes{display:flex;justify-content:center;gap:2rem}.availability-checkbox-label{display:flex;flex-direction:column;align-items:center;gap:.5rem;cursor:pointer}.availability-checkbox-label input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:50px;height:50px;border:3px solid #555;border-radius:8px;background:#1a1a1a;cursor:pointer;transition:all .2s ease;position:relative}.availability-checkbox-label input[type=checkbox]:checked{border-color:#5cb85c;background:#5cb85c33}.availability-checkbox-label input[type=checkbox]:checked:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:25px;height:25px;background:#5cb85c;clip-path:polygon(14% 44%,0 65%,34% 80%,100% 18%,85% 0%,34% 60%)}.checkbox-day{font-size:1rem;font-weight:700;padding:.3rem .8rem;border-radius:4px}.checkbox-day.saturday{color:#4dabf7;background:#4dabf726}.checkbox-day.sunday{color:#ff6b6b;background:#ff6b6b26}.availability-warning{color:#ff6b6b;text-align:center;margin-top:1rem;font-size:.85rem;font-weight:600}.availability-modal-actions{display:flex;gap:1rem;justify-content:center}.btn-save-availability{padding:.7rem 1.5rem;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#5cb85c,#449d44);border:none;border-radius:6px;cursor:pointer;transition:all .2s ease}.btn-save-availability:hover:not(:disabled){background:linear-gradient(135deg,#449d44,#398439);transform:translateY(-1px)}.btn-save-availability:disabled{opacity:.5;cursor:not-allowed}.btn-cancel-availability{padding:.7rem 1.5rem;font-size:1rem;font-weight:600;color:#d4d4d4;background:transparent;border:1px solid #555;border-radius:6px;cursor:pointer;transition:all .2s ease}.btn-cancel-availability:hover{border-color:#888;color:#fff}.checkin-section{margin-bottom:1.5rem}.checkin-header{display:flex;justify-content:center;align-items:center;gap:.75rem;flex-wrap:wrap}.btn-checkin-toggle{padding:.8rem 2rem;font-size:1rem;font-weight:600;color:gold;background:linear-gradient(135deg,#ffd7001a,#ffd7000d);border:2px solid #ffd700;border-radius:8px;cursor:pointer;transition:all .3s ease}.btn-checkin-toggle:hover{background:linear-gradient(135deg,#ffd70033,#ffd7001a);transform:translateY(-2px);box-shadow:0 4px 15px #ffd7004d}.btn-checkin-toggle.active{background:linear-gradient(135deg,gold,#b8860b);color:#000}.checkin-content{margin-top:1rem;background:linear-gradient(145deg,#1a1a1a,#252525);border:1px solid rgba(255,215,0,.2);border-radius:12px;padding:1.5rem;animation:slideDown .3s ease}.checkin-section.active-battle .checkin-content{border:2px solid rgba(40,167,69,.5);background:linear-gradient(145deg,#28a7450d,#1a1a1a)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.checkin-form{margin-bottom:1.5rem}.checkin-form-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;justify-content:center}.checkin-input{flex:1;min-width:200px;max-width:300px;padding:.75rem 1rem;font-size:1rem;color:#fff;background:#0a0a0a;border:1px solid #444;border-radius:6px;transition:all .2s ease}.checkin-input:focus{outline:none;border-color:gold;box-shadow:0 0 0 2px #ffd70033}.checkin-input::placeholder{color:#666}.checkin-day-select{display:flex;gap:.25rem;background:#0a0a0a;padding:.25rem;border-radius:6px;border:1px solid #444}.checkin-day-select .day-btn{padding:.5rem 1rem;font-size:.9rem;font-weight:600;color:#888;background:transparent;border:none;border-radius:4px;cursor:pointer;transition:all .2s ease}.checkin-day-select .day-btn.active{color:#fff;background:gold;color:#000}.checkin-day-select .day-btn:hover:not(.active){color:#fff;background:#ffffff1a}.btn-checkin-submit{padding:.75rem 1.5rem;font-size:1rem;font-weight:700;color:#000;background:linear-gradient(135deg,#5cb85c,#449d44);border:none;border-radius:6px;cursor:pointer;transition:all .2s ease}.btn-checkin-submit:hover:not(:disabled){background:linear-gradient(135deg,#449d44,#398439);transform:translateY(-2px);box-shadow:0 4px 15px #5cb85c66}.btn-checkin-submit:disabled{opacity:.6;cursor:not-allowed}.checkin-error{color:#ff6b6b;text-align:center;margin-top:.75rem;font-size:.9rem;font-weight:500}.checkin-success{color:#5cb85c;text-align:center;margin-top:.75rem;font-size:.9rem;font-weight:500}.checkin-lists{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.checkin-list{background:#0000004d;border-radius:8px;padding:1rem}.checkin-list.saturday{border-left:3px solid #4dabf7}.checkin-list.sunday{border-left:3px solid #ff6b6b}.checkin-list h4{margin:0 0 .75rem;font-size:1rem;font-weight:700;color:#fff}.checkin-list.saturday h4{color:#4dabf7}.checkin-list.sunday h4{color:#ff6b6b}.checkin-list ul{list-style:none;padding:0;margin:0;max-height:200px;overflow-y:auto}.checkin-list li{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;border-radius:4px;background:#ffffff08;margin-bottom:.25rem}.checkin-list li:hover{background:#ffffff14}.checkin-name{color:#fff;font-weight:500}.checkin-time{color:#888;font-size:.8rem}.checkin-section.active-battle{margin-bottom:1.5rem}.checkin-section.active-battle .checkin-header{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;justify-content:center;position:relative}.checkin-section.active-battle .btn-checkin-toggle{background:linear-gradient(135deg,#28a745,#20c997);border-color:#28a745;color:#fff}.checkin-section.active-battle .btn-checkin-toggle:hover{background:linear-gradient(135deg,#20c997,#17a2b8)}.battle-status-badge{position:static!important;background:linear-gradient(135deg,#ff4757,#ff6b81);color:#fff;padding:.4rem 1rem;border-radius:20px;font-size:.7rem;font-weight:700;letter-spacing:.5px;animation:pulse-glow 2s infinite;text-transform:uppercase}@keyframes pulse-glow{0%,to{opacity:1;box-shadow:0 0 10px #28a74580}50%{opacity:.8;box-shadow:0 0 20px #28a745cc}}.active-battle-info{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding:.75rem;background:#28a7451a;border-radius:6px}.active-battle-info .battle-opponent{color:#28a745;font-weight:700;font-size:1.1rem}.active-battle-info .battle-date{color:#888;font-size:.9rem}.checkin-list-single{background:#0000004d;border-radius:8px;padding:1rem;border-left:3px solid #28a745}.checkin-list-single h4{margin:0 0 .75rem;font-size:1rem;font-weight:700;color:#28a745}.checkin-list-single ul{list-style:none;padding:0;margin:0;max-height:300px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem}.checkin-list-single li{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;border-radius:4px;background:#28a7451a}.checkin-list-single li:hover{background:#28a74533}.empty-checkins{color:#666;text-align:center;padding:1rem;font-style:italic}.checkin-teams-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-top:1.5rem}.checkin-team-card{background:linear-gradient(145deg,#1e1e1e,#252525);border-radius:10px;padding:1rem;border:1px solid rgba(255,215,0,.2)}.checkin-team-card.unassigned{border-color:#6c757d4d}.checkin-team-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,215,0,.1)}.checkin-team-header h4{margin:0;font-size:1rem;font-weight:700;color:gold}.checkin-team-count{background:#28a74533;color:#28a745;padding:.25rem .6rem;border-radius:12px;font-size:.8rem;font-weight:600}.checkin-team-members{list-style:none;padding:0;margin:0;max-height:250px;overflow-y:auto}.checkin-member{display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;border-radius:4px;margin-bottom:.25rem;transition:all .2s ease}.checkin-member.checked-in{background:#28a74526}.checkin-member.not-checked{background:#ffffff08;opacity:.6}.checkin-member:hover{background:#ffffff14;opacity:1}.checkin-status-icon{font-size:.9rem;width:18px;text-align:center}.checkin-member.checked-in .checkin-status-icon{color:#28a745;font-weight:700}.checkin-member.not-checked .checkin-status-icon{color:#666}.checkin-member-name{flex:1;font-size:.9rem;color:#eee}.checkin-member.checked-in .checkin-member-name{color:#fff;font-weight:500}.checkin-member-time{font-size:.75rem;color:#28a745;opacity:.8}.checkin-member.empty{justify-content:center;opacity:.5;font-style:italic}.checkin-empty-text{color:#888;font-size:.85rem}.checkin-list-simple{background:#0000004d;border-radius:10px;padding:1.25rem;border-left:3px solid #28a745}.checkin-list-simple h4{margin:0 0 1rem;font-size:1.1rem;font-weight:700;color:#28a745}.checkin-names-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.5rem;max-height:300px;overflow-y:auto}.checkin-name-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:#28a7451a;border-radius:6px;transition:background .2s ease}.checkin-name-item:hover{background:#28a74533}.checkin-name-item .checkin-name{color:#fff;font-weight:500;font-size:.9rem}.checkin-name-item .checkin-time{color:#28a745;font-size:.75rem;opacity:.8}@media (max-width: 600px){.checkin-form-row{flex-direction:column}.checkin-input{width:100%;max-width:none}.checkin-lists,.checkin-teams-grid{grid-template-columns:1fr}}.articles-section{margin-bottom:2rem;display:flex;flex-direction:column;gap:1rem}.article-notice{background:linear-gradient(135deg,#b8860b26,#ffd7000d);border:1px solid rgba(184,134,11,.4);border-radius:12px;padding:1.25rem;position:relative;overflow:hidden}.article-notice:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,#b8860b,gold)}.article-notice-title{font-size:1.1rem;font-weight:700;color:gold;margin:0 0 .75rem;padding-left:.5rem;display:flex;align-items:center;gap:.5rem}.article-notice-title:before{content:"";display:inline-block;width:6px;height:6px;background:gold;border-radius:50%}.article-notice-content{color:#d4d4d4;line-height:1.7;font-size:.95rem;padding-left:.5rem;white-space:pre-wrap}.articles-section .article-notice:first-child{margin-top:0}.articles-section .article-notice:last-child{margin-bottom:0}@media (max-width: 768px){.article-notice{padding:1rem}.article-notice-title{font-size:1rem}.article-notice-content{font-size:.9rem}}.manager-page{flex:1;background:#f5f5f5}.loading-container{display:flex;justify-content:center;align-items:center;min-height:400px;font-size:1.25rem;color:#666}.manager-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:2rem;text-align:center}.manager-header h1{font-size:2rem;font-weight:700;margin-bottom:.5rem}.manager-header p{opacity:.95}.manager-content{max-width:1400px;margin:0 auto;padding:2rem;display:flex;gap:2rem}.manager-nav{width:250px;background:#fff;border-radius:12px;padding:1rem;height:fit-content;box-shadow:0 2px 10px #0000001a;position:sticky;top:90px}.nav-item{width:100%;padding:1rem;background:transparent;border:none;border-radius:8px;text-align:left;font-size:.95rem;font-weight:500;color:#666;cursor:pointer;transition:all .2s ease;margin-bottom:.5rem}.nav-item:hover{background:#667eea1a;color:#667eea}.nav-item.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.manager-main{flex:1}.section{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 2px 10px #0000001a}.section h2{font-size:1.75rem;color:#333;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #667eea}.settings-form{max-width:600px}.form-group label{display:block;font-weight:600;color:#333;margin-bottom:.5rem}.form-group input,.form-group select{width:100%;padding:.75rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .2s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:#667eea}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.danger-zone{margin-top:3rem;padding:2rem;border:2px solid #ef4444;border-radius:8px;background:#fef2f2}.danger-zone h3{color:#dc2626;margin-top:0;margin-bottom:1rem;font-size:1.3rem}.danger-zone-warning{color:#991b1b;margin-bottom:1.5rem;line-height:1.6;background:#fff;padding:1rem;border-radius:6px;border-left:4px solid #ef4444}.btn-primary,.btn-secondary,.btn-warning,.btn-danger{padding:.875rem 2rem;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:1rem}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 10px #667eea4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 15px #667eea66}.btn-secondary{background:#6c757d;color:#fff}.btn-secondary:hover{background:#5a6268;transform:translateY(-2px)}.btn-warning{background:#f39c12;color:#fff}.btn-warning:hover{background:#e67e22;transform:translateY(-2px)}.btn-danger{background:#e74c3c;color:#fff}.btn-danger:hover{background:#c0392b;transform:translateY(-2px)}.btn-success-small,.btn-danger-small{padding:.5rem 1rem;border:none;border-radius:6px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-success-small{background:#2ecc71;color:#fff}.btn-success-small:hover{background:#27ae60;transform:translateY(-1px);box-shadow:0 2px 8px #2ecc714d}.btn-success-small:active{transform:translateY(0);box-shadow:0 1px 3px #2ecc714d}.btn-danger-small{background:#e74c3c;color:#fff}.btn-danger-small:hover{background:#c0392b}.participants-table,.matches-table{overflow-x:auto}table{width:100%;border-collapse:collapse;margin-top:1rem;background:#fff}th{background:#f9f9f9;padding:1rem;text-align:left;font-weight:600;color:#333;border-bottom:2px solid #e0e0e0}td{padding:1rem;border-bottom:1px solid #e0e0e0;color:#333;background:#fff}tr:hover,tr:hover td{background:#f9f9f9}tr.completed{opacity:.7}.group-badge{display:inline-block;padding:.25rem .75rem;background:#667eea;color:#fff;border-radius:20px;font-size:.875rem;font-weight:600}.lives-display{display:flex;gap:.25rem}.life-heart{color:#e74c3c;font-size:1rem}.status-select{padding:.5rem;border:2px solid #e0e0e0;border-radius:6px;font-size:.875rem}.status-select.confirmed{border-color:#2ecc71;color:#2ecc71}.status-select.pending{border-color:#f39c12;color:#f39c12}.status-select.eliminated{border-color:#e74c3c;color:#e74c3c}.status-badge{display:inline-block;padding:.375rem .875rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase}.status-badge.pending{background:#fff3cd;color:#856404}.status-badge.completed{background:#d4edda;color:#155724}.score-input{width:60px;padding:.5rem;border:2px solid #e0e0e0;border-radius:6px;text-align:center;font-size:1rem;font-weight:600}.score-input:focus{outline:none;border-color:#667eea}.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-top:1rem}.action-card{background:#f9f9f9;padding:1.5rem;border-radius:12px;border:2px solid #e0e0e0;transition:all .3s ease}.action-card h4{margin-top:0;margin-bottom:.5rem;color:#333;font-size:1.1rem}.action-card p{font-size:.9rem;color:#666;margin-bottom:1rem}.history-list{display:flex;flex-direction:column;gap:1.5rem}.history-card{background:#fff;padding:2rem;border-radius:12px;border:2px solid #e0e0e0;transition:all .3s ease}.history-card:hover{border-color:#764ba2;box-shadow:0 4px 12px #667eea33;transform:translateY(-2px)}.history-card h3{margin-top:0;margin-bottom:1rem;color:#333;font-size:1.5rem}.history-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1.5rem;color:#666}.history-details strong{color:#333}.status-completed{color:#4caf50;font-weight:600}.manage-sections{display:flex;flex-direction:column;gap:3rem}.subsection{background:#fff;padding:2rem;border-radius:12px;border:2px solid #e0e0e0}.subsection-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:2px solid #e0e0e0;flex-wrap:wrap;gap:1rem}.subsection-header>div{flex:1}.subsection-header h3{margin:0;color:#333;font-size:1.3rem;border-bottom:none;padding-bottom:0}.matchup-info{margin-top:.75rem;display:flex;flex-direction:column;gap:.5rem}.matchup-status{padding:.5rem 1rem;border-radius:6px;font-size:.95rem;display:inline-block;max-width:fit-content}.matchup-status.complete{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 2px 8px #10b9814d}.matchup-status.incomplete{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;box-shadow:0 2px 8px #f59e0b4d}.matchup-alert{padding:.5rem 1rem;background:#fef3c7;border-left:4px solid #f59e0b;color:#92400e;border-radius:4px;font-size:.9rem;font-weight:500}.matchup-next{padding:.5rem 1rem;background:#e0e7ff;border-left:4px solid #667eea;color:#3730a3;border-radius:4px;font-size:.9rem}.matchup-temporary{padding:.5rem 1rem;background:#dbeafe;border-left:4px solid #3b82f6;color:#1e40af;border-radius:4px;font-size:.9rem}.participants-section{margin-bottom:2rem;background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 1px 3px #0000001a}.participants-section h4{margin-top:0;margin-bottom:1rem;color:#1f2937;font-size:1.1rem;padding-bottom:.5rem;border-bottom:2px solid #e5e7eb}.participants-section.temporary-section{background:#f9fafb}.participants-section.temporary-section h4{color:#6b7280;border-bottom-color:#d1d5db}.temporary-participant{background-color:#f3f4f6!important;opacity:1}.temporary-participant td{background-color:#f3f4f6!important;color:#6b7280}.subsection h3{margin-top:0;margin-bottom:1.5rem;color:#333;font-size:1.3rem;padding-bottom:.5rem;border-bottom:2px solid #e0e0e0}.btn-success{padding:.75rem 1.5rem;background:#4caf50;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-success:hover{background:#45a049;transform:translateY(-2px);box-shadow:0 4px 12px #4caf504d}.section-description{color:#666;margin-bottom:2rem;font-size:1.05rem}.tournaments-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem}.tournament-list-card{background:#fff;padding:2rem;border-radius:12px;border:2px solid #e0e0e0;cursor:pointer;transition:all .3s ease}.tournament-list-card:hover{border-color:#764ba2;box-shadow:0 4px 12px #667eea33;transform:translateY(-2px)}.tournament-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.tournament-list-header h3{margin:0;color:#333;font-size:1.3rem}.tournament-list-details{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;color:#666;font-size:.95rem}.tournament-list-details strong{color:#333}.tournament-list-card .btn-secondary{width:100%;margin-top:1rem}.empty-state{text-align:center;padding:3rem;color:#999;font-size:1.1rem;background:#fff;border-radius:12px;border:2px dashed #e0e0e0}.tournament-header-bar{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #e0e0e0}.tournament-header-bar h2{margin:0;color:#333}.btn-back{padding:.75rem 1.5rem;background:#fff;color:#667eea;border:2px solid #667eea;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-back:hover{background:#667eea;color:#fff}.management-tabs{display:flex;gap:.5rem;margin-bottom:2rem;border-bottom:2px solid #e0e0e0;background:#fff;padding:1rem 1rem 0;border-radius:12px 12px 0 0}.management-tab{padding:.75rem 1.5rem;background:none;border:none;color:#666;font-weight:600;cursor:pointer;position:relative;transition:all .3s ease;border-radius:8px 8px 0 0}.management-tab:hover,.management-tab.active{color:#667eea;background:#f5f5f5}.management-tab.active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#667eea}.bracket-stage-tabs{display:flex;gap:.5rem;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #e0e0e0}.bracket-stage-tab{padding:.5rem 1rem;background:#f5f5f5;border:2px solid #e0e0e0;color:#666;font-weight:600;cursor:pointer;border-radius:6px;transition:all .3s ease}.bracket-stage-tab:hover{border-color:#764ba2;color:#764ba2}.bracket-stage-tab.active{background:#667eea;color:#fff;border-color:#667eea}.bracket-content-area{margin-top:1.5rem}.bracket-info{padding:1.5rem;background:#f9f9f9;border-radius:8px;margin-bottom:1.5rem}.bracket-info h4{margin-top:0;color:#333;font-size:1.2rem;margin-bottom:.5rem}.bracket-info p{color:#666;margin-bottom:1rem}.bracket-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1rem}.selection-round-tabs{display:flex;gap:.5rem;margin:1.5rem 0;padding:1rem;background:#f5f5f5;border-radius:8px;justify-content:center}.round-subtab{padding:.75rem 1.5rem;background:#fff;border:2px solid #e0e0e0;color:#666;font-weight:600;font-size:.95rem;cursor:pointer;border-radius:6px;transition:all .3s ease}.round-subtab:hover:not(:disabled){border-color:#667eea;color:#667eea;transform:translateY(-1px);box-shadow:0 2px 8px #667eea33}.round-subtab.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;color:#fff;box-shadow:0 4px 12px #667eea4d}.round-subtab:disabled{opacity:.3;cursor:not-allowed;border-color:#e0e0e0}.btn-warning{background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff;padding:.75rem 1.5rem;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #f39c1233}.btn-warning:hover{transform:translateY(-2px);box-shadow:0 6px 12px #f39c124d}.bracket-stage-section{display:flex;flex-direction:column;gap:2rem}.visual-bracket{background:#fff;padding:1.5rem;border-radius:8px;border:2px solid #e0e0e0}.visual-bracket h4{margin-top:0;margin-bottom:1.5rem;color:#333;font-size:1.1rem}.selection-groups,.main-bracket-visual{display:flex;gap:2rem;justify-content:center}.group-section,.bracket-column{flex:1;max-width:400px}.group-section h5,.bracket-column h5{text-align:center;margin-top:0;margin-bottom:1rem;color:#667eea;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.matches-visual{display:flex;flex-direction:column;gap:1rem}.match-visual{background:#f9f9f9;border:2px solid #e0e0e0;border-radius:8px;padding:.75rem;transition:all .3s ease}.match-visual.completed{background:#e8f5e9;border-color:#4caf50;animation:completePulse .5s ease}@keyframes completePulse{0%{transform:scale(1);box-shadow:0 0 #4caf50b3}50%{transform:scale(1.02);box-shadow:0 0 0 10px #4caf5000}to{transform:scale(1);box-shadow:0 0 #4caf5000}}.match-visual.pending{background:#fff3e0;border-color:#ff9800}.player-slot{display:flex;justify-content:space-between;align-items:center;padding:.5rem;margin:.25rem 0;background:#fff;border-radius:4px;border:1px solid #e0e0e0}.player-slot span{font-weight:500;color:#333}.player-slot strong{color:#667eea;font-size:1.1rem;min-width:30px;text-align:right}.finals-visual{display:flex;flex-direction:column;gap:1.5rem;max-width:500px;margin:0 auto}.final-match{position:relative}.match-label{position:absolute;top:-10px;left:50%;transform:translate(-50%);background:#667eea;color:#fff;padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:700;text-transform:uppercase}.matches-table-section{margin-top:1rem}.matches-table-section h4{margin-bottom:1rem;color:#333;font-size:1rem}.action-card{border:2px solid #e0e0e0;transition:all .2s ease}.action-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea33}.action-card.danger{border-color:#e74c3c}.action-card.danger:hover{box-shadow:0 4px 12px #e74c3c33}.action-card h3{font-size:1.25rem;color:#333;margin-bottom:.5rem}.action-card p{color:#666;margin-bottom:1.5rem;font-size:.95rem}.action-card button{width:100%;margin-top:0}@media (max-width: 992px){.manager-content{flex-direction:column}.manager-nav{width:100%;position:static;display:flex;overflow-x:auto;padding:.5rem}.nav-item{white-space:nowrap;margin-right:.5rem;margin-bottom:0}}@media (max-width: 768px){.form-row,.actions-grid{grid-template-columns:1fr}table{font-size:.875rem}th,td{padding:.75rem .5rem}}.gallery-upload{margin-bottom:2rem}.gallery-upload-section{display:flex;gap:2rem;margin-bottom:2rem;flex-wrap:wrap}.upload-box{flex:1;min-width:280px;background:#1a1a2e;padding:1.5rem;border-radius:12px;border:1px solid #333}.upload-box h4{color:gold;margin-bottom:1rem;font-size:.95rem}.video-url-form{display:flex;gap:.5rem}.video-url-input{flex:1;padding:.75rem 1rem;border:1px solid #444;border-radius:8px;background:#16213e;color:#fff;font-size:.9rem}.video-url-input:focus{outline:none;border-color:gold}.video-url-input::placeholder{color:#888}.gallery-item.video{position:relative}.gallery-item.video a{display:block;width:100%;height:100%}.video-play-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background:#ff0000d9;border-radius:50%;display:flex;align-items:center;justify-content:center;pointer-events:none;transition:all .3s ease}.video-play-icon svg{width:30px;height:30px;color:#fff;margin-left:4px}.gallery-item.video:hover .video-play-icon{background:red;transform:translate(-50%,-50%) scale(1.1)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.gallery-item{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;background:#f5f5f5}.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.gallery-item:hover img{transform:scale(1.05)}.gallery-delete{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:#ef4444e6;color:#fff;border:none;cursor:pointer;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.gallery-item:hover .gallery-delete{opacity:1}.gallery-delete:hover{background:#dc2626}.empty-gallery{grid-column:1 / -1;text-align:center;color:#666;padding:3rem;background:#f9f9f9;border-radius:8px;border:2px dashed #e0e0e0}.champion-section{padding:1.5rem;background:#f9f9f9;border-radius:12px}.champion-display{display:flex;gap:2rem;align-items:flex-start;margin-bottom:1.5rem}.champion-photo{width:150px;height:150px;border-radius:12px;overflow:hidden;flex-shrink:0;background:#e0e0e0}.champion-photo img{width:100%;height:100%;object-fit:cover}.champion-info h4{margin:0 0 .5rem;font-size:1.5rem;color:#333}.champion-notes{color:#666;line-height:1.6;margin:0}.warning-message{padding:1rem;background:#fef3c7;border-left:4px solid #f59e0b;color:#92400e;border-radius:4px;margin:1rem 0}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.modal-content{background:#fff;padding:2rem;border-radius:16px;max-width:500px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d}.modal-content h2{margin:0 0 .5rem;color:#333}.modal-content>p{color:#666;margin-bottom:1.5rem}.modal-content .form-group{margin-bottom:1.25rem}.modal-content .form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:#333}.modal-content .form-group input,.modal-content .form-group textarea{width:100%;padding:.75rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .2s ease}.modal-content .form-group input:focus,.modal-content .form-group textarea:focus{outline:none;border-color:#667eea}.modal-content .form-group textarea{resize:vertical;min-height:80px}.champion-preview{margin-top:.75rem;max-width:150px;border-radius:8px}.modal-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e0e0e0}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:.75rem 1.5rem;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-success:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.btn-secondary{background:#f5f5f5;color:#666;padding:.75rem 1.5rem;border:2px solid #e0e0e0;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-secondary:hover{background:#e0e0e0;border-color:#ccc}.btn-edit-small{padding:.4rem .75rem;background:#3b82f6;color:#fff;border:none;border-radius:4px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-right:.5rem}.btn-edit-small:hover{background:#2563eb}.btn-delete-small{padding:.4rem .6rem;background:#ef4444;color:#fff;border:none;border-radius:4px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-delete-small:hover{background:#dc2626}.actions-cell{white-space:nowrap}.add-match-btn{margin-top:1rem;display:inline-block}.modal-content .form-group select{width:100%;padding:.75rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;background:#fff;cursor:pointer}.modal-content .form-group select:focus{outline:none;border-color:#667eea}.modal-actions .btn-danger{margin-right:auto}.danger-action{padding:1rem;background:#fff;border-radius:8px;margin-bottom:1rem;border-left:4px solid #f59e0b}.danger-action:last-child{margin-bottom:0}.danger-action.danger-delete{border-left-color:#ef4444}.danger-action .danger-zone-warning{margin:0 0 .75rem}.danger-action .btn-danger{margin-top:0}.results-table-container{overflow-x:auto;margin-bottom:1.5rem}.results-table{width:100%;border-collapse:collapse}.results-table th{background:#f5f5f5;padding:.75rem;text-align:left;font-weight:600;border-bottom:2px solid #e0e0e0}.results-table td{padding:.75rem;border-bottom:1px solid #e0e0e0;vertical-align:top}.rank-cell{width:80px}.rank-badge{display:inline-block;padding:.4rem .75rem;border-radius:20px;font-weight:700;font-size:.9rem}.rank-badge.rank-1{background:linear-gradient(135deg,gold,#ffb800);color:#7a5800}.rank-badge.rank-2{background:linear-gradient(135deg,silver,#a8a8a8);color:#555}.rank-badge.rank-3{background:linear-gradient(135deg,#cd7f32,#b8702e);color:#fff}.rank-select{padding:.5rem .75rem;border-radius:20px;font-weight:700;font-size:.9rem;border:none;cursor:pointer;min-width:70px;text-align:center}.rank-select.rank-1{background:linear-gradient(135deg,gold,#ffb800);color:#7a5800}.rank-select.rank-2{background:linear-gradient(135deg,silver,#a8a8a8);color:#555}.rank-select.rank-3{background:linear-gradient(135deg,#cd7f32,#b8702e);color:#fff}.rank-select:not(.rank-1):not(.rank-2):not(.rank-3){background:#f0f0f0;color:#333;border:2px solid #e0e0e0}.rank-select:focus{outline:none;box-shadow:0 0 0 3px #667eea4d}.result-select{width:100%;padding:.5rem;border:2px solid #e0e0e0;border-radius:6px;font-size:.9rem;margin-bottom:.5rem}.result-select:focus{outline:none;border-color:#667eea}.result-input{width:100%;padding:.5rem;border:2px solid #e0e0e0;border-radius:6px;font-size:.9rem}.result-input:focus{outline:none;border-color:#667eea}.result-input.custom-name{font-size:.85rem;color:#666}.result-input.prize-input{max-width:120px}.result-input.notes-input{min-width:150px}.results-actions{display:flex;gap:1rem;justify-content:flex-start}.results-actions .btn-primary,.results-actions .btn-secondary{margin-top:0}.gallery-upload-form{background:#f9f9f9;padding:1.5rem;border-radius:12px;margin-bottom:2rem}.gallery-upload-form .form-group{margin-bottom:1rem}.upload-row{display:flex;gap:1rem;align-items:center}.site-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.site-gallery-item{position:relative;border-radius:12px;overflow:hidden;background:#f5f5f5;border:2px solid #e0e0e0;transition:all .3s ease}.site-gallery-item:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea33}.site-gallery-item img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.gallery-item-number{position:absolute;top:10px;left:10px;width:30px;height:30px;background:#667eeae6;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem}.gallery-item-caption{padding:.75rem 1rem;background:#fff;font-size:.9rem;color:#333;border-top:1px solid #e0e0e0}.site-gallery-item .gallery-delete{position:absolute;top:10px;right:10px;opacity:0}.site-gallery-item:hover .gallery-delete{opacity:1}.empty-gallery-message{grid-column:1 / -1;text-align:center;padding:3rem;background:#f9f9f9;border-radius:12px;border:2px dashed #e0e0e0;color:#666}.settlement-section{margin-top:2rem;padding-top:2rem;border-top:2px solid #e0e0e0}.settlement-section h4{margin:0 0 1rem;color:#333;font-size:1.2rem}.settlement-status{padding:1.5rem;border-radius:12px;display:flex;align-items:flex-start;gap:1rem}.settlement-status.completed{background:linear-gradient(135deg,#d4edda,#c3e6cb);border:2px solid #28a745}.settlement-status.completed .status-icon{font-size:2rem;color:#28a745;line-height:1}.settlement-status.completed strong{color:#155724;font-size:1.1rem}.settlement-status.completed p{margin:.5rem 0 0;color:#155724;font-size:.95rem}.settlement-status.pending{background:#fff3cd;border:2px solid #ffc107;flex-direction:column}.settlement-status.pending p{margin:0 0 1rem;color:#856404}.btn-settle{padding:1rem 2rem;background:linear-gradient(135deg,#28a745,#20c997);color:#fff;border:none;border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px}.btn-settle:hover{transform:translateY(-2px);box-shadow:0 6px 20px #28a74566}.guild-war-section{background:#fff;border-radius:12px;padding:1.5rem;margin-bottom:1.5rem;box-shadow:0 2px 8px #0000001a}.guild-war-section h3{font-size:1.25rem;color:#333;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid #ffd700}.section-header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;gap:1rem;flex-wrap:wrap}.section-header-bar h3{margin-bottom:0;border-bottom:none;padding-bottom:0}.manager-day-filter{display:flex;gap:.5rem}.manager-day-filter .day-filter-btn{padding:.5rem 1rem;background:#f5f5f5;border:2px solid #e0e0e0;border-radius:6px;color:#666;font-weight:600;font-size:.85rem;cursor:pointer;transition:all .2s ease}.manager-day-filter .day-filter-btn:hover{border-color:#999;color:#333}.manager-day-filter .day-filter-btn.active.saturday{background:linear-gradient(135deg,#4dabf7,#339af0);border-color:#4dabf7;color:#fff}.manager-day-filter .day-filter-btn.active.sunday{background:linear-gradient(135deg,#ff6b6b,#fa5252);border-color:#ff6b6b;color:#fff}.guild-roles-section .roles-list{display:flex;flex-direction:column;gap:.75rem}.guild-roles-section .role-item{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:#fafafa;border-radius:8px;border-left:4px solid #ffd700}.guild-roles-section .role-badge-preview{padding:.25rem .5rem;border-radius:4px;font-weight:800;font-size:.75rem;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 4px #0003}.guild-roles-section .role-name{font-weight:600;color:#333;flex:1}.guild-roles-section .role-priority{font-size:.8rem;color:#888;padding:.25rem .5rem;background:#eee;border-radius:4px}.guild-roles-section .role-actions{display:flex;gap:.5rem}.role-preview{display:flex;align-items:center;padding:1rem;background:#1a1a2e;border-radius:8px}.mini-role-badge{display:inline-block;padding:.1rem .3rem;border-radius:3px;font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;margin-right:.25rem;box-shadow:0 1px 2px #0000004d}.teams-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.team-card{background:#fafafa;border-radius:12px;border:2px solid #ddd;overflow:hidden;transition:all .3s ease}.team-card:hover{box-shadow:0 4px 16px #00000026}.team-header{padding:1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #eee}.team-rank{background:#333;color:gold;font-weight:700;padding:.25rem .5rem;border-radius:4px;font-size:.85rem}.team-header h4{flex:1;margin:0;font-size:1.1rem}.team-actions{display:flex;gap:.5rem}.team-description{padding:.75rem 1rem;font-size:.9rem;color:#666;background:#f5f5f5;margin:0}.team-members{padding:1rem}.team-leader-section,.team-members-section{margin-bottom:.75rem}.team-leader-section .label,.team-members-section .label{display:block;font-size:.75rem;text-transform:uppercase;color:#666;margin-bottom:.5rem;font-weight:600}.no-leader{color:#999;font-style:italic;font-size:.9rem}.members-list{display:flex;flex-wrap:wrap;gap:.5rem}.member-badge{display:inline-flex;align-items:center;gap:.25rem;background:#e9ecef;padding:.35rem .6rem;border-radius:20px;font-size:.85rem}.member-badge.leader{background:linear-gradient(135deg,gold,#ffb800);color:#333;font-weight:600}.btn-xs{width:18px;height:18px;padding:0;border:none;border-radius:50%;background:#0003;color:#fff;font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.btn-xs:hover{background:#dc3545}.btn-xs.btn-promote{background:#28a745}.btn-xs.btn-promote:hover{background:#1e7e34}.members-subsection{margin-bottom:1.5rem}.members-subsection h4{font-size:1rem;color:#555;margin-bottom:.75rem;padding-left:.5rem;border-left:3px solid #ffd700}.members-subsection.inactive-section h4{border-left-color:#999}.members-table{width:100%;border-collapse:collapse;font-size:.9rem}.members-table th,.members-table td{padding:.75rem;text-align:left;border-bottom:1px solid #eee}.members-table th{background:#f8f9fa;font-weight:600;color:#555;font-size:.8rem;text-transform:uppercase}.members-table tr:hover{background:#f8f9fa}.leader-badge{display:inline-block;margin-left:.5rem;padding:.15rem .4rem;background:#4dabf7;color:#fff;font-size:.7rem;font-weight:700;border-radius:4px;text-transform:uppercase}.leader-badge.sunday{background:#ff6b6b}.team-day-badge{padding:.2rem .5rem;border-radius:4px;font-size:.7rem;font-weight:700;text-transform:uppercase}.team-day-badge.saturday{background:#4dabf7;color:#fff}.team-day-badge.sunday{background:#ff6b6b;color:#fff}.draggable-row{cursor:grab;transition:all .2s ease}.draggable-row:active{cursor:grabbing}.draggable-row.dragging{opacity:.5;background:#e3f2fd!important}.draggable-row:hover{background:#f5f5f5}.drag-handle{display:flex;align-items:center;gap:.5rem}.drag-icon{color:#999;font-size:.8rem;font-weight:700;letter-spacing:1px;cursor:grab}.draggable-row:hover .drag-icon{color:#667eea}.team-card.drop-target{position:relative}.team-card.drop-target:after{content:"Drop member here";position:absolute;top:0;left:0;right:0;bottom:0;background:#667eea1a;border:2px dashed #667eea;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#667eea;font-weight:600;font-size:.9rem;pointer-events:none;opacity:0;transition:opacity .2s ease}.team-card.drag-over{border-color:#667eea!important;box-shadow:0 0 20px #667eea66;transform:scale(1.02)}.team-card.drag-over:after{opacity:1}.drag-hint{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#e8f4fd;border:1px solid #b3d9f7;border-radius:8px;color:#1976d2;font-size:.85rem;margin-bottom:1rem}.drag-hint-icon{font-size:1.1rem}.draggable-badge{cursor:grab;transition:all .2s ease}.draggable-badge:active{cursor:grabbing}.draggable-badge.dragging{opacity:.5;transform:scale(.95)}.draggable-badge:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.btn-sm{padding:.35rem .75rem;font-size:.8rem;border-radius:4px;border:none;cursor:pointer;font-weight:500;transition:all .2s ease}.btn-sm.btn-success{background:#28a745;color:#fff}.btn-sm.btn-success:hover{background:#1e7e34}.btn-sm.btn-warning{background:#ffc107;color:#333}.btn-sm.btn-warning:hover{background:#e0a800}.btn-sm.btn-danger{background:#dc3545;color:#fff}.btn-sm.btn-danger:hover{background:#c82333}.btn-sm.btn-secondary{background:#6c757d;color:#fff}.btn-sm.btn-secondary:hover{background:#5a6268}.btn-sm.btn-edit{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-sm.btn-edit:hover{background:linear-gradient(135deg,#5a6fd6,#6a4190)}.members-table select{padding:.35rem .5rem;border:1px solid #ddd;border-radius:4px;font-size:.85rem;background:#fff;min-width:120px}.members-table select:focus{outline:none;border-color:gold}.form-row{display:flex;gap:1rem}.form-row .form-group{flex:1}input[type=color]{width:60px;height:40px;padding:0;border:2px solid #ddd;border-radius:4px;cursor:pointer}input[type=color]::-webkit-color-swatch-wrapper{padding:2px}input[type=color]::-webkit-color-swatch{border-radius:2px;border:none}.guild-battles-container{margin-top:1.5rem}.battles-header{margin-bottom:1.5rem}.battles-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.battle-card{background:#1a1a2e;border-radius:12px;padding:1.5rem;border:1px solid #333;transition:all .3s ease}.battle-card:hover{border-color:gold;transform:translateY(-2px)}.battle-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.75rem}.battle-card-header h3{color:gold;font-size:1.1rem;margin:0;flex:1}.battle-result{padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:700;text-transform:uppercase}.battle-result.victory{background:linear-gradient(135deg,#28a745,#218838);color:#fff}.battle-result.defeat{background:linear-gradient(135deg,#dc3545,#c82333);color:#fff}.battle-result.draw{background:linear-gradient(135deg,#6c757d,#5a6268);color:#fff}.battle-card-info{display:flex;gap:1rem;font-size:.85rem;color:#888;margin-bottom:.75rem}.battle-enemy{color:#b8860b;font-weight:600}.battle-description{color:#ccc;font-size:.9rem;margin-bottom:1rem;line-height:1.5}.battle-card-actions{display:flex;gap:.5rem;flex-wrap:wrap}.battle-gallery-view{padding:1rem 0}.back-btn{margin-bottom:1.5rem}.battle-gallery-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.battle-gallery-header h3{color:gold;font-size:1.5rem;margin:0}.empty-message{text-align:center;color:#888;padding:3rem;background:#1a1a2e;border-radius:12px;border:2px dashed #333}.ongoing-battles-section{margin-bottom:2rem}.ongoing-battles-section h3,.completed-battles-section h3{color:gold;margin-bottom:1rem;font-size:1.2rem}.battle-card.ongoing{border-color:#28a745;position:relative}.battle-status-badge{position:absolute;top:-10px;right:1rem;background:linear-gradient(135deg,#28a745,#218838);color:#fff;padding:.25rem .75rem;border-radius:4px;font-size:.7rem;font-weight:700;letter-spacing:1px}.battle-status.ongoing{background:linear-gradient(135deg,#28a745,#218838);color:#fff;padding:.3rem .8rem;border-radius:4px;font-size:.75rem;font-weight:700}.battle-checkin-section{background:#1a1a2e;border-radius:12px;padding:1.5rem;margin-bottom:2rem;border:1px solid #333}.checkin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.checkin-header h4{color:gold;margin:0}.checkin-stats{display:flex;gap:1rem}.checkin-stats .checked-in{color:#28a745;font-weight:600}.checkin-stats .not-checked{color:#888}.checkin-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.75rem;max-height:400px;overflow-y:auto;padding-right:.5rem}.checkin-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:#16213e;border-radius:8px;cursor:pointer;transition:all .2s ease;border:2px solid transparent}.checkin-item:hover{background:#1e2d50}.checkin-item.checked{border-color:#28a745;background:#28a7451a}.checkin-item.unchecked{opacity:.6}.checkin-checkbox{width:24px;height:24px;display:flex;align-items:center;justify-content:center}.checkin-checkbox .check-icon{width:24px;height:24px;color:#28a745}.checkin-checkbox .empty-checkbox{width:20px;height:20px;border:2px solid #555;border-radius:4px}.checkin-player-info{flex:1;display:flex;flex-direction:column}.checkin-player-info .player-name{color:#fff;font-weight:600}.checkin-player-info .player-id{color:#888;font-size:.85rem}.checkin-status{font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:4px}.checkin-status.present{background:#28a74533;color:#28a745}.checkin-status.absent{background:#6c757d33;color:#888}.battle-finalize-section{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #333;text-align:center}.battle-participants-summary{background:#1a1a2e;border-radius:12px;padding:1.5rem;margin-bottom:2rem;border:1px solid #333}.battle-participants-summary h4{color:gold;margin:0 0 1rem}.participants-list-compact{display:flex;flex-wrap:wrap;gap:.5rem}.participant-badge{padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500}.participant-badge.attended{background:#28a74533;color:#28a745;border:1px solid rgba(40,167,69,.3)}.participant-badge.absent{background:#6c757d33;color:#888;border:1px solid rgba(108,117,125,.3);text-decoration:line-through}.result-options{display:flex;gap:1rem;margin-top:.5rem}.result-btn{flex:1;padding:1rem;border:2px solid #333;border-radius:8px;background:#1a1a2e;color:#888;font-weight:700;cursor:pointer;transition:all .2s ease}.result-btn:hover{border-color:#555}.result-btn.victory{border-color:#28a7454d}.result-btn.victory.selected{background:#28a74533;border-color:#28a745;color:#28a745}.result-btn.defeat{border-color:#dc35454d}.result-btn.defeat.selected{background:#dc354533;border-color:#dc3545;color:#dc3545}.result-btn.draw{border-color:#6c757d4d}.result-btn.draw.selected{background:#6c757d33;border-color:#6c757d;color:#adb5bd}.modal-description{color:#888;margin-bottom:1.5rem;line-height:1.5}.day-availability-checkboxes{display:flex;gap:1.5rem;padding:.5rem 0}.day-availability-checkboxes .checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-weight:500}.day-availability-checkboxes input[type=checkbox]{width:18px;height:18px;accent-color:#667eea;cursor:pointer}.day-availability-checkboxes .day-sat{color:#4dabf7}.day-availability-checkboxes .day-sun{color:#ff6b6b}.day-badge{display:inline-block;padding:.2rem .4rem;border-radius:4px;font-size:.7rem;font-weight:600;margin-right:.25rem}.day-badge.saturday{background:#4dabf733;color:#4dabf7}.day-badge.sunday{background:#ff6b6b33;color:#ff6b6b}.day-badge.inactive{opacity:.3}.articles-list{display:flex;flex-direction:column;gap:1rem}.article-card{background:#1a1a2e;border-radius:12px;padding:1.25rem;border:1px solid #333;transition:all .2s ease}.article-card:hover{border-color:#667eea;box-shadow:0 4px 20px #667eea26}.article-card.inactive{opacity:.6;background:#12121a}.article-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;gap:1rem}.article-title-row{display:flex;align-items:center;gap:.75rem;flex:1}.article-order{font-size:.85rem;color:#888;font-weight:600;background:#667eea26;padding:.25rem .5rem;border-radius:4px}.article-title{font-size:1.1rem;font-weight:600;color:#fff;margin:0}.article-status{font-size:.75rem;font-weight:600;padding:.25rem .75rem;border-radius:12px;text-transform:uppercase}.article-status.active{background:#28a74533;color:#28a745}.article-status.inactive{background:#6c757d33;color:#6c757d}.article-actions{display:flex;gap:.5rem;flex-shrink:0}.article-actions button{padding:.375rem .75rem;font-size:.8rem;border-radius:6px;border:none;cursor:pointer;font-weight:500;transition:all .2s ease}.btn-edit{background:#667eea33;color:#667eea}.btn-edit:hover{background:#667eea4d}.btn-toggle{background:#ffc10733;color:#ffc107}.btn-toggle:hover{background:#ffc1074d}.article-content{margin-bottom:1rem}.article-content p{color:#ccc;line-height:1.6;margin:0;white-space:pre-wrap}.article-meta{display:flex;justify-content:flex-end;gap:1rem}.article-date{font-size:.8rem;color:#888}.form-group .checkbox-label{display:flex;align-items:center;gap:.75rem;cursor:pointer;color:#ccc}.form-group .checkbox-label input[type=checkbox]{width:18px;height:18px;accent-color:#667eea;cursor:pointer}.form-group textarea{width:100%;padding:.75rem;background:#0d0d15;border:1px solid #333;border-radius:8px;color:#fff;font-size:.95rem;resize:vertical;min-height:120px;font-family:inherit}.form-group textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea26}.accounts-stats{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.accounts-stats .stat-card{background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid #333;border-radius:12px;padding:1rem 1.5rem;min-width:100px;text-align:center}.accounts-stats .stat-number{display:block;font-size:1.75rem;font-weight:700;color:#b8860b}.accounts-stats .stat-label{display:block;font-size:.85rem;color:#888;margin-top:.25rem}.accounts-table-container,.activity-log-container{overflow-x:auto;border-radius:12px;border:1px solid #333;background:#1a1a2e}.accounts-table,.activity-table{width:100%;border-collapse:collapse;min-width:800px}.accounts-table th,.accounts-table td,.activity-table th,.activity-table td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid #333}.accounts-table th,.activity-table th{background:#16213e;color:#b8860b;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px}.accounts-table tbody tr:hover,.activity-table tbody tr:hover{background:#ffffff05}.accounts-table tbody tr.inactive-row{opacity:.6;background:#ff00000d}.email-cell{font-family:monospace;font-size:.9rem;color:#4dabf7}.date-cell{font-size:.85rem;color:#888;white-space:nowrap}.number-cell{text-align:center;font-weight:600;color:#b8860b}.empty-cell{text-align:center;color:#666;padding:2rem!important}.details-cell{font-family:monospace;font-size:.8rem;color:#666;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.role-badge{display:inline-block;padding:.25rem .6rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase}.role-badge.admin{background:linear-gradient(135deg,#ff6b6b,#ee5a5a);color:#fff}.role-badge.mod{background:linear-gradient(135deg,#4dabf7,#339af0);color:#fff}.role-badge.user{background:#333;color:#888}.status-badge{display:inline-block;padding:.25rem .6rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase}.status-badge.active{background:#51cf6633;color:#51cf66}.status-badge.inactive{background:#ff6b6b33;color:#ff6b6b}.action-badge{display:inline-block;padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:500;background:#333;color:#ccc}.action-badge.login{background:#51cf6633;color:#51cf66}.action-badge.account_deactivated{background:#ff6b6b33;color:#ff6b6b}.action-badge.account_reactivated{background:#4dabf733;color:#4dabf7}.action-badge.profile_updated{background:#ffd43b33;color:#ffd43b}.actions-cell{display:flex;gap:.5rem;flex-wrap:wrap}.actions-cell .btn-edit,.actions-cell .btn-activity,.actions-cell .btn-danger,.actions-cell .btn-success{padding:.35rem .6rem;font-size:.75rem;border-radius:4px;border:none;cursor:pointer;font-weight:500;transition:all .2s ease}.actions-cell .btn-edit{background:#333;color:#ccc}.actions-cell .btn-edit:hover{background:#444;color:#fff}.actions-cell .btn-activity{background:#4dabf733;color:#4dabf7}.actions-cell .btn-activity:hover{background:#4dabf74d}.actions-cell .btn-danger{background:#ff6b6b33;color:#ff6b6b}.actions-cell .btn-danger:hover{background:#ff6b6b4d}.actions-cell .btn-success{background:#51cf6633;color:#51cf66}.actions-cell .btn-success:hover{background:#51cf664d}.activity-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.activity-header h3{margin:0;color:#fff}.role-checkboxes{display:flex;flex-direction:column;gap:.75rem}.role-checkboxes .checkbox-label{display:flex;align-items:center;gap:.75rem;cursor:pointer;color:#ccc}.role-checkboxes .checkbox-label input[type=checkbox]:disabled{opacity:.5;cursor:not-allowed}.role-checkboxes .checkbox-label input[type=checkbox]:disabled+span{opacity:.5}.modal-subtitle{color:#888;font-size:.9rem;margin-top:-.5rem;margin-bottom:1.5rem}.password-change-form{max-width:450px}.profile-info-box{background:#0000004d;padding:1rem;border-radius:8px;margin-bottom:1.5rem;border:1px solid #333}.profile-info-box p{margin:0;color:#ccc}.profile-info-box strong{color:#b8860b}.password-change-form .form-group{margin-bottom:1rem}.password-change-form label{display:block;color:#ccc;font-size:.9rem;margin-bottom:.5rem}.password-change-form input{width:100%;padding:.75rem 1rem;background:#0d0d15;border:1px solid #333;border-radius:8px;color:#fff;font-size:1rem}.password-change-form input:focus{outline:none;border-color:#b8860b}.password-error{background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);color:#ff6b6b;padding:.75rem;border-radius:8px;font-size:.9rem;margin-bottom:1rem}.password-success{background:#51cf661a;border:1px solid rgba(81,207,102,.3);color:#51cf66;padding:.75rem;border-radius:8px;font-size:.9rem;margin-bottom:1rem}.password-change-form .btn-primary{padding:.85rem 2rem;background:linear-gradient(135deg,#b8860b,#8b6914);border:none;border-radius:8px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.password-change-form .btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #b8860b4d}.password-change-form .btn-primary:disabled{opacity:.6;cursor:not-allowed}.login-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;padding:2rem}.login-container{width:100%;max-width:480px}.login-card{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;padding:3rem;animation:slideUp .4s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:2.5rem}.login-header h1{font-size:2rem;color:#333;margin-bottom:.75rem;font-weight:700}.login-header p{color:#666;font-size:1rem}.login-form{margin-bottom:2rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:600;color:#333;margin-bottom:.5rem;font-size:.95rem}.form-group input{width:100%;padding:.875rem 1rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:all .2s ease;font-family:inherit}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input.error{border-color:#e74c3c}.error-message{display:block;color:#e74c3c;font-size:.875rem;margin-top:.375rem}.btn-login{width:100%;padding:1rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 10px #667eea4d}.btn-login:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 15px #667eea66}.btn-login:active:not(:disabled){transform:translateY(0)}.btn-login:disabled{opacity:.6;cursor:not-allowed}.login-footer{text-align:center;padding-top:1.5rem;border-top:1px solid #e0e0e0}.login-footer p{color:#666;margin-bottom:1rem}.link-button{background:none;border:none;color:#667eea;font-weight:600;cursor:pointer;text-decoration:none;padding:0;font-size:inherit}.link-button:hover{text-decoration:underline}.back-link{color:#667eea;text-decoration:none;font-weight:600;display:inline-block;padding:.5rem 1rem;border-radius:6px;transition:all .2s ease}.back-link:hover{background:#667eea1a}@media (max-width: 576px){.login-card{padding:2rem}.login-header h1{font-size:1.5rem}.login-page{padding:1rem}}.mini-games-page{min-height:100vh;background:#000;padding:2rem;padding-top:100px}.mini-games-header{text-align:center;margin-bottom:3rem}.mini-games-header h1{font-size:3rem;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.mini-games-header p{color:#ffffffb3;font-size:1.1rem}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.game-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:20px;overflow:hidden;text-decoration:none;color:#fff;transition:all .3s ease;display:block}.game-card:hover{transform:translateY(-8px);border-color:#667eea80;box-shadow:0 20px 40px #0000004d}.game-card-image{height:180px;background:linear-gradient(135deg,#0a0a0f,#1a1a2e);display:flex;align-items:center;justify-content:center;overflow:hidden}.game-card-image img{width:100%;height:100%;object-fit:cover}.game-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.uno-preview{font-size:4rem;font-weight:900;display:flex;gap:.1em;text-shadow:0 4px 20px rgba(0,0,0,.5)}.uno-preview .u{color:#ff4757;text-shadow:0 4px 0 #c0392b}.uno-preview .n{color:#f1c40f;text-shadow:0 4px 0 #d4ac0d}.uno-preview .o{color:#2ecc71;text-shadow:0 4px 0 #27ae60}.game-card:hover .uno-preview{animation:uno-bounce .5s ease}@keyframes uno-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.binh-preview{display:flex;flex-direction:column;align-items:center;gap:.5rem}.binh-cards{display:flex;gap:.3rem}.binh-cards .card-suit{width:50px;height:70px;background:#fff;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:1.8rem;font-weight:900;box-shadow:0 4px 15px #0006;position:relative}.binh-cards .card-suit.spade{color:#1a1a2e}.binh-cards .card-suit.spade:before{content:"♠";position:absolute;top:4px;left:4px;font-size:.7rem}.binh-cards .card-suit.heart{color:#e74c3c}.binh-cards .card-suit.heart:before{content:"♥";position:absolute;top:4px;left:4px;font-size:.7rem}.binh-cards .card-suit.diamond{color:#e74c3c}.binh-cards .card-suit.diamond:before{content:"♦";position:absolute;top:4px;left:4px;font-size:.7rem}.binh-label{font-size:2rem;font-weight:900;color:#f1c40f;text-shadow:0 2px 10px rgba(241,196,15,.5)}.game-card:hover .binh-preview{animation:binh-bounce .5s ease}@keyframes binh-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.wolf-preview{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;background:linear-gradient(180deg,#0a0a2a,#1a1a4a,#0a0a2a);overflow:hidden}.wolf-preview .wolf-icon{font-size:4rem;z-index:2;animation:wolf-breathe 2s ease-in-out infinite}@keyframes wolf-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.wolf-preview .wolf-moon{position:absolute;top:15px;right:25px;width:50px;height:50px;background:radial-gradient(circle at 30% 30%,#fffde7,#e0e0e0);border-radius:50%;box-shadow:0 0 30px 10px #ffffc866}.wolf-preview:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(2px 2px at 10% 20%,white,transparent),radial-gradient(1px 1px at 30% 40%,white,transparent),radial-gradient(2px 2px at 50% 15%,white,transparent),radial-gradient(1px 1px at 70% 35%,white,transparent),radial-gradient(2px 2px at 85% 25%,white,transparent);opacity:.6}.game-card:hover .wolf-preview .wolf-icon{animation:wolf-howl .6s ease}@keyframes wolf-howl{0%,to{transform:scale(1) rotate(0)}30%{transform:scale(1.2) rotate(-10deg)}70%{transform:scale(1.2) rotate(10deg)}}.game-card-content{padding:1.5rem}.game-card-content h2{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.game-description{color:#fff9;font-size:.9rem;line-height:1.5;margin-bottom:1rem}.game-meta{margin-bottom:1rem}.players-count{display:inline-block;background:#667eea33;color:#667eea;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:600}.game-features{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.feature-tag{background:#ffffff1a;color:#fffc;padding:.25rem .6rem;border-radius:12px;font-size:.75rem;font-weight:500}.play-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.875rem 1.5rem;border-radius:12px;text-align:center;font-weight:700;font-size:1rem;transition:all .2s}.game-card:hover .play-button{transform:scale(1.02);box-shadow:0 4px 20px #667eea66}.coming-soon{text-align:center;margin-top:4rem;padding:3rem;background:#ffffff08;border:1px dashed rgba(255,255,255,.1);border-radius:20px;max-width:600px;margin-left:auto;margin-right:auto}.coming-soon h3{font-size:1.5rem;color:#667eea;margin-bottom:.5rem}.coming-soon p{color:#ffffff80}@media (max-width: 768px){.mini-games-page{padding:1rem;padding-top:80px}.mini-games-header h1{font-size:2rem}.games-grid{grid-template-columns:1fr;gap:1.5rem}.game-card-image{height:150px}.uno-preview{font-size:3rem}.binh-cards .card-suit{width:40px;height:56px;font-size:1.4rem}.binh-label{font-size:1.5rem}}.uno-game{min-height:100vh;background:#0a0a0f;color:#fff;font-family:Outfit,-apple-system,sans-serif;position:relative;overflow:hidden}.back-to-games{position:fixed;top:1rem;left:1rem;display:flex;align-items:center;gap:.5rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.6rem 1rem;border-radius:30px;font-size:.85rem;font-weight:500;cursor:pointer;z-index:100;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.back-to-games:hover{background:#fff3;transform:translate(-3px)}.back-to-games svg{transition:transform .2s}.back-to-games:hover svg{transform:translate(-3px)}.uno-bg{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}.bg-orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:.4}.orb-1{width:400px;height:400px;background:#ef4444;top:-100px;left:-100px}.orb-2{width:300px;height:300px;background:#3b82f6;bottom:-50px;right:-50px}.orb-3{width:250px;height:250px;background:#22c55e;top:50%;left:50%;transform:translate(-50%,-50%)}.game-bg .orb-1,.game-bg .orb-2{opacity:.2}.landing-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;position:relative;z-index:1}.uno-logo{font-size:6rem;font-weight:900;letter-spacing:-.02em;margin-bottom:.5rem;display:flex;gap:.1em}.logo-u,.logo-n,.logo-o{display:inline-block;text-shadow:0 4px 0 rgba(0,0,0,.3),0 8px 20px rgba(0,0,0,.4);transition:transform .3s}.logo-u:hover,.logo-n:hover,.logo-o:hover{transform:translateY(-5px) rotate(-5deg)}.logo-u{color:#ff4757;text-shadow:0 4px 0 #c0392b,0 8px 20px rgba(192,57,43,.4)}.logo-n{color:#f1c40f;text-shadow:0 4px 0 #d4ac0d,0 8px 20px rgba(241,196,15,.4)}.logo-o{color:#2ecc71;text-shadow:0 4px 0 #27ae60,0 8px 20px rgba(39,174,96,.4)}.tagline{font-size:1rem;letter-spacing:.3em;color:#888;margin-bottom:3rem}.connection-status{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#888}.spinner{width:40px;height:40px;border:3px solid #333;border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}.error-msg{background:#dc2626;color:#fff;padding:.75rem 1.5rem;border-radius:8px;margin-bottom:1rem;animation:shake .3s ease}.error-msg.floating{position:fixed;top:1rem;left:50%;transform:translate(-50%);z-index:100}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.menu-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;width:100%;max-width:360px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.input-group label{display:block;font-size:.75rem;letter-spacing:.1em;color:#888;margin-bottom:.5rem}.input-group input,.room-input{width:100%;padding:.875rem 1rem;background:#0006;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:1rem;outline:none;transition:border-color .2s}.input-group input:focus,.room-input:focus{border-color:#3b82f6}.room-input{text-align:center;font-size:1.5rem;letter-spacing:.3em;text-transform:uppercase}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;border:none;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 20px #3b82f666}.btn-ghost{background:transparent;color:#888}.btn-ghost:hover{color:#fff}.btn-sm{padding:.5rem 1rem;font-size:.75rem}.btn-large{padding:1rem 2rem;font-size:1rem}.btn-icon{font-size:1.2em}.btn-uno{background:linear-gradient(145deg,#ff4757,#c0392b);color:#fff;font-weight:900;font-size:1.1rem;padding:.875rem 2rem;border-radius:50px;letter-spacing:.1em;box-shadow:0 4px 15px #c0392b66,inset 0 1px #fff3;transition:all .2s}.btn-uno:hover{transform:scale(1.05);box-shadow:0 6px 25px #c0392b99,inset 0 1px #fff3}.btn-uno:active{transform:scale(.98)}.btn-pass{background:linear-gradient(145deg,#ffffff26,#ffffff0d);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:50px;padding:.875rem 2rem;font-weight:600;transition:all .2s}.btn-pass:hover{background:linear-gradient(145deg,#ffffff40,#ffffff1a)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#1a1a24;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;text-align:center;min-width:300px}.modal-content h3{margin-bottom:1.5rem;font-size:1rem;letter-spacing:.1em}.modal-buttons{display:flex;gap:1rem;margin-top:1.5rem}.lobby-screen{min-height:100vh;padding:2rem;position:relative;z-index:1}.room-info{display:flex;align-items:center;gap:1rem}.room-label{font-size:.75rem;color:#888;letter-spacing:.1em}.room-code{font-size:1.5rem;font-weight:800;letter-spacing:.2em;color:#eab308}.copy-btn{background:#ffffff1a;border:none;color:#fff;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.75rem}.players-section h2{font-size:1rem;letter-spacing:.1em;margin-bottom:1rem;color:#888}.players-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.player-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1rem;display:flex;align-items:center;gap:1rem}.player-card.is-me{border-color:#3b82f6;background:#3b82f61a}.player-card.is-bot{border-style:dashed;border-color:#22c55e}.player-number{width:32px;height:32px;background:#ffffff1a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600}.host-badge,.bot-badge{font-size:.625rem;padding:.25rem .5rem;border-radius:4px;letter-spacing:.05em}.host-badge{background:#eab308;color:#000}.bot-badge{background:#22c55e;color:#000}.lobby-actions{display:flex;flex-direction:column;align-items:center;gap:1rem}.waiting-text{color:#888;font-style:italic}.lobby-table-view{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:1rem;position:relative;z-index:1}.lobby-room-code{display:flex;align-items:center;gap:.75rem;background:#0006;padding:.75rem 1.25rem;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.lobby-room-code .room-label{color:#888;font-size:.85rem}.lobby-room-code .room-code{font-family:Courier New,monospace;font-size:1.25rem;font-weight:700;color:#f1c40f;letter-spacing:.15em}.lobby-room-code .copy-btn{background:#ffffff1a;border:none;color:#fff;padding:.35rem .75rem;border-radius:6px;cursor:pointer;font-size:.75rem;transition:background .2s}.lobby-room-code .copy-btn:hover{background:#fff3}.lobby-table{flex:1;display:flex;align-items:center;justify-content:center;width:100%;max-width:600px;aspect-ratio:1}.circle-player.empty-slot .circle-player-inner.empty{background:#ffffff08;border:2px dashed rgba(255,255,255,.15);min-width:60px;min-height:50px;display:flex;align-items:center;justify-content:center}.slot-number{color:#fff3;font-size:1rem;font-weight:700}.circle-player-inner.lobby-player{padding:.5rem .75rem;gap:.35rem}.lobby-player-avatar{font-size:1.5rem;line-height:1}.host-tag{background:#f1c40f;color:#000;font-size:.55rem;font-weight:700;padding:.1rem .3rem;border-radius:4px;text-transform:uppercase}.bot-tag{background:#22c55e;color:#000;font-size:.55rem;font-weight:700;padding:.1rem .3rem;border-radius:4px}.uno-called-tag{background:linear-gradient(135deg,#f39c12,#e74c3c);color:#fff;font-size:.7rem;font-weight:800;padding:.15rem .4rem;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;animation:pulse-uno .8s ease-in-out infinite;box-shadow:0 2px 8px #f39c1280}@keyframes pulse-uno{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.9}}.uno-penalty-tag{background:#e74c3c;color:#fff;font-size:.6rem;font-weight:700;padding:.1rem .35rem;border-radius:4px;animation:pulse-penalty 1s ease-in-out infinite}@keyframes pulse-penalty{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.circle-player.is-bot .circle-player-inner{border-color:#22c55e}.lobby-table-info{display:flex;flex-direction:column;align-items:center;gap:.5rem}.game-top-bar{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:#00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100}.back-btn-small{background:#ffffff1a;border:none;color:#fff;padding:.5rem;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.back-btn-small:hover{background:#fff3}.room-code-bar{display:flex;align-items:center;gap:.5rem;background:#ffffff0d;padding:.4rem .75rem;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.room-code-bar span{font-family:Courier New,monospace;font-weight:700;color:#f1c40f;letter-spacing:.1em}.copy-btn-sm{background:#ffffff1a;border:none;color:#fff;padding:.25rem .5rem;border-radius:4px;cursor:pointer;font-size:.7rem;transition:background .2s}.copy-btn-sm:hover{background:#fff3}.lobby-center-controls{display:flex;flex-direction:column;align-items:center;gap:1rem;position:relative;z-index:10}.uno-title-center{font-size:2.5rem;font-weight:900;background:linear-gradient(180deg,#ff6b6b,#e74c3c,#c0392b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(2px 2px 0 #f1c40f) drop-shadow(-1px -1px 0 rgba(0,0,0,.8));letter-spacing:.15em;text-transform:uppercase;animation:title-glow 2s ease-in-out infinite}@keyframes title-glow{0%,to{filter:drop-shadow(2px 2px 0 #f1c40f) drop-shadow(0 0 10px rgba(231,76,60,.5))}50%{filter:drop-shadow(2px 2px 0 #f1c40f) drop-shadow(0 0 25px rgba(231,76,60,.8))}}.player-count-center{background:linear-gradient(145deg,#000000b3,#00000080);padding:.4rem 1rem;border-radius:20px;font-size:.85rem;color:gold;font-weight:600;border:1px solid rgba(255,215,0,.3);box-shadow:0 2px 10px #0000004d}.lobby-center-buttons{display:flex;flex-direction:column;gap:.75rem;margin-top:.5rem}.btn-start-center{background:linear-gradient(145deg,#f1c40f,#f39c12,#e67e22);border:2px solid rgba(255,255,255,.3);color:#1a1a1a;padding:.85rem 2rem;border-radius:25px;font-size:1.1rem;font-weight:800;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #f1c40f66,inset 0 1px #fff6,inset 0 -2px #0000001a;text-transform:uppercase;letter-spacing:.1em}.btn-start-center:hover:not(:disabled){transform:translateY(-3px) scale(1.02);box-shadow:0 8px 25px #f1c40f80,inset 0 1px #ffffff80;background:linear-gradient(145deg,#f39c12,#f1c40f,#f39c12)}.btn-start-center:active:not(:disabled){transform:translateY(0)}.btn-start-center:disabled{opacity:.4;cursor:not-allowed;filter:grayscale(.5)}.btn-bot-center{background:linear-gradient(145deg,#ffffff26,#ffffff0d);border:1px solid rgba(255,215,0,.3);color:gold;padding:.6rem 1.2rem;border-radius:20px;font-size:.85rem;font-weight:700;cursor:pointer;transition:all .3s;text-transform:uppercase;letter-spacing:.05em}.btn-bot-center:hover{background:linear-gradient(145deg,#ffd70033,#ffd7001a);border-color:#ffd70080;box-shadow:0 0 15px #ffd70033}.waiting-center{color:#fff9;font-size:.85rem;font-style:italic;margin-top:.5rem}.game-screen{min-height:100vh;display:flex;flex-direction:column;padding:1rem;position:relative;z-index:1}.game-screen.circular-layout{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:.5rem;padding-top:60px;gap:0;overflow:hidden}.circle-table-container{position:relative;width:100%;max-width:600px;height:55vh;display:flex;align-items:center;justify-content:center;margin:0 auto;animation:ambient-light 8s ease-in-out infinite}@keyframes ambient-light{0%,to{filter:brightness(1)}50%{filter:brightness(1.02)}}.circle-player{position:absolute;transform:translate(-50%,-50%);z-index:10;transition:left .4s ease,top .4s ease}.circle-player-inner{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.4rem .6rem;background:linear-gradient(145deg,#14141ee6,#0a0a0ff2);border:2px solid rgba(255,255,255,.1);border-radius:10px;min-width:70px;box-shadow:0 4px 15px #00000080}.circle-player.active-turn .circle-player-inner{border-color:#f1c40f;box-shadow:0 0 20px #f1c40f66,0 0 40px #f1c40f33;animation:pulse-glow 1.5s ease-in-out infinite}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px #f1c40f66,0 0 40px #f1c40f33}50%{box-shadow:0 0 30px #f1c40f99,0 0 60px #f1c40f4d}}.circle-player-cards{display:flex;justify-content:center;position:relative;height:50px;min-width:60px}.circle-player-cards.fanned{display:flex;justify-content:center;align-items:flex-end}.circle-player-cards.fanned .card-back-mini{position:absolute;left:50%;margin-left:-16px;transform-origin:bottom center;transition:transform .2s ease}.more-cards{position:absolute;right:-15px;top:-8px;background:#e74c3c;color:#fff;font-size:.65rem;font-weight:700;padding:2px 5px;border-radius:8px;z-index:20;box-shadow:0 2px 4px #0000004d}.circle-player-inner:hover .circle-player-cards.fanned .card-back-mini{transform:var(--hover-transform, inherit)}.circle-player-info{display:flex;align-items:center;gap:.4rem}.circle-player-name{font-size:.7rem;font-weight:600;color:#fff;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.circle-player.active-turn .circle-player-name{color:#f1c40f}.circle-player.is-me .circle-player-inner{border-color:#3498db;background:linear-gradient(145deg,#3498db33,#2980b926)}.circle-player.is-me .circle-player-name{color:#3498db}.circle-player.is-me.active-turn .circle-player-inner{border-color:#2ecc71;box-shadow:0 0 25px #2ecc7180,0 0 50px #2ecc714d}.circle-player.is-me.active-turn .circle-player-name{color:#2ecc71}.circle-player-count{background:#ffffff26;padding:.1rem .35rem;border-radius:8px;font-size:.6rem;font-weight:700;color:#fffc}.circle-center{position:relative;width:50%;aspect-ratio:1;z-index:5}.table-felt{width:100%;height:100%;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:.5rem;position:relative;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.06'/%3E%3C/svg%3E"),radial-gradient(ellipse at 50% 30%,rgba(255,255,255,.08) 0%,transparent 50%),radial-gradient(ellipse at center,#1f7a4d,#176b40,#125a35,#0e4a2b,#0a3a21);box-shadow:inset 0 0 40px #0006,inset 0 0 80px #0003,0 0 0 4px #8b5a2b,0 0 0 6px #654321,0 0 0 18px #5d3a1a,0 0 0 20px #8b5a2b,0 0 0 22px #6b4423,0 0 0 24px #b8860b,0 0 0 26px #8b6914,0 0 0 28px #3d2314,0 15px 50px #00000080,0 30px 80px #0000004d}.table-felt:before{content:"";position:absolute;top:-28px;right:-28px;bottom:-28px;left:-28px;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,.05) 25%,transparent 50%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.15) 100%);pointer-events:none;z-index:-1}.table-felt:after{content:"";position:absolute;top:12%;right:12%;bottom:12%;left:12%;border-radius:50%;border:2px solid rgba(212,175,55,.2);box-shadow:0 0 15px #d4af371a,inset 0 0 15px #d4af370d;pointer-events:none}.circle-game-info{display:flex;align-items:center;gap:.5rem;position:absolute;top:12%;left:50%;transform:translate(-50%);padding:.4rem .8rem;background:linear-gradient(145deg,#0009,#0006);border-radius:20px;border:1px solid rgba(255,215,0,.3);box-shadow:0 2px 10px #0006,inset 0 1px #ffffff1a;z-index:15}.circle-game-info .current-color{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.4);box-shadow:0 0 10px currentColor}.circle-game-info .turn-name{font-size:.7rem;font-weight:700;color:gold;text-shadow:0 1px 2px rgba(0,0,0,.5);white-space:nowrap;letter-spacing:.5px}.table-felt .draw-pile,.table-felt .discard-pile{transform:scale(.9);position:relative;z-index:10}.table-felt .draw-pile .card-back,.table-felt .discard-pile .uno-card{box-shadow:0 4px 8px #0006,0 8px 16px #0003}.circle-me{position:absolute;bottom:3%;left:50%;transform:translate(-50%);z-index:10}.circle-me-info{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.4rem .8rem;background:linear-gradient(145deg,#2d2d3ce6,#191923f2);border:2px solid rgba(255,255,255,.15);border-radius:10px;box-shadow:0 4px 15px #0006}.circle-me.my-turn .circle-me-info{border-color:#2ecc71;box-shadow:0 0 25px #2ecc7166,0 0 50px #2ecc7133;animation:my-turn-pulse 1.5s ease-in-out infinite}@keyframes my-turn-pulse{0%,to{box-shadow:0 0 25px #2ecc7166,0 0 50px #2ecc7133}50%{box-shadow:0 0 35px #2ecc7199,0 0 70px #2ecc714d}}.me-name{font-size:.8rem;font-weight:700;color:#fff}.circle-me.my-turn .me-name{color:#2ecc71}.me-count{font-size:.65rem;color:#fff9}.opponents-area{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;padding:1rem}.opponent{background:linear-gradient(145deg,#14141ecc,#0a0a0fe6);border:2px solid rgba(255,255,255,.08);border-radius:16px;padding:1rem 1.25rem;min-width:160px;transition:all .3s;box-shadow:0 4px 15px #0000004d}.opponent.active-turn{border-color:#f1c40f;box-shadow:0 0 30px #f1c40f4d,inset 0 0 20px #f1c40f0d}.opponent.active-turn .opponent-name{color:#f1c40f}.opponent-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.opponent-name{font-weight:700;font-size:.9rem;transition:color .3s}.opponent-cards{font-size:.75rem;color:#ffffff80;font-weight:500}.opponent-hand{display:flex;gap:3px}.card-back-mini{width:32px;height:45px;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f0f23);border:2px solid #e74c3c;border-radius:5px;position:relative;box-shadow:2px 2px 5px #00000080,inset 0 0 10px #e74c3c26;flex-shrink:0}.card-back-mini:before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border:1.5px solid rgba(231,76,60,.4);border-radius:3px}.card-back-mini:after{content:"U";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:14px;font-weight:900;color:#e74c3c;text-shadow:0 0 6px rgba(231,76,60,.6)}.game-table{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.table-center{display:flex;gap:3rem;align-items:center;padding:2.5rem 3.5rem;background:radial-gradient(ellipse at center,rgba(39,174,96,.4) 0%,rgba(30,132,73,.3) 50%,transparent 70%),linear-gradient(135deg,#27ae6033,#1e844926);border-radius:120px;border:4px solid rgba(39,174,96,.4);box-shadow:inset 0 0 60px #0000004d,0 10px 40px #0006;position:relative}.table-center:before{content:"";position:absolute;top:8px;right:8px;bottom:8px;left:8px;border:2px dashed rgba(255,255,255,.1);border-radius:110px;pointer-events:none}.draw-pile,.discard-pile{display:flex;flex-direction:column;align-items:center;gap:.75rem}.draw-pile{cursor:pointer;position:relative}.draw-pile.must-draw{animation:pulse-must-draw .8s ease-in-out infinite}.draw-pile.must-draw .card-back{box-shadow:0 0 20px #e74c3ccc,0 0 40px #e74c3c66;border:3px solid #e74c3c}@keyframes pulse-must-draw{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.must-draw-label{position:absolute;bottom:-25px;left:50%;transform:translate(-50%);background:#e74c3c;color:#fff;font-size:.7rem;font-weight:800;padding:.25rem .5rem;border-radius:4px;white-space:nowrap;animation:bounce-label .5s ease-in-out infinite}@keyframes bounce-label{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-3px)}}.pile-label{font-size:.7rem;font-weight:600;letter-spacing:.15em;color:#fff9;text-transform:uppercase}.uno-card{width:90px;height:135px;border-radius:12px;position:relative;cursor:pointer;transition:transform .2s,box-shadow .2s;font-weight:800;box-shadow:0 2px 4px #0003,0 8px 16px #0000004d,inset 0 1px #fff3;overflow:hidden;transform-style:preserve-3d}.uno-card:before{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border:2px solid rgba(255,255,255,.3);border-radius:10px;pointer-events:none}.uno-card.small{width:65px;height:97px;border-radius:8px}.uno-card.small .card-oval{width:45px;height:70px}.uno-card.small .card-value{font-size:1.75rem}.uno-card.small .card-corner{font-size:.6rem}.uno-card:hover:not(.not-playable){transform:translateY(-15px) rotateX(5deg);box-shadow:0 4px 8px #0003,0 20px 40px #0006}.uno-card.can-drag{cursor:grab}.uno-card.can-drag:active{cursor:grabbing}.uno-card.dragging{opacity:.5;transform:scale(1.1) rotate(5deg);box-shadow:0 10px 30px #0006,0 0 40px #fff3;z-index:1000}.uno-card.not-playable{filter:brightness(.6) saturate(.5);cursor:not-allowed}.uno-card.not-playable:hover{transform:none}.discard-pile{position:relative;transition:transform .2s,box-shadow .2s}.discard-pile.drag-active{transform:scale(1.05);box-shadow:0 0 20px #22c55e66}.discard-pile.drag-active:before{content:"";position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border:3px dashed rgba(34,197,94,.6);border-radius:16px;animation:pulse-border 1s ease infinite}.discard-pile.drag-hover{transform:scale(1.15);box-shadow:0 0 40px #22c55ecc}.discard-pile.drag-hover:before{border-color:#22c55e;animation:pulse-border .4s ease infinite}@keyframes pulse-border{0%,to{opacity:1}50%{opacity:.5}}.drop-indicator{position:absolute;top:-30px;left:50%;transform:translate(-50%);background:#22c55ef2;color:#fff;padding:.5rem 1rem;border-radius:20px;font-size:.75rem;font-weight:700;letter-spacing:.1em;white-space:nowrap;z-index:10;animation:float-bounce .5s ease;box-shadow:0 4px 15px #22c55e66}.discard-pile.drag-hover .drop-indicator{background:#22c55e;box-shadow:0 4px 20px #22c55e99;animation:pulse-indicator .3s ease}@keyframes float-bounce{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes pulse-indicator{0%{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.1)}to{transform:translate(-50%) scale(1)}}.discard-pile.first-turn{min-width:70px;min-height:100px}.first-turn-prompt{display:flex;align-items:center;justify-content:center;width:70px;height:100px;background:linear-gradient(145deg,#ffd7004d,#ffa50033);border:3px dashed rgba(255,215,0,.8);border-radius:10px;animation:pulse-first-turn 1.5s ease-in-out infinite}.first-turn-prompt span{color:gold;font-size:.8rem;font-weight:700;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.5)}@keyframes pulse-first-turn{0%,to{transform:scale(1);box-shadow:0 0 10px #ffd7004d}50%{transform:scale(1.05);box-shadow:0 0 25px #ffd70099}}@keyframes card-fly-to-discard{0%{transform:translateY(0) scale(1);opacity:1}50%{transform:translateY(-100px) scale(1.2) rotate(10deg);opacity:1}to{transform:translateY(-200px) scale(.8) rotate(0);opacity:0}}.card-playing{animation:card-fly-to-discard .4s ease forwards;pointer-events:none}.just-drawn{animation:drawn-pulse 1s ease infinite;box-shadow:0 0 20px 5px #ffd700cc,0 0 40px 10px #ffd70066!important;transform:translateY(-15px)!important;z-index:20!important;position:relative}.just-drawn:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border:3px solid gold;border-radius:10px;pointer-events:none}@keyframes drawn-pulse{0%,to{box-shadow:0 0 20px 5px #ffd700cc,0 0 40px 10px #ffd70066}50%{box-shadow:0 0 30px 10px gold,0 0 60px 20px #ffd70099}}.drawn-badge{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:gold;color:#000;font-size:.6rem;font-weight:700;padding:2px 8px;border-radius:10px;white-space:nowrap;z-index:30;animation:badge-bounce .5s ease infinite alternate}@keyframes badge-bounce{0%{transform:translate(-50%) translateY(0)}to{transform:translate(-50%) translateY(-3px)}}.locked-out{opacity:.4!important;filter:grayscale(50%);pointer-events:none;transform:translateY(0)!important}.locked-out:hover{transform:translateY(0)!important}@keyframes card-enter{0%{transform:translateY(-50px) scale(.5) rotate(-20deg);opacity:0}60%{transform:translateY(10px) scale(1.05) rotate(5deg)}to{transform:translateY(0) scale(1) rotate(0);opacity:1}}.player-hand .uno-card{animation:card-enter .4s ease backwards}.player-hand .uno-card:nth-child(1){animation-delay:0ms}.player-hand .uno-card:nth-child(2){animation-delay:50ms}.player-hand .uno-card:nth-child(3){animation-delay:.1s}.player-hand .uno-card:nth-child(4){animation-delay:.15s}.player-hand .uno-card:nth-child(5){animation-delay:.2s}.player-hand .uno-card:nth-child(6){animation-delay:.25s}.player-hand .uno-card:nth-child(7){animation-delay:.3s}.player-hand .uno-card:nth-child(8){animation-delay:.35s}.player-hand .uno-card:nth-child(9){animation-delay:.4s}.player-hand .uno-card:nth-child(10){animation-delay:.45s}.player-hand .uno-card.can-drag:hover{transform:translateY(-20px) scale(1.08);z-index:10}@keyframes card-shake{0%,to{transform:translate(0)}20%{transform:translate(-5px) rotate(-2deg)}40%{transform:translate(5px) rotate(2deg)}60%{transform:translate(-5px) rotate(-2deg)}80%{transform:translate(5px) rotate(2deg)}}.uno-card.shake{animation:card-shake .4s ease}@keyframes card-flip-in{0%{transform:rotateY(90deg) scale(.8);opacity:0}to{transform:rotateY(0) scale(1);opacity:1}}.discard-pile .uno-card{animation:card-flip-in .3s ease}.color-red{background:linear-gradient(145deg,#ff4757,#c0392b,#a93226);color:#fff}.color-blue{background:linear-gradient(145deg,#4facfe,#2980b9,#1a5276);color:#fff}.color-green{background:linear-gradient(145deg,#32ff7e,#27ae60,#1e8449);color:#fff}.color-yellow{background:linear-gradient(145deg,#ffeaa7,#f1c40f,#d4ac0d);color:#1a1a1a}.color-wild{background:conic-gradient(from 45deg,#c0392b,#c0392b 90deg,#2980b9 90deg,#2980b9 180deg,#f1c40f 180deg,#f1c40f 270deg,#27ae60 270deg,#27ae60 360deg);color:#fff}.card-inner{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.card-corner{position:absolute;font-size:.85rem;font-weight:900;text-shadow:1px 1px 0 rgba(0,0,0,.3),-1px -1px 0 rgba(255,255,255,.1);line-height:1}.card-corner.top-left{top:6px;left:8px}.card-corner.bottom-right{bottom:6px;right:8px;transform:rotate(180deg)}.card-oval{width:60px;height:90px;background:#fffffff2;border-radius:50%;display:flex;align-items:center;justify-content:center;transform:rotate(-25deg);box-shadow:inset 0 2px 8px #0000001a,0 2px 4px #0003;position:relative;overflow:hidden}.card-oval:before{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:50%;border:2px solid currentColor;opacity:.3}.color-red .card-oval{color:#c0392b}.color-blue .card-oval{color:#2980b9}.color-green .card-oval{color:#27ae60}.color-yellow .card-oval{color:#d4ac0d}.color-wild .card-oval{background:linear-gradient(135deg,#c0392b 25%,#2980b9 25%,#2980b9 50%,#27ae60 50%,#27ae60 75%,#f1c40f 75%);color:#fff}.card-value{font-size:2.5rem;font-weight:900;transform:rotate(25deg);text-shadow:2px 2px 0 rgba(0,0,0,.15),-1px -1px 0 rgba(255,255,255,.3);line-height:1}.color-wild .card-value{text-shadow:2px 2px 0 rgba(0,0,0,.4),0 0 10px rgba(255,255,255,.5)}.wild-quarters{display:none}.uno-card[class*=skip] .card-value,.uno-card[class*=reverse] .card-value{font-size:2rem}.card-back{width:90px;height:135px;background:linear-gradient(145deg,#2c2c2c,#1a1a1a,#0d0d0d);border-radius:12px;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 2px 4px #0003,0 8px 16px #0000004d,inset 0 1px #ffffff1a;overflow:hidden;transition:transform .2s}.card-back:before{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;border:3px solid #333;border-radius:8px}.card-back:after{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;background:linear-gradient(145deg,#c0392b,#c0392b 25%,#27ae60 25%,#27ae60 50%,#2980b9 50%,#2980b9 75%,#f1c40f 75%,#f1c40f);border-radius:50%;transform:rotate(-25deg)}.card-back span{position:relative;z-index:1;font-size:1.25rem;font-weight:900;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5);letter-spacing:-.05em}.draw-pile:hover .card-back{transform:scale(1.05);box-shadow:0 4px 8px #0003,0 16px 32px #0006}.game-info{display:flex;align-items:center;gap:2rem;margin-top:2rem;padding:1rem 2rem;background:#0000004d;border-radius:50px;border:1px solid rgba(255,255,255,.1)}.current-color{width:55px;height:55px;border-radius:50%;border:4px solid rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;font-size:.55rem;font-weight:700;letter-spacing:.05em;box-shadow:0 4px 12px #0000004d,inset 0 2px 4px #fff3;transition:all .3s}.current-color.color-red{background:linear-gradient(145deg,#ff4757,#c0392b);box-shadow:0 4px 20px #c0392b80}.current-color.color-blue{background:linear-gradient(145deg,#4facfe,#2980b9);box-shadow:0 4px 20px #2980b980}.current-color.color-green{background:linear-gradient(145deg,#32ff7e,#27ae60);box-shadow:0 4px 20px #27ae6080}.current-color.color-yellow{background:linear-gradient(145deg,#ffeaa7,#f1c40f);box-shadow:0 4px 20px #f1c40f80}.turn-indicator{text-align:center}.turn-label{display:block;font-size:.65rem;color:#ffffff80;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.25rem}.turn-player{font-size:1.35rem;font-weight:700;background:linear-gradient(135deg,#fff,#ccc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.direction-indicator{font-size:1.75rem;transition:transform .3s,color .3s;opacity:.8}.direction-indicator.reversed{color:#ff4757;transform:scaleY(-1)}.player-hand-area{padding:1.5rem 1rem;background:linear-gradient(180deg,#0006,#0009);border-top:1px solid rgba(255,255,255,.1);position:relative}.player-hand-area:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent)}.hand-controls{display:flex;justify-content:center;gap:1rem;margin-bottom:1.25rem}.player-hand{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;padding:1rem;min-height:160px}.your-turn-indicator{text-align:center;font-size:.9rem;font-weight:700;color:#f1c40f;text-transform:uppercase;letter-spacing:.2em;animation:pulseGlow 1.5s ease infinite;margin-top:.75rem;text-shadow:0 0 20px rgba(241,196,15,.5)}.your-turn-indicator.penalty{color:#e74c3c;text-shadow:0 0 20px rgba(231,76,60,.5);animation:pulsePenalty .5s ease infinite}@keyframes pulsePenalty{0%,to{opacity:1;text-shadow:0 0 20px rgba(231,76,60,.5)}50%{opacity:.7;text-shadow:0 0 30px rgba(231,76,60,.8)}}@keyframes pulseGlow{0%,to{opacity:1;text-shadow:0 0 20px rgba(241,196,15,.5)}50%{opacity:.7;text-shadow:0 0 30px rgba(241,196,15,.8)}}.color-picker{background:linear-gradient(145deg,#1e1e2e,#14141f);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:2.5rem;text-align:center;box-shadow:0 20px 60px #00000080}.color-picker h3{margin-bottom:2rem;letter-spacing:.2em;font-size:1rem;color:#fffc}.color-options{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}.color-btn{width:70px;height:70px;border:4px solid rgba(255,255,255,.3);border-radius:16px;cursor:pointer;transition:all .2s;box-shadow:0 4px 15px #0000004d}.color-btn:hover{transform:scale(1.1) rotate(5deg);border-color:#fff9}.color-btn:active{transform:scale(.95)}.color-btn.red{background:linear-gradient(145deg,#ff4757,#c0392b);box-shadow:0 4px 20px #c0392b80}.color-btn.blue{background:linear-gradient(145deg,#4facfe,#2980b9);box-shadow:0 4px 20px #2980b980}.color-btn.green{background:linear-gradient(145deg,#32ff7e,#27ae60);box-shadow:0 4px 20px #27ae6080}.color-btn.yellow{background:linear-gradient(145deg,#ffeaa7,#f1c40f);box-shadow:0 4px 20px #f1c40f80}.game-over{background:linear-gradient(145deg,#1e1e2e,#14141f);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:3rem 4rem;text-align:center;box-shadow:0 20px 60px #00000080}.game-over h2{font-size:1.25rem;margin-bottom:2rem;letter-spacing:.2em;color:#ffffffb3}.winner-display{margin-bottom:2.5rem;padding:1.5rem;background:#f1c40f1a;border-radius:16px;border:1px solid rgba(241,196,15,.2)}.winner-label{display:block;font-size:.7rem;color:#ffffff80;letter-spacing:.15em;margin-bottom:.75rem;text-transform:uppercase}.winner-name{font-size:2.5rem;font-weight:900;background:linear-gradient(135deg,#ffeaa7,#f1c40f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none;filter:drop-shadow(0 2px 4px rgba(241,196,15,.3))}.game-over-buttons{display:flex;gap:1rem;justify-content:center}.chat-panel{position:fixed;bottom:1rem;right:1rem;width:280px;background:#000c;border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;z-index:40}.chat-messages{height:150px;overflow-y:auto;padding:.75rem}.chat-msg{font-size:.75rem;padding:.25rem 0;border-bottom:1px solid rgba(255,255,255,.05)}.chat-msg.system{color:#eab308;font-style:italic}.chat-input{display:flex;border-top:1px solid rgba(255,255,255,.1)}.chat-input input{flex:1;background:transparent;border:none;padding:.75rem;color:#fff;font-size:.75rem;outline:none}.chat-input button{background:#3b82f6;border:none;color:#fff;padding:.75rem 1rem;cursor:pointer;font-size:.75rem}@media (max-width: 768px){.uno-logo{font-size:3.5rem}.game-table{padding:1rem}.table-center{flex-direction:column;gap:1rem;padding:1.5rem}.uno-card{width:60px;height:90px}.card-center{font-size:1.25rem}.chat-panel{width:100%;right:0;bottom:0;border-radius:12px 12px 0 0}.opponents-area{gap:.5rem}.opponent{min-width:120px;padding:.5rem}.circle-table-container{height:50vh;max-width:100%}.circle-player-inner{padding:.3rem .4rem;min-width:55px}.circle-player-name{font-size:.6rem;max-width:45px}.circle-player-count{font-size:.55rem;padding:.05rem .25rem}.card-back-mini{width:24px;height:34px}.circle-player-cards{height:38px;min-width:45px}.circle-player-cards.fanned .card-back-mini{margin-left:-12px}.circle-center{width:45%}.table-felt{box-shadow:inset 0 0 30px #0006,inset 0 0 60px #0003,0 0 0 3px #8b5a2b,0 0 0 4px #654321,0 0 0 12px #5d3a1a,0 0 0 14px #8b5a2b,0 0 0 16px #b8860b,0 0 0 18px #3d2314,0 10px 35px #00000080}.table-felt:before{top:-18px;right:-18px;bottom:-18px;left:-18px}.table-felt .draw-pile,.table-felt .discard-pile{transform:scale(.7)}.circle-game-info .turn-name{font-size:.55rem}.circle-me-info{padding:.3rem .6rem}.me-name{font-size:.7rem}.player-hand-area{padding:.5rem}.player-hand{gap:.25rem}}.uno-settings-panel{width:100%;max-width:600px;margin:0 auto;padding:1rem 1.5rem;background:#14141ee6;border:1px solid rgba(255,255,255,.1);border-radius:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-height:50vh;overflow-y:auto}.settings-title{font-family:Syne,sans-serif;font-size:16px;letter-spacing:3px;color:#a855f7;margin-bottom:12px;text-align:center}.settings-grid{display:flex;flex-direction:column;gap:12px}.setting-row{background:#ffffff08;border-radius:10px;padding:10px 14px}.setting-q{display:block;font-size:13px;font-weight:600;color:#eee;margin-bottom:8px}.setting-opts{display:flex;flex-direction:column;gap:6px}.radio-opt{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:8px;font-size:12px;color:#888;cursor:pointer;transition:all .2s}.radio-opt.active{color:#fff;background:#a855f71f}.radio-opt input[type=radio]{accent-color:#a855f7;width:14px;height:14px}.radio-opt input[type=radio]:disabled{opacity:.5}.score-input-row{flex-direction:row!important;align-items:center;gap:12px}.score-input{width:90px;padding:8px 12px;font-size:16px;font-weight:600;background:#0a0a0fcc;border:2px solid rgba(255,255,255,.15);border-radius:8px;color:#fff;text-align:center}.score-input:focus{outline:none;border-color:#a855f7}.score-input:disabled{opacity:.5}.score-hint{font-size:11px;color:#666}.scoreboard{width:100%;margin:12px 0}.score-row{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;border-radius:6px;margin-bottom:3px;background:#ffffff0a;font-size:13px}.score-row.is-winner{background:#a855f733;border:1px solid rgba(168,85,247,.3)}.score-val{font-weight:700;font-size:16px;color:#06b6d4}.round-score-info{margin:8px 0 12px}.score-earned{font-size:28px;font-weight:800;color:#ffd534}.multi-play-bar{display:flex;justify-content:center;gap:10px;padding:8px}.btn-multi-play{padding:10px 24px;font-size:14px;font-weight:700;letter-spacing:1px}.btn-multi-cancel{padding:10px 16px;font-size:13px}.uno-card.multi-selected{transform:translateY(-16px)!important;box-shadow:0 0 20px #2dd36fcc!important;border:2px solid #2dd36f!important}@media (max-width: 768px){.uno-settings-panel{padding:.75rem 1rem;max-height:40vh}.setting-q{font-size:12px}.radio-opt{font-size:11px;padding:4px 8px}}.binh-game{min-height:100vh;background:#0a0a0f;color:#fff;font-family:Outfit,-apple-system,sans-serif;position:relative;overflow:hidden}.binh-game .back-to-games{position:fixed;top:1rem;left:1rem;display:flex;align-items:center;gap:.5rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.6rem 1rem;border-radius:30px;font-size:.85rem;font-weight:500;cursor:pointer;z-index:100;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.binh-game .back-to-games:hover{background:#fff3;transform:translate(-3px)}.binh-bg{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.binh-bg .bg-orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:.3}.binh-bg .orb-1{width:400px;height:400px;background:linear-gradient(135deg,#e74c3c,#c0392b);top:-100px;right:-100px}.binh-bg .orb-2{width:300px;height:300px;background:linear-gradient(135deg,#f1c40f,#f39c12);bottom:-50px;left:-50px}.binh-bg .orb-3{width:200px;height:200px;background:linear-gradient(135deg,#3498db,#2980b9);top:50%;left:50%;transform:translate(-50%,-50%)}.landing-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;z-index:10;position:relative}.binh-logo{text-align:center;margin-bottom:2rem}.binh-logo .logo-cards{display:flex;justify-content:center;gap:.5rem;margin-bottom:1rem}.binh-logo .card{width:60px;height:85px;background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:900;box-shadow:0 8px 25px #0006;transition:transform .3s ease}.binh-logo .card:hover{transform:translateY(-8px)}.binh-logo .card.spade{color:#1a1a2e;transform:rotate(-8deg)}.binh-logo .card.heart{color:#e74c3c;z-index:2}.binh-logo .card.diamond{color:#e74c3c;transform:rotate(8deg)}.binh-logo h1{font-size:3rem;font-weight:900;background:linear-gradient(135deg,#f1c40f,#e74c3c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.binh-logo .tagline{color:#fff9;font-size:1rem}.connection-status{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#ffffffb3}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:#f1c40f;border-radius:50%;animation:spin 1s linear infinite}.error-msg{background:#e74c3c33;border:1px solid #e74c3c;color:#e74c3c;padding:.75rem 1.5rem;border-radius:8px;margin-bottom:1rem;text-align:center}.menu-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2rem;width:100%;max-width:350px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.input-group label{display:block;font-size:.85rem;color:#fff9;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.1em}.input-group input{width:100%;padding:.875rem 1rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:10px;color:#fff;font-size:1rem;outline:none;transition:all .2s}.input-group input:focus{border-color:#f1c40f;background:#ffffff26}.btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;border-radius:12px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease;border:none;outline:none}.btn-icon{font-size:1.2rem}.btn-primary{background:linear-gradient(135deg,#f1c40f,#e67e22);color:#000}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 20px #f1c40f66}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary:hover{background:#fff3}.btn-ghost{background:transparent;color:#ffffffb3}.btn-ghost:hover{color:#fff;background:#ffffff1a}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:200;padding:1rem}.modal-content{background:#1a1a2e;border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2rem;width:100%;max-width:320px;text-align:center}.modal-content h3{font-size:1.25rem;margin-bottom:1.5rem;color:#f1c40f}.room-input{width:100%;padding:1rem;font-size:2rem;text-align:center;letter-spacing:.5em;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;outline:none;margin-bottom:1.5rem}.room-input:focus{border-color:#f1c40f}.modal-buttons{display:flex;gap:.75rem}.lobby-screen{display:flex;flex-direction:column;min-height:100vh;padding:5rem 2rem 2rem;max-width:600px;margin:0 auto;position:relative;z-index:10}.lobby-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.room-info{display:flex;align-items:center;gap:.75rem}.room-label{font-size:.8rem;color:#ffffff80;text-transform:uppercase}.room-code{font-size:1.5rem;font-weight:700;letter-spacing:.2em;color:#f1c40f}.copy-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.4rem .8rem;border-radius:6px;font-size:.75rem;cursor:pointer;transition:all .2s}.copy-btn:hover{background:#fff3}.players-section{flex:1}.players-section h2{font-size:1.25rem;margin-bottom:1rem;color:#fffc}.players-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.player-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1rem;display:flex;align-items:center;gap:.75rem}.player-card.is-me{border-color:#f1c40f;background:#f1c40f1a}.player-card.empty{opacity:.4;border-style:dashed}.player-number{width:32px;height:32px;background:#ffffff1a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700}.player-name{flex:1;font-weight:500}.host-badge{background:#f1c40f;color:#000;padding:.2rem .5rem;border-radius:4px;font-size:.7rem;font-weight:700}.player-total-score{margin-left:auto;font-weight:700;font-size:.9rem;padding:.2rem .6rem;border-radius:4px;background:#ffffff1a}.player-total-score.positive{color:#2ecc71}.player-total-score.negative{color:#e74c3c}.lobby-actions{margin-top:2rem;text-align:center}.waiting-text{color:#ffffff80;font-style:italic}.game-screen{display:flex;flex-direction:column;min-height:100vh;position:relative;z-index:10}.game-info-bar{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:#0000004d;border-bottom:1px solid rgba(255,255,255,.1)}.round-info{font-weight:700;color:#f1c40f}.my-score-info{font-weight:700;font-size:.95rem;padding:.3rem .8rem;border-radius:6px;background:#ffffff1a}.my-score-info .positive{color:#2ecc71}.my-score-info .negative{color:#e74c3c}.status-info{color:#ffffffb3}.opponents-area{display:flex;justify-content:center;gap:2rem;padding:1rem;flex-wrap:wrap}.opponent{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:.75rem;text-align:center;min-width:150px}.opponent.ready{border-color:#2ecc71}.opponent-name{font-size:.9rem;display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}.opponent-score{font-weight:600;font-size:.8rem}.opponent-score.positive{color:#2ecc71}.opponent-score.negative{color:#e74c3c}.ready-badge{background:#2ecc71;color:#fff;padding:.15rem .4rem;border-radius:4px;font-size:.65rem;font-weight:700}.arranging-badge{background:#fff3;color:#ffffffb3;padding:.15rem .4rem;border-radius:4px;font-size:.65rem;font-weight:500}.opponent-cards{display:flex;justify-content:center;gap:2px}.binh-card{width:60px;height:84px;background:#fff;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;position:relative;box-shadow:0 2px 8px #0000004d;-webkit-user-select:none;user-select:none}.binh-card.black{color:#1a1a2e}.binh-card.red{color:#e74c3c}.binh-card .card-rank{font-size:1.5rem;font-weight:900;line-height:1}.binh-card .card-suit{font-size:1.2rem}.binh-card:hover:not(.back){transform:translateY(-8px);box-shadow:0 8px 20px #0006}.binh-card.selected{transform:translateY(-12px);box-shadow:0 12px 30px #f1c40f80;outline:3px solid #f1c40f}.binh-card.dragging{opacity:.5;transform:scale(1.1);box-shadow:0 15px 40px #3498db99;outline:3px solid #3498db;z-index:100}.binh-card[draggable=true]{cursor:grab}.binh-card[draggable=true]:active{cursor:grabbing}.binh-card.small{width:45px;height:63px;font-size:.8rem}.binh-card.small .card-rank{font-size:1.1rem}.binh-card.small .card-suit{font-size:.9rem}.binh-card.mini{width:20px;height:28px}.binh-card.back{background:linear-gradient(135deg,#c0392b,#e74c3c);cursor:default}.binh-card.back:after{content:"";width:70%;height:70%;background:repeating-linear-gradient(45deg,transparent,transparent 3px,rgba(255,255,255,.1) 3px,rgba(255,255,255,.1) 6px);border-radius:4px}.card-slot{width:60px;height:84px;border:2px dashed rgba(255,255,255,.2);border-radius:6px;background:#ffffff05;transition:all .2s ease}.card-slot.drop-highlight{border-color:#3498db;background:#3498db33;box-shadow:0 0 15px #3498db66}.chi-row.drop-target{background:#3498db1a;box-shadow:inset 0 0 20px #3498db33}.player-hand.drop-target{background:#3498db1a;box-shadow:inset 0 0 20px #3498db33;border-radius:8px}.arrangement-area{flex:1;display:flex;flex-direction:column;justify-content:center;gap:1rem;padding:1rem;max-width:600px;margin:0 auto;width:100%}.chi-row{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1rem;display:flex;align-items:center;gap:1rem;transition:all .2s}.chi-row.droppable{border-color:#f1c40f;background:#f1c40f0d;cursor:pointer}.chi-row.droppable:hover{background:#f1c40f1a}.chi-label{width:80px;text-align:center}.chi-label span:first-child{display:block;font-weight:700;color:#fff}.chi-desc{font-size:.7rem;color:#fff6}.chi-cards{display:flex;gap:8px;flex:1;justify-content:center}.chi-cards.small{gap:4px}.back-row{border-color:#e74c3c4d}.middle-row{border-color:#f1c40f4d}.front-row{border-color:#3498db4d}.player-hand-area{background:#0006;border-top:1px solid rgba(255,255,255,.1);padding:1rem}.hand-controls{display:flex;justify-content:center;gap:.5rem;margin-bottom:1rem}.player-hand{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;min-height:90px}.hand-hint{text-align:center;font-size:.8rem;color:#fff6;margin-top:.5rem}.results-screen{padding:2rem;max-width:800px;margin:0 auto;position:relative;z-index:10}.results-screen h2{text-align:center;font-size:2rem;margin-bottom:2rem;color:#f1c40f}.all-hands{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:2rem}.player-result{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1.5rem}.player-result.is-me{border-color:#f1c40f;background:#f1c40f0d}.result-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1)}.result-name{font-size:1.25rem;font-weight:700;flex:1}.result-score{font-size:1.5rem;font-weight:900}.result-score.positive{color:#2ecc71}.result-score.negative{color:#e74c3c}.total-score{font-size:.9rem;color:#ffffff80}.result-hands{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.result-chi{text-align:center}.chi-name{display:block;font-size:.8rem;color:#ffffff80;margin-bottom:.5rem}.match-results{background:#ffffff08;border-radius:12px;padding:1.5rem;margin-bottom:2rem}.match-results h3{font-size:1rem;margin-bottom:1rem;color:#ffffffb3}.match-detail{padding:1rem;background:#ffffff08;border-radius:8px;margin-bottom:.5rem}.match-players{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:.5rem;font-weight:600}.match-players .vs{color:#fff6;font-size:.8rem}.match-players .winner{color:#2ecc71}.match-players .loser{color:#e74c3c}.match-chi-results{display:flex;justify-content:center;gap:1rem;font-size:.8rem}.match-chi-results .win{color:#2ecc71}.match-chi-results .lose{color:#e74c3c}.match-chi-results .tie{color:#ffffff80}.results-actions{display:flex;justify-content:center;gap:1rem}@media (max-width: 768px){.binh-logo h1{font-size:2rem}.binh-logo .card{width:50px;height:70px;font-size:1.5rem}.binh-card{width:50px;height:70px}.binh-card .card-rank{font-size:1.2rem}.binh-card .card-suit{font-size:1rem}.binh-card.small{width:38px;height:53px}.card-slot{width:50px;height:70px}.chi-label{width:60px;font-size:.85rem}.chi-cards{gap:4px}.players-grid{grid-template-columns:1fr}.result-hands{flex-direction:column;align-items:center}}@media (max-width: 480px){.binh-card{width:42px;height:59px}.binh-card .card-rank{font-size:1rem}.binh-card .card-suit{font-size:.85rem}.card-slot{width:42px;height:59px}.chi-row{flex-direction:column;text-align:center}.chi-label{width:100%}.arrangement-area{padding:.5rem;gap:.5rem}}.wolf-game{min-height:100vh;background:#0a0a1a;color:#fff;font-family:Outfit,-apple-system,sans-serif;position:relative;overflow:hidden}.wolf-bg{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background:linear-gradient(180deg,#0a0a1a,#1a1a3a,#0a0a1a);transition:background 1s ease}.night-phase .wolf-bg{background:linear-gradient(180deg,#050510,#0a0a2a,#050510)}.day-phase .wolf-bg{background:linear-gradient(180deg,#1a2a4a,#3a5a8a,#1a2a4a)}.moon{position:absolute;top:50px;right:100px;width:80px;height:80px;background:radial-gradient(circle at 30% 30%,#fff,#e0e0e0,#ccc);border-radius:50%;box-shadow:0 0 60px 20px #ffffc84d;animation:moon-glow 4s ease-in-out infinite}@keyframes moon-glow{0%,to{box-shadow:0 0 60px 20px #ffffc84d}50%{box-shadow:0 0 80px 30px #ffffc880}}.sun{position:absolute;top:50px;right:100px;width:100px;height:100px;background:radial-gradient(circle at 50% 50%,#fd0,#f90 70%,#f60);border-radius:50%;box-shadow:0 0 100px 40px #ffc80066;animation:sun-pulse 3s ease-in-out infinite}@keyframes sun-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.stars{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(2px 2px at 20px 30px,white,transparent),radial-gradient(2px 2px at 40px 70px,white,transparent),radial-gradient(1px 1px at 90px 40px,white,transparent),radial-gradient(2px 2px at 130px 80px,white,transparent),radial-gradient(1px 1px at 160px 120px,white,transparent),radial-gradient(2px 2px at 200px 50px,white,transparent),radial-gradient(1px 1px at 250px 160px,white,transparent),radial-gradient(2px 2px at 300px 90px,white,transparent);background-repeat:repeat;background-size:350px 200px;animation:twinkle 5s infinite}@keyframes twinkle{0%,to{opacity:.8}50%{opacity:.4}}.fog{position:absolute;bottom:0;left:0;right:0;height:200px;background:linear-gradient(transparent,#6464964d);animation:fog-drift 20s infinite linear}.back-btn{position:fixed;top:1rem;left:1rem;display:flex;align-items:center;gap:.5rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.6rem 1rem;border-radius:30px;font-size:.85rem;font-weight:500;cursor:pointer;z-index:100;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.back-btn:hover{background:#fff3;transform:translate(-3px)}.landing-content{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;position:relative;z-index:1}.wolf-logo{text-align:center;margin-bottom:2rem}.wolf-icon-large{font-size:5rem;display:block;margin-bottom:.5rem;animation:wolf-howl 3s ease-in-out infinite}@keyframes wolf-howl{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.1) rotate(-5deg)}75%{transform:scale(1.1) rotate(5deg)}}.wolf-logo h1{font-size:3.5rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:linear-gradient(135deg,#ef4444,#f97316,#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 30px rgba(239,68,68,.5)}.tagline{color:#888;font-size:1rem;margin-top:.5rem}.connection-status{text-align:center;margin:2rem 0}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:#ef4444;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.error-msg{background:#ef444433;border:1px solid #ef4444;color:#fca5a5;padding:.75rem 1.5rem;border-radius:8px;margin-bottom:1rem;text-align:center}.error-msg.floating{position:fixed;top:1rem;left:50%;transform:translate(-50%);z-index:1000}.menu-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;width:100%;max-width:400px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.input-group{margin-bottom:1.5rem}.input-group label{display:block;font-size:.85rem;color:#888;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.05em}.input-group input{width:100%;padding:.875rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:1rem;transition:all .2s}.input-group input:focus{outline:none;border-color:#ef4444;box-shadow:0 0 0 3px #ef444433}.button-group{display:flex;flex-direction:column;gap:.75rem}.btn{padding:.875rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;border:none;display:flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 20px #ef444466}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-secondary{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2)}.btn-secondary:hover{background:#ffffff26}.btn-ghost{background:transparent;color:#888;border:1px solid rgba(255,255,255,.1)}.btn-ghost:hover{color:#fff;border-color:#ffffff4d}.btn-large{padding:1rem 2rem;font-size:1.1rem}.btn-sm{padding:.5rem 1rem;font-size:.85rem}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:200;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{background:#1a1a2e;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;text-align:center;min-width:300px}.modal-content h3{margin-bottom:1.5rem;font-size:1.25rem;letter-spacing:.05em}.room-input{width:100%;padding:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:1.5rem;text-align:center;letter-spacing:.3em;text-transform:uppercase;margin-bottom:1.5rem}.room-input:focus{outline:none;border-color:#ef4444}.modal-buttons{display:flex;gap:1rem}.modal-buttons .btn{flex:1}.lobby-content{min-height:100vh;padding:5rem 2rem 2rem;position:relative;z-index:1;max-width:1000px;margin:0 auto}.lobby-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.room-info{display:flex;align-items:center;gap:.75rem;background:#ffffff0d;padding:.5rem 1rem;border-radius:8px}.room-label{font-size:.75rem;color:#888;text-transform:uppercase}.room-code{font-size:1.5rem;font-weight:700;letter-spacing:.2em;color:#ef4444}.copy-btn{background:#ef444433;border:none;color:#ef4444;padding:.25rem .75rem;border-radius:4px;cursor:pointer;font-size:.75rem}.copy-btn:hover{background:#ef44444d}.players-section{margin-bottom:2rem}.players-section h2{font-size:1.25rem;margin-bottom:1rem;color:#888}.lobby-players-grid{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.player-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.5rem .75rem;display:flex;align-items:center;gap:.5rem;min-width:140px;max-width:180px}.player-card.is-me{border-color:#ef4444;background:#ef44441a}.player-number{width:20px;height:20px;background:#ffffff1a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;flex-shrink:0}.player-name{flex:1;font-weight:500;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.host-badge{font-size:.6rem;background:#fbbf24;color:#000;padding:.1rem .4rem;border-radius:4px;font-weight:600;flex-shrink:0}.bot-badge{font-size:.6rem;background:#6366f1;color:#fff;padding:.1rem .4rem;border-radius:4px;font-weight:600;flex-shrink:0}.player-card.is-bot{border-color:#6366f1;background:#6366f11a}.roles-preview{margin-bottom:1.5rem;text-align:center}.roles-preview h4{font-size:.85rem;color:#888;margin-bottom:.75rem}.roles-icons-row{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;max-width:500px;margin:0 auto}.role-preview-icon{font-size:2.5rem;cursor:pointer;transition:all .2s;padding:.5rem;background:#ffffff0d;border-radius:12px;width:60px;height:60px;display:flex;align-items:center;justify-content:center}.role-preview-icon:hover{transform:scale(1.15);background:#ffffff26;box-shadow:0 0 15px #fff3}.roles-grid{display:flex;flex-wrap:wrap;gap:.75rem}.role-card{background:#ffffff0d;border:2px solid;border-radius:8px;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem}.role-icon{font-size:1.25rem}.role-name{font-size:.85rem;font-weight:500}.lobby-actions{text-align:center;padding-top:1rem}.waiting-text{color:#888;font-size:1.1rem}.game-layout{min-height:100vh;display:flex;flex-direction:column;position:relative;z-index:1}.game-top-bar{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.5rem;background:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.top-bar-left{display:flex;align-items:center;gap:1rem}.top-bar-right{display:flex;align-items:center;gap:.75rem}.phase-info{display:flex;align-items:center;gap:1rem}.day-number{font-size:1.25rem;font-weight:700}.phase-badge{padding:.25rem .75rem;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:uppercase}.phase-badge.night{background:#3730a3;color:#a5b4fc}.phase-badge.day{background:#fbbf24;color:#000}.phase-badge.voting{background:#ef4444;color:#fff;animation:pulse 1s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.my-role{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff0d;border:2px solid;border-radius:8px;cursor:pointer;transition:all .2s ease}.my-role:hover{background:#ffffff1a;transform:scale(1.05)}.dead-badge{background:#dc2626;color:#fff;font-size:.65rem;padding:.15rem .5rem;border-radius:4px;font-weight:600}.game-main-area{flex:1;display:flex;gap:.5rem;padding:.5rem;overflow:hidden;background:#f5f5f5}.game-side-panel{width:280px;background:#1a1a2e;border-radius:12px;display:flex;flex-direction:column;box-shadow:0 4px 20px #0000004d;height:calc(100vh - 120px);overflow:hidden}.roles-section{flex:0 0 33%;border-bottom:1px solid #333;padding:.5rem;overflow-y:auto}.section-header{font-size:.75rem;font-weight:600;color:#888;text-transform:uppercase;margin-bottom:.5rem;padding:0 .25rem}.roles-icon-grid{display:flex;flex-wrap:wrap;gap:.3rem;justify-content:flex-start}.role-icon-item{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;cursor:pointer;transition:all .2s;background:#2a2a4a}.role-icon-item:hover{transform:scale(1.1);background:#3a3a5a}.role-icon-item.village{border:2px solid #4ade80}.role-icon-item.werewolf{border:2px solid #ef4444}.role-icon-item.solo{border:2px solid #f472b6}.role-icon-item.revealed{opacity:.4}.role-icon-emoji{font-size:1.2rem}.no-roles{color:#666;font-size:.75rem;text-align:center;padding:.5rem}.chat-section{flex:1;display:flex;flex-direction:column;min-height:0}.chat-tabs{display:flex;background:#0f0f1a;border-bottom:1px solid #333}.chat-tab{flex:1;padding:.6rem;background:transparent;border:none;color:#888;font-size:.8rem;cursor:pointer;transition:all .2s;border-bottom:2px solid transparent}.chat-tab:hover{color:#fff;background:#ffffff0d}.chat-tab.active{color:#4ade80;border-bottom-color:#4ade80;background:#4ade801a}.chat-tab.night.active{color:#ef4444;border-bottom-color:#ef4444;background:#ef44441a}.chat-tab.disabled{opacity:.3;cursor:not-allowed}.chat-messages{flex:1;overflow-y:auto;padding:.5rem;display:flex;flex-direction:column;gap:.3rem;background:#0d0d15}.chat-msg{font-size:.75rem;line-height:1.4;padding:.4rem .5rem;border-radius:6px;background:#1a1a2e}.chat-msg.dead{opacity:.5}.chat-msg.night-msg{background:#ef444426;border-left:2px solid #ef4444}.msg-time{color:#555;font-size:.65rem;margin-right:.3rem}.msg-name{color:#4ade80;font-weight:600;margin-right:.3rem}.msg-name.wolf{color:#ef4444}.msg-text{color:#ddd}.no-messages{color:#555;font-size:.75rem;text-align:center;padding:1rem;font-style:italic}.chat-input-area{display:flex;gap:.3rem;padding:.5rem;background:#0f0f1a;border-top:1px solid #333}.chat-input{flex:1;background:#1a1a2e;border:1px solid #333;border-radius:6px;padding:.5rem .75rem;color:#fff;font-size:.8rem}.chat-input:focus{outline:none;border-color:#4ade80}.chat-input:disabled{opacity:.5;cursor:not-allowed}.chat-send-btn{background:#4ade80;color:#000;border:none;border-radius:6px;padding:.5rem 1rem;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s}.chat-send-btn:hover:not(:disabled){background:#22c55e}.chat-send-btn:disabled{opacity:.3;cursor:not-allowed}.roles-side-panel{width:240px;background:#fff;border-radius:8px;padding:.5rem;display:flex;flex-direction:column;box-shadow:0 2px 8px #0000001a;position:relative;overflow-y:auto;max-height:calc(100vh - 150px)}.role-icon-item:hover{background:#e8e8e8;transform:scale(1.05)}.role-icon-item.revealed{opacity:.4;text-decoration:line-through}.role-icon-item.not-in-game{opacity:.3;filter:grayscale(80%)}.role-icon-item.werewolf{background:#ffe8e8}.role-icon-item.solo{background:#fff8e8}.role-icon-emoji{font-size:1.5rem}.role-icon-name{font-size:.6rem;color:#333;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.no-roles{color:#999;font-size:.8rem;text-align:center;padding:1rem}.players-grid{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;padding:.5rem;overflow-y:auto}.player-card-wv{background:#5bc0de;border-radius:8px;overflow:hidden;cursor:default;transition:all .2s ease;position:relative;aspect-ratio:1;display:flex;flex-direction:column}.player-card-wv .card-header{background:#0096c8e6;color:#fff;padding:.25rem .5rem;display:flex;align-items:center;gap:.25rem;font-size:.75rem;font-weight:600}.player-card-wv .card-header.werewolf{background:#e74c3c;color:#fff}.player-card-wv .player-num{font-weight:700}.player-card-wv .player-name-wv{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-card-wv .card-body{flex:1;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#4ab8d1,#3a9cbd);position:relative}.player-card-wv .avatar-area{display:flex;flex-direction:column;align-items:center;justify-content:center}.player-card-wv .avatar-icon-large{font-size:3rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.player-card-wv .vote-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#e74c3ce6;color:#fff;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;z-index:5}.player-card-wv .me-indicator-wv{position:absolute;bottom:4px;right:4px;background:#4ade80;color:#000;font-size:.55rem;font-weight:700;padding:2px 6px;border-radius:4px}.player-card-wv .role-corner-badge{position:absolute;bottom:4px;left:4px;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000004d}.player-card-wv .corner-role-icon{font-size:1.2rem}.player-card-wv.can-target{cursor:pointer;box-shadow:0 0 0 3px #fbbf24;animation:wv-pulse 1.5s infinite}@keyframes wv-pulse{0%,to{box-shadow:0 0 0 3px #fbbf24}50%{box-shadow:0 0 0 5px #fbbf24,0 0 15px #fbbf2480}}.player-card-wv.can-target:hover{transform:scale(1.03)}.player-card-wv.is-me{box-shadow:0 0 0 3px #4ade80}.player-card-wv.selected{box-shadow:0 0 0 4px #ef4444;transform:scale(1.02)}.player-card-wv.voted{box-shadow:0 0 0 3px #fbbf24}.player-card-wv.dead{pointer-events:none}.player-card-wv.dead .card-body{background:linear-gradient(180deg,#888,#555)}.skull{filter:grayscale(100%)}.vote-count{position:absolute;top:-5px;right:-5px;background:#ef4444;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700}.me-indicator{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);background:#4ade80;color:#000;font-size:.6rem;padding:.1rem .4rem;border-radius:4px;font-weight:700}.action-panel{position:fixed;bottom:100px;left:50%;transform:translate(-50%);background:#000c;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:1rem 2rem;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:50}.action-panel h3{margin-bottom:1rem;font-size:1rem}.arson-buttons,.witch-buttons,.cupid-selection{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-top:.5rem}.arson-buttons .btn,.witch-buttons .btn{min-width:100px}.cupid-selection p{width:100%;text-align:center;margin-bottom:.5rem;color:#ec4899}.action-hint{margin-top:.5rem;color:#9ca3af;font-size:.85rem}.action-hint.success{color:#4ade80;font-weight:700}.time-hint{margin-top:.75rem;color:#6b7280;font-size:.75rem;font-style:italic}.phase-timer{background:#3b82f633;border:1px solid #3b82f6;color:#60a5fa;padding:.25rem .75rem;border-radius:1rem;font-size:1rem;font-weight:700;font-family:Courier New,monospace;min-width:50px;text-align:center;animation:pulse-timer 1s infinite}.phase-timer.urgent{background:#ef44444d;border-color:#ef4444;color:#f87171;animation:flash-urgent .5s infinite}@keyframes pulse-timer{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes flash-urgent{0%,to{opacity:1}50%{opacity:.6}}.skip-vote-btn{background:#fbbf2433;border:1px solid #f59e0b;color:#fbbf24;padding:.3rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s;margin-left:.5rem}.skip-vote-btn:hover:not(:disabled){background:#fbbf2466;transform:scale(1.05)}.skip-vote-btn.voted{background:#22c55e4d;border-color:#22c55e;color:#4ade80;cursor:default}.skip-vote-btn:disabled{opacity:.7;cursor:default}.voice-controls{display:flex;align-items:center;gap:.3rem}.voice-btn{padding:.4rem .6rem;border-radius:8px;border:1px solid #555;background:#2a2a4a;color:#fff;font-size:.85rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.3rem}.voice-btn:hover:not(:disabled){transform:scale(1.05)}.voice-btn:disabled{opacity:.4;cursor:not-allowed}.voice-btn.join{background:#4ade8033;border-color:#4ade80;color:#4ade80}.voice-btn.join:hover:not(:disabled){background:#4ade8066}.voice-btn.muted{background:#ef444433;border-color:#ef4444;color:#ef4444}.voice-btn.speaking{background:#4ade804d;border-color:#4ade80;color:#4ade80;animation:voice-pulse 1s infinite}@keyframes voice-pulse{0%,to{box-shadow:0 0 #4ade8066}50%{box-shadow:0 0 0 6px #4ade8000}}.voice-btn.leave{background:#ef444433;border-color:#ef4444;padding:.4rem .5rem}.voice-btn.leave:hover{background:#ef444466}.voice-users-indicator{background:#1a1a2e;padding:.3rem .5rem;border-radius:6px;font-size:.75rem;color:#888;border:1px solid #333}.player-card-wv.is-speaking{box-shadow:0 0 15px #4ade8099;border-color:#4ade80!important}.player-card-wv.is-speaking:after{content:"🎤";position:absolute;bottom:25%;left:50%;transform:translate(-50%);font-size:1.5rem;z-index:10;animation:mic-pulse .8s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(74,222,128,.8))}@keyframes mic-pulse{0%,to{transform:translate(-50%) scale(1);opacity:1}50%{transform:translate(-50%) scale(1.2);opacity:.8}}.arson-buttons .btn.active,.witch-buttons .btn.active{transform:scale(1.05);box-shadow:0 0 15px currentColor}.vote-status{color:#9ca3af;margin-bottom:.5rem}.vote-status.has-vote{color:#fbbf24;font-weight:700}.voting-panel .btn.active{background:#fbbf2433;border-color:#fbbf24;color:#fbbf24}.action-panel.villager-wait{background:#4ade801a;border-color:#4ade804d}.action-panel.villager-wait p{margin-top:.5rem;color:#9ca3af;font-size:.9rem}.seer-result{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000e6;border:3px solid;border-radius:16px;padding:2rem 3rem;text-align:center;z-index:100;animation:fadeIn .5s ease}.seer-result.is-wolf{border-color:#ef4444;box-shadow:0 0 30px #ef444480}.seer-result.is-villager{border-color:#4ade80;box-shadow:0 0 30px #4ade8080}.result-text{display:block;margin-top:.5rem;font-size:1.5rem;font-weight:700}.voting-panel{position:fixed;bottom:100px;left:50%;transform:translate(-50%);background:#ef444433;border:1px solid #ef4444;border-radius:12px;padding:1rem 2rem;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:50}.voting-panel h3{color:#ef4444;margin-bottom:.5rem}.voting-panel p{color:#888;margin-bottom:1rem;font-size:.9rem}.chat-panel{position:fixed;right:1rem;bottom:1rem;width:300px;height:350px;background:#000000b3;border:1px solid rgba(255,255,255,.1);border-radius:12px;display:flex;flex-direction:column;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:50}.chat-header{padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.1);font-weight:600;font-size:.85rem}.chat-messages{flex:1;overflow-y:auto;padding:.5rem;display:flex;flex-direction:column;gap:.25rem}.chat-msg{font-size:.8rem;padding:.25rem .5rem;border-radius:4px}.chat-msg.system{color:#fbbf24;font-style:italic}.chat-msg.death{color:#ef4444;font-weight:600}.chat-msg.action{color:#a855f7}.chat-msg.seer{color:#22d3ee;font-weight:600}.chat-msg.werewolf{color:#ef4444}.chat-msg.chat{color:#fff}.chat-input-area{display:flex;gap:.5rem;padding:.5rem;border-top:1px solid rgba(255,255,255,.1)}.chat-input-area input{flex:1;padding:.5rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:#fff;font-size:.85rem}.chat-input-area input:disabled{opacity:.5;cursor:not-allowed}.chat-input-area button{padding:.5rem 1rem;background:#ef4444;border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:600}.chat-input-area button:disabled{opacity:.5;cursor:not-allowed}.role-reveal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:300;animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.role-reveal-card{text-align:center;animation:revealPop .5s ease}@keyframes revealPop{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.reveal-icon{font-size:6rem;display:block;margin-bottom:1rem;animation:iconBounce 1s ease infinite}@keyframes iconBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.role-reveal-card h2{font-size:2rem;margin-bottom:.5rem}.role-reveal-card p{color:#888;font-size:1.1rem}.role-reveal-card .role-description{margin-top:1rem;padding:1rem;background:#ffffff1a;border-radius:10px;font-size:.95rem;color:#ccc;max-width:300px;margin-left:auto;margin-right:auto}.role-reveal-card .btn{margin-top:1.5rem}.gameover-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:300}.gameover-card{text-align:center;max-width:500px;padding:2rem}.gameover-card h1{font-size:2.5rem;margin-bottom:2rem;background:linear-gradient(135deg,#fbbf24,#ef4444);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.final-roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem;margin-bottom:2rem}.final-player{display:flex;align-items:center;gap:.5rem;background:#ffffff0d;padding:.5rem .75rem;border-radius:8px;font-size:.85rem}.final-player.dead{opacity:.5;text-decoration:line-through}.final-role{margin-left:auto;color:#888;font-size:.75rem}.gameover-card .btn{margin:.5rem}.wolf-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;position:relative;background:linear-gradient(180deg,#1a1a3a,#0a0a2a)}.wolf-preview .wolf-icon svg{width:60px;height:60px;color:#ef4444}.wolf-preview .wolf-moon{position:absolute;top:20px;right:30px;width:40px;height:40px;background:radial-gradient(circle at 30% 30%,#fff,#ccc);border-radius:50%;box-shadow:0 0 20px #ffffc880}.roles-btn{background:#8b5cf633;border:1px solid #8b5cf6;color:#c4b5fd;padding:.4rem .8rem;border-radius:6px;font-size:.8rem;cursor:pointer;transition:all .2s}.roles-btn:hover{background:#8b5cf666;color:#fff}.roles-panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:200;padding:1rem}.roles-panel{background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid rgba(255,255,255,.1);border-radius:16px;max-width:700px;width:100%;max-height:80vh;overflow-y:auto;padding:1.5rem}.roles-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:1rem}.roles-panel-header h2{font-size:1.3rem;color:#fff;margin:0}.close-btn{background:#ef444433;border:1px solid #ef4444;color:#ef4444;width:30px;height:30px;border-radius:50%;cursor:pointer;font-weight:700;transition:all .2s}.close-btn:hover{background:#ef4444;color:#fff}.roles-grid{display:flex;flex-direction:column;gap:1.5rem}.role-section{background:#0003;border-radius:10px;padding:1rem}.wolvesville-game .wolf-section-title{font-size:1rem;margin-bottom:.75rem;padding-left:.5rem;border-left:3px solid}.wolvesville-game .wolf-section-title.village{color:#4ade80;border-color:#4ade80}.wolvesville-game .wolf-section-title.werewolf{color:#ef4444;border-color:#ef4444}.wolvesville-game .wolf-section-title.solo{color:#fbbf24;border-color:#fbbf24}.role-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.5rem}.role-card{display:flex;flex-direction:column;align-items:center;padding:.75rem .5rem;background:#ffffff0d;border:2px solid;border-radius:10px;cursor:pointer;transition:all .2s}.role-card:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}.role-card.village{background:#4ade801a}.role-card.werewolf{background:#ef44441a}.role-card.solo{background:#fbbf241a}.role-card-icon{font-size:2rem;margin-bottom:.25rem}.role-card-name{font-size:.7rem;text-align:center;color:#e5e5e5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.roles-hint{text-align:center;color:#9ca3af;font-size:.8rem;margin-top:1rem}.role-info-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:250;padding:1rem}.role-info-card{background:linear-gradient(135deg,#1e1e2e,#2d2d44);border:3px solid;border-radius:20px;padding:2rem;max-width:400px;width:100%;text-align:center;animation:popIn .3s ease}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.role-info-icon{font-size:5rem;display:block;margin-bottom:1rem}.role-info-card h2{font-size:1.8rem;margin-bottom:.5rem}.team-badge{display:inline-block;padding:.3rem 1rem;border-radius:20px;font-size:.8rem;font-weight:700;margin-bottom:1rem}.team-badge.village{background:#4ade8033;color:#4ade80}.team-badge.werewolf{background:#ef444433;color:#ef4444}.team-badge.solo{background:#fbbf2433;color:#fbbf24}.role-info-desc{color:#d1d5db;font-size:1rem;line-height:1.6;margin-bottom:1.5rem;text-align:left;padding:1rem;background:#0003;border-radius:10px}@media (max-width: 768px){.game-main-area{flex-direction:column}.game-side-panel{width:100%;height:200px;flex-direction:row}.roles-section{flex:0 0 30%;border-bottom:none;border-right:1px solid #333}.chat-section{flex:1}.roles-side-panel{width:100%;max-height:100px;overflow-y:hidden}.roles-icon-grid{padding-top:.5rem;justify-content:center}.role-icon-item{width:30px;height:30px}.role-icon-name{display:none}.players-grid{grid-template-columns:repeat(3,1fr);gap:.4rem}.player-card-wv .avatar-icon-large{font-size:2rem}.player-card-wv .card-header{font-size:.65rem;padding:.2rem .3rem}.moon,.sun{width:50px;height:50px;top:30px;right:30px}.roles-panel{max-height:90vh;padding:1rem}.role-cards{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.role-card-icon{font-size:1.5rem}.role-card-name{font-size:.65rem}}.privacy-page{min-height:100vh;background:#0a0a0f;color:#e0e0e0;padding:2rem 1rem 4rem}.privacy-container{max-width:800px;margin:0 auto}.privacy-back{display:inline-block;color:#a855f7;text-decoration:none;font-size:.9rem;margin-bottom:1.5rem;transition:color .2s}.privacy-back:hover{color:#c084fc}.privacy-page h1{font-size:2rem;font-weight:800;color:#fff;margin-bottom:.5rem}.privacy-updated{color:#666;font-size:.85rem;margin-bottom:2.5rem}.privacy-page section{margin-bottom:2rem}.privacy-page h2{font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:.75rem;padding-bottom:.4rem;border-bottom:1px solid rgba(255,255,255,.08)}.privacy-page h3{font-size:1rem;font-weight:600;color:#ccc;margin:.75rem 0 .5rem}.privacy-page p{line-height:1.7;color:#b0b0b0;margin-bottom:.75rem}.privacy-page ul{padding-left:1.5rem;margin-bottom:.75rem}.privacy-page li{line-height:1.7;color:#b0b0b0;margin-bottom:.3rem}.privacy-page strong{color:#e0e0e0}@media (max-width: 600px){.privacy-page{padding:1.5rem 1rem 3rem}.privacy-page h1{font-size:1.5rem}.privacy-page h2{font-size:1.05rem}}.app{min-height:100vh;display:flex;flex-direction:column}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f5f5;margin:0;padding:0}*{margin:0;padding:0;box-sizing:border-box}#root{min-height:100vh}