*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#252538,#363654,#253535);background-attachment:fixed;color:#e2e8f0;min-height:100vh}.app{max-width:1200px;margin:0 auto;padding:20px}.auth-container{max-width:400px;margin:100px auto;background:#28283ce6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:40px;border-radius:20px;box-shadow:0 8px 32px #00000059;border:1px solid rgba(74,222,128,.2)}.auth-container h1{text-align:center;margin-bottom:30px;font-size:32px}.form{display:flex;flex-direction:column;gap:15px}.input{padding:12px 16px;border:2px solid rgba(74,222,128,.25);border-radius:10px;background:#232337cc;color:#e2e8f0;font-size:16px;transition:all .3s}.input:focus{outline:none;border-color:#4ade8080;background:#28283cf2;box-shadow:0 0 15px #4ade8026}.input::placeholder{color:#ffffff80}select.input option{background:#1a1a2e;color:#fff;padding:10px}select.input optgroup{background:#1a1a2e;color:#fff}.btn{padding:12px 24px;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s}.btn-primary{background:linear-gradient(135deg,#4ade80,#22d3ee);color:#0a0a0f;font-weight:700}.btn-primary:hover{background:linear-gradient(135deg,#22c55e,#06b6d4);transform:translateY(-2px);box-shadow:0 4px 20px #4ade8066,0 0 30px #22d3ee33}.btn-secondary{background:#4ade801a;color:#4ade80;border:1px solid rgba(74,222,128,.3)}.btn-secondary:hover{background:#4ade8033;border-color:#4ade8080;box-shadow:0 0 15px #4ade8026}.link{text-align:center;margin-top:20px;color:#fffc}.link button{background:none;border:none;color:#4ade80;cursor:pointer;text-decoration:underline;font-size:16px}.game-container{display:grid;grid-template-columns:320px 1fr 350px;gap:20px;margin-top:20px}.card{background:#282841cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:15px;padding:20px;box-shadow:0 8px 32px #00000040;border:1px solid rgba(74,222,128,.15)}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.header h1{font-size:28px}.players-list{display:flex;flex-direction:column;gap:10px;max-height:500px;overflow-y:auto}.player{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#4ade800d;border-radius:8px;border:1px solid rgba(74,222,128,.1)}.game-area{text-align:center}.game-area h2{margin-bottom:30px;font-size:24px}.waiting{padding:60px 20px;opacity:.7}.answer-form{display:flex;gap:10px;margin-top:30px}.answer-form input{flex:1}.progress-bar{width:100%;height:8px;background:#232337cc;border-radius:4px;margin:20px 0;overflow:hidden;border:1px solid rgba(74,222,128,.2)}.progress-fill{height:100%;background:linear-gradient(90deg,#4ade80,#22d3ee);transition:width .1s linear;box-shadow:0 0 10px #4ade8080}.chat{display:flex;flex-direction:column;height:650px;padding:20px}.messages{flex:1;overflow-y:auto;margin-bottom:15px}.message{margin-bottom:10px;padding:8px 12px;background:#232337b3;border-radius:8px;border:1px solid rgba(74,222,128,.1)}.message-author{font-weight:600;margin-bottom:4px;color:#22d3ee}.chat-input{display:flex;gap:10px;align-items:stretch}.chat-input input{flex:1}.chat-input button{min-width:50px;padding:12px 16px}.scoreboard{margin-top:30px}.scoreboard h2{margin-bottom:20px}.score-item{display:flex;justify-content:space-between;padding:15px;background:#4ade800d;border-radius:10px;margin-bottom:10px;font-size:18px;border:1px solid rgba(74,222,128,.1)}.score-item:first-child{background:linear-gradient(135deg,#ffd70033,#ffd7000d);border:1px solid rgba(255,215,0,.4);color:gold;font-weight:700}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#4ade80;cursor:pointer;box-shadow:0 2px 4px #0000004d;transition:all .2s}input[type=range]::-webkit-slider-thumb:hover{background:#22c55e;transform:scale(1.2)}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#4ade80;cursor:pointer;border:none;box-shadow:0 2px 4px #0000004d;transition:all .2s}input[type=range]::-moz-range-thumb:hover{background:#22c55e;transform:scale(1.2)}.notification{position:fixed;top:20px;right:20px;padding:15px 20px;background:#28283cf2;border-radius:10px;box-shadow:0 4px 20px #00000059;z-index:9999;animation:slideInRight .3s ease-out;border:1px solid rgba(74,222,128,.2)}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}@keyframes rainbow{0%{color:red}14%{color:#ff7f00}28%{color:#ff0}42%{color:#0f0}57%{color:#00f}71%{color:indigo}85%{color:#9400d3}to{color:red}}@keyframes sparkle{0%,to{text-shadow:0 0 5px currentColor,0 0 10px currentColor;opacity:1}50%{text-shadow:0 0 20px currentColor,0 0 30px currentColor,0 0 40px currentColor;opacity:.9}}@keyframes glow-pulse{0%,to{filter:drop-shadow(0 0 5px currentColor)}50%{filter:drop-shadow(0 0 15px currentColor) drop-shadow(0 0 25px currentColor)}}.notification.success{border-left:4px solid #4ade80;box-shadow:0 4px 20px #00000080,0 0 15px #4ade8033}.notification.error{border-left:4px solid #ef4444;box-shadow:0 4px 20px #00000080,0 0 15px #ef444433}.notification.info{border-left:4px solid #22d3ee;box-shadow:0 4px 20px #00000080,0 0 15px #22d3ee33}@media(max-width:1024px){.game-container{grid-template-columns:1fr 1fr}.game-container>.card:first-child{grid-column:1 / -1}}@media(max-width:768px){.app{padding:10px}.header{flex-wrap:wrap;gap:10px}.header h1{font-size:22px;width:100%}.game-container{grid-template-columns:1fr;gap:15px}.card{padding:15px;border-radius:12px}.auth-container{margin:50px 15px;padding:25px}.auth-container h1{font-size:26px}.players-list{flex-direction:row;flex-wrap:wrap;gap:8px;max-height:none}.player{padding:8px 12px;font-size:14px;flex:0 0 auto}.game-area h2{font-size:20px;margin-bottom:20px}.waiting{padding:40px 15px}.answer-form{flex-direction:column;gap:10px}.answer-form input,.answer-form button{width:100%}.chat{height:400px;padding:15px}.messages{font-size:14px}.message{padding:6px 10px}.chat-input{flex-direction:row}.chat-input button{min-width:60px}.score-item{padding:12px;font-size:16px}.btn{padding:10px 18px;font-size:15px}.input{padding:10px 14px;font-size:16px}.notification{left:10px;right:10px;max-width:none}}@media(max-width:400px){.app{padding:8px}.header h1{font-size:18px}.card{padding:12px}.player{padding:6px 10px;font-size:13px}.chat{height:350px}}.lobby-grid{display:grid;grid-template-columns:1fr 350px;gap:30px;margin-bottom:40px}.lobby-hero h1{font-size:48px;margin-bottom:15px;background:linear-gradient(135deg,#4ade80,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 40px rgba(74,222,128,.3)}@media(max-width:1024px){.lobby-grid{grid-template-columns:1fr}.lobby-sidebar{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}}@media(max-width:768px){.lobby-hero h1{font-size:36px}.lobby-hero p{font-size:16px}.lobby-sidebar{grid-template-columns:1fr}.lobby-footer{flex-direction:column;text-align:center}}@media(max-width:500px){.lobby-hero h1{font-size:28px}}
