@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Cinzel+Decorative:wght@400;700&display=swap";:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}#app{max-width:100%;margin:0 auto;text-align:center;min-height:100vh}#pixi-screen{position:fixed;top:0;left:0;bottom:0;right:0;width:100%;height:100%}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.vanilla:hover{filter:drop-shadow(0 0 2em #3178c6aa)}.card{padding:2em}.read-the-docs{color:#888}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.lobby-container{max-width:900px;margin:0 auto;padding:20px;font-family:Cinzel,serif;background:radial-gradient(circle at 20% 80%,rgba(139,69,19,.3) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(160,82,45,.3) 0%,transparent 50%),linear-gradient(135deg,#1a0f0a,#2d1b13,#3d2817);min-height:100vh;color:#f4e4bc;position:relative;overflow-x:hidden}.lobby-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(90deg,transparent,transparent 98px,rgba(139,69,19,.1) 100px),repeating-linear-gradient(0deg,transparent,transparent 98px,rgba(139,69,19,.1) 100px);pointer-events:none}.lobby-header{text-align:center;margin-bottom:40px;position:relative}.lobby-title{font-family:Cinzel Decorative,serif;font-size:3.2em;font-weight:700;margin-bottom:10px;color:#d4af37;text-shadow:3px 3px 0px #8b4513,6px 6px 10px rgba(0,0,0,.8),0 0 30px rgba(212,175,55,.5);letter-spacing:2px;position:relative}.lobby-title:before,.lobby-title:after{content:"⚔";position:absolute;top:50%;transform:translateY(-50%);font-size:.6em;color:peru;text-shadow:2px 2px 4px rgba(0,0,0,.7)}.lobby-title:before{left:-60px}.lobby-title:after{right:-60px;transform:translateY(-50%) scaleX(-1)}.lobby-section{background:linear-gradient(145deg,#8b451366,#a0522d33),radial-gradient(circle at center,rgba(205,133,63,.1) 0%,transparent 70%);border:3px solid transparent;background-clip:padding-box;border-radius:15px;padding:25px;margin-bottom:25px;position:relative;box-shadow:inset 0 1px #ffffff1a,inset 0 -1px #0003,0 10px 20px #0000004d}.lobby-section:before{content:"";position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;background:linear-gradient(45deg,#d4af37,peru,#daa520,#b8860b);border-radius:15px;z-index:-1}.lobby-section h3{margin-top:0;color:#d4af37;border-bottom:3px solid;border-image:linear-gradient(90deg,#d4af37,#cd853f,transparent) 1;padding-bottom:12px;font-family:Cinzel Decorative,serif;font-size:1.4em;text-transform:uppercase;letter-spacing:1px;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.form-group{margin-bottom:18px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#f4e4bc;text-transform:uppercase;letter-spacing:.5px;font-size:.9em}.form-group input{width:100%;padding:12px 16px;border:2px solid #8b4513;border-radius:8px;background:linear-gradient(145deg,#1a0f0ae6,#2d1b13b3),radial-gradient(circle at center,rgba(139,69,19,.2) 0%,transparent 70%);color:#f4e4bc;font-size:16px;font-family:Cinzel,serif;transition:all .3s ease;box-shadow:inset 2px 2px 5px #0000004d;box-sizing:border-box}.form-group input:focus{outline:none;border-color:#d4af37;box-shadow:inset 2px 2px 5px #0000004d,0 0 15px #d4af3766,0 0 5px #d4af3799;background:linear-gradient(145deg,#1a0f0af2,#2d1b13cc),radial-gradient(circle at center,rgba(212,175,55,.1) 0%,transparent 70%)}.form-group input::placeholder{color:#f4e4bc80;font-style:italic}.btn{background:linear-gradient(145deg,#d4af37,#daa520 25%,#b8860b 75%,#8b6914);color:#1a0f0a;border:2px solid #8b6914;padding:14px 28px;border-radius:8px;font-size:16px;font-weight:600;font-family:Cinzel,serif;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px;position:relative;box-shadow:0 4px 8px #0000004d,inset 0 1px #fff3}.btn:hover{background:linear-gradient(145deg,gold,#f0c814 25%,#d4af37 75%,#b8860b);transform:translateY(-2px);box-shadow:0 6px 12px #0006,inset 0 1px #ffffff4d,0 0 20px #d4af374d;border-color:#d4af37}.btn:active{transform:translateY(0);box-shadow:0 2px 4px #0000004d,inset 0 1px #ffffff1a}.btn-secondary{background:linear-gradient(145deg,#8b7355,#a0845f 25%,#6d5a47 75%,#5d4e3a);color:#f4e4bc;border-color:#5d4e3a}.btn-secondary:hover{background:linear-gradient(145deg,#a0845f,#b8941f 25%,#8b7355 75%,#6d5a47);color:#d4af37;border-color:#8b7355}.btn-test{background:linear-gradient(145deg,#4a5568,#5a6a7a 25%,#3a454f 75%,#2d3748);color:#a7f3d0;border-color:#2d3748}.btn-test:hover{background:linear-gradient(145deg,#5a6a7a,#6b7b8c 25%,#4a5568 75%,#3a454f);color:#6ee7b7;border-color:#4a5568;box-shadow:0 0 15px #6ee7b766}.room-list{max-height:350px;overflow-y:auto;border:3px solid #8b4513;border-radius:10px;background:linear-gradient(145deg,#1a0f0acc,#2d1b1399),repeating-linear-gradient(0deg,transparent,transparent 20px,rgba(139,69,19,.1) 22px);box-shadow:inset 0 2px 10px #00000080}.room-item{padding:18px;border-bottom:1px solid rgba(139,69,19,.3);display:flex;justify-content:space-between;align-items:center;transition:all .3s ease;position:relative}.room-item:hover{background:linear-gradient(90deg,#d4af371a,#8b451333),radial-gradient(circle at left,rgba(205,133,63,.1) 0%,transparent 50%);border-left:4px solid #d4af37;padding-left:14px}.room-info h4{margin:0 0 5px;color:#d4af37;font-family:Cinzel Decorative,serif;font-size:1.1em;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.room-info p{margin:0;color:peru;font-size:.9em;font-style:italic}.player-list{display:flex;gap:12px;margin-top:15px}.player-card{background:linear-gradient(145deg,#8b45134d,#a0522d33),radial-gradient(circle at center,rgba(212,175,55,.1) 0%,transparent 70%);padding:12px;border-radius:8px;border:2px solid #8b4513;flex:1;text-align:center;position:relative;transition:all .3s ease;box-shadow:inset 0 1px #ffffff1a}.player-ready{background:linear-gradient(145deg,#228b2266,#32cd3233),radial-gradient(circle at center,rgba(144,238,144,.2) 0%,transparent 70%);border-color:#228b22;color:#90ee90;box-shadow:inset 0 1px #fff3,0 0 15px #32cd324d}.player-ready:before{content:"⚔";position:absolute;top:-5px;right:-5px;color:#90ee90;font-size:.8em;text-shadow:0 0 5px rgba(144,238,144,.8)}.game-controls{text-align:center;margin-top:25px}.status-message{text-align:center;padding:12px 18px;margin:12px 0;border-radius:8px;font-weight:600;font-family:Cinzel,serif;letter-spacing:.5px;position:relative;box-shadow:0 4px 8px #0003}.status-success{background:linear-gradient(145deg,#228b224d,#32cd3233),radial-gradient(circle at center,rgba(144,238,144,.1) 0%,transparent 70%);color:#90ee90;border:2px solid #228b22;text-shadow:0 1px 2px rgba(0,0,0,.5)}.status-error{background:linear-gradient(145deg,#8b000066,#f003),radial-gradient(circle at center,rgba(255,99,71,.2) 0%,transparent 70%);color:#ff6b6b;border:2px solid #8b0000;text-shadow:0 1px 2px rgba(0,0,0,.5)}.status-info{background:linear-gradient(145deg,#00648b66,#007bff33),radial-gradient(circle at center,rgba(135,206,235,.2) 0%,transparent 70%);color:#87ceeb;border:2px solid #006487;text-shadow:0 1px 2px rgba(0,0,0,.5)}.room-list::-webkit-scrollbar{width:12px}.room-list::-webkit-scrollbar-track{background:#1a0f0acc;border-radius:6px}.room-list::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#d4af37,#8b4513);border-radius:6px;border:2px solid rgba(26,15,10,.8)}.room-list::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,gold,#d4af37)}.lobby-actions{display:flex;gap:15px;justify-content:center;margin-top:20px}.lobby-actions .btn{flex:1;max-width:200px}#status-container{margin-top:20px}#current-room-section{border:2px solid #d4af37;box-shadow:0 0 15px #d4af374d,inset 0 1px #ffffff1a;background:linear-gradient(145deg,#8b451380,#a0522d4d),radial-gradient(circle at center,rgba(205,133,63,.2) 0%,transparent 70%)}#current-room-section h3{color:gold;text-shadow:2px 2px 4px rgba(0,0,0,.7),0 0 10px rgba(255,215,0,.5);border-bottom-color:gold}#current-room-section h3:before{content:"🏰 ";margin-right:10px}.player-card{transition:all .4s ease;position:relative;overflow:hidden}.player-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,215,0,.2),transparent);transition:left .5s ease}.player-card:hover:before{left:100%}.player-ready:after{content:"";position:absolute;top:50%;right:10px;transform:translateY(-50%);width:8px;height:8px;background:#90ee90;border-radius:50%;box-shadow:0 0 10px #90ee90cc;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1;transform:translateY(-50%) scale(1)}50%{opacity:.6;transform:translateY(-50%) scale(1.2)}}#ready-btn.btn-secondary{background:linear-gradient(145deg,#228b22,#32cd32 25%,#90ee90 75%,#98fb98);color:#000;border-color:#228b22;animation:readyGlow 2s ease-in-out infinite}@keyframes readyGlow{0%,to{box-shadow:0 4px 8px #0000004d,0 0 20px #32cd3266}50%{box-shadow:0 6px 12px #0006,0 0 30px #32cd32b3}}#available-rooms:empty:after{content:"No rooms available. Create one to get started!";display:block;text-align:center;padding:30px;color:#f4e4bcb3;font-style:italic;background:#8b45131a;border-radius:8px;margin:10px 0}.room-card{background:linear-gradient(135deg,#8b451366,#65432166,#8b451366);border-top:2px solid #DAA520;border-bottom:2px solid #DAA520;border-left:none;border-right:none;border-radius:0;padding:8px 12px;margin:6px 0;box-shadow:0 1px 3px #0003,inset 0 1px #ffffff0d;transition:all .3s ease;position:relative;overflow:hidden}.room-content{display:flex;align-items:center;justify-content:space-between;gap:12px}.room-details{flex:1}.room-actions{flex-shrink:0}.room-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 30% 20%,rgba(255,215,0,.1) 0%,transparent 50%);pointer-events:none}.room-card:hover{box-shadow:0 2px 6px #0000004d,0 1px 3px #daa5204d,inset 0 1px #ffffff1a;border-top-color:gold;border-bottom-color:gold}.room-name{font-family:Cinzel,serif;font-size:1.1em;font-weight:600;color:gold;margin-bottom:4px;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.room-info{color:#f4e4bc;font-size:.8em;margin-bottom:6px;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.room-players{display:flex;gap:6px;margin-bottom:0;flex-wrap:wrap}.room-players .player-name{background:#8b451399;color:#f4e4bc;padding:4px 8px;border-radius:4px;font-size:.8em;border:1px solid rgba(218,165,32,.3);text-shadow:1px 1px 2px rgba(0,0,0,.5)}.room-players .player-name.ready{background:#228b2299;border-color:#32cd3280;color:#90ee90;box-shadow:0 0 8px #32cd324d}.join-room-btn{background:linear-gradient(135deg,#daa520,#b8860b,#daa520);color:#2f1b14;border:2px solid #FFD700;padding:8px 16px;font-family:Cinzel,serif;font-weight:600;border-radius:4px;cursor:pointer;transition:all .3s ease;text-shadow:1px 1px 2px rgba(255,255,255,.3);box-shadow:0 1px 3px #0000004d,inset 0 1px #ffffff4d;font-size:.9em;min-width:80px}.join-room-btn:hover{background:linear-gradient(135deg,gold,#daa520,gold);box-shadow:0 2px 6px #0006,inset 0 1px #fff6;border-color:#fff8dc}.join-room-btn:active{transform:translateY(0);box-shadow:0 2px 4px #0000004d,inset 0 1px #fff3}.no-rooms{text-align:center;padding:40px 20px;color:#f4e4bcb3;font-style:italic;background:#8b45131a;border:2px dashed rgba(218,165,32,.3);border-radius:12px;margin:20px 0;font-family:Cinzel,serif}.host-badge{position:absolute;top:5px;right:5px;background:linear-gradient(135deg,gold,#daa520);color:#2f1b14;padding:2px 6px;border-radius:4px;font-size:.7em;font-weight:700;text-shadow:1px 1px 2px rgba(255,255,255,.3);border:1px solid #FFF8DC;box-shadow:0 2px 4px #0000004d;font-family:Cinzel,serif}.room-card.current-player-room{border-top-color:#32cd32;border-bottom-color:#32cd32;box-shadow:0 1px 3px #0003,0 1px 2px #32cd3266,inset 0 1px #ffffff0d;background:linear-gradient(135deg,#228b224d,#8b451366,#228b224d)}.room-card.current-player-room .room-name{color:#90ee90}.player-name.current-player{background:#32cd3299!important;border-color:#90ee90cc!important;color:#90ee90!important;box-shadow:0 0 12px #32cd3280!important;font-weight:700}.room-card.room-status-active{border-top-color:#ff6b35;border-bottom-color:#ff6b35;background:linear-gradient(135deg,#ff6b3533,#8b451366,#ff6b3533)}.room-card.room-status-active .room-name{color:#ff8c69}.room-card.room-status-full{border-top-color:#b8860b;border-bottom-color:#b8860b;background:linear-gradient(135deg,#b8860b33,#8b451366,#b8860b33);opacity:.8}.room-card.room-status-full .room-name{color:#daa520}