:root{--color-primary: #e8c032;--color-secondary: #0d0d18;--color-accent: #ff6b35;--bg: #0a0a0f;--bg-surface: rgba(255,255,255,.04);--bg-surface-hover: rgba(255,255,255,.08);--bg-glass: rgba(10,10,20,.75);--text: #f0f0f0;--text-muted: rgba(240,240,240,.55);--border: rgba(255,255,255,.08);--border-accent: rgba(255,255,255,.15);--radius: 14px;--radius-sm: 8px;--radius-xs: 5px;--shadow: 0 8px 32px rgba(0,0,0,.5);--shadow-sm: 0 2px 12px rgba(0,0,0,.4);--transition: .2s ease;--font-display: "Rajdhani", sans-serif;--font-body: "Inter", sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}img{display:block}button{cursor:pointer;font-family:inherit;border:none}a{text-decoration:none;color:inherit}input,select{font-family:inherit}.app{min-height:100vh;display:flex;flex-direction:column}.navbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:60px;background:#0a0a0fd9;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}.nav-logo{font-family:var(--font-display);font-size:1.6rem;font-weight:700;letter-spacing:.5px;color:var(--text);transition:opacity var(--transition)}.nav-logo:hover{opacity:.85}.logo-highlight{color:var(--color-primary)}.nav-right{display:flex;align-items:center;gap:12px}.nav-user{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;background:var(--bg-surface);border:1px solid var(--border);border-radius:40px;transition:background var(--transition),border-color var(--transition)}.nav-user:hover{background:var(--bg-surface-hover);border-color:var(--border-accent)}.nav-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--color-primary)}.nav-username{font-size:.875rem;font-weight:500;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-steam{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#1b2838;border:1px solid #2a3f5f;border-radius:var(--radius-sm);color:#c7d5e0;font-size:.875rem;font-weight:500;transition:background var(--transition),border-color var(--transition)}.btn-steam:hover{background:#243447;border-color:#4a90d9;color:#fff}.steam-icon{width:18px;height:18px;fill:#c7d5e0;flex-shrink:0}.main-page{position:relative;flex:1;min-height:calc(100vh - 60px);transition:background var(--transition)}.game-bg{position:fixed;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center top;background-repeat:no-repeat;z-index:0;opacity:.18;filter:blur(2px) saturate(1.4);transition:background-image .4s ease}.main-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,#0a0a0fb3,#0a0a0fd9 40%,#0a0a0ff7);z-index:1;pointer-events:none}.main-content{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:0 20px 80px}.hero{text-align:center;padding:80px 20px 60px}.hero-title{font-family:var(--font-display);font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;line-height:1;letter-spacing:1px;margin-bottom:12px;text-shadow:0 2px 20px rgba(0,0,0,.5)}.hero-highlight{color:var(--color-primary)}.hero-sub{color:var(--text-muted);font-size:1.1rem;margin-bottom:36px}.quick-games{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:20px}.quick-label{color:var(--text-muted);font-size:.85rem}.quick-chip{padding:6px 16px;background:var(--bg-surface);border:1px solid var(--border);border-radius:20px;font-size:.85rem;color:var(--text-muted);transition:all var(--transition)}.quick-chip:hover{background:var(--bg-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.search-wrap{position:relative;max-width:600px;margin:0 auto}.search-box{display:flex;align-items:center;gap:12px;background:#ffffff0f;border:1px solid var(--border-accent);border-radius:var(--radius);padding:0 16px;height:56px;transition:border-color var(--transition),background var(--transition),box-shadow var(--transition)}.search-box:focus-within{border-color:var(--color-primary);background:#ffffff14;box-shadow:0 0 0 3px #e8c03226}.search-icon{width:20px;height:20px;color:var(--text-muted);flex-shrink:0}.search-input{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:1rem;font-weight:400}.search-input::placeholder{color:var(--text-muted)}.search-spinner{width:18px;height:18px;border:2px solid var(--border-accent);border-top-color:var(--color-primary);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#14141f;border:1px solid var(--border-accent);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);z-index:200;animation:dropIn .15s ease}@keyframes dropIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.search-result{display:flex;align-items:center;gap:12px;padding:10px 16px;cursor:pointer;transition:background var(--transition)}.search-result:hover{background:var(--bg-surface-hover)}.result-img-wrap{width:56px;height:36px;border-radius:var(--radius-xs);overflow:hidden;flex-shrink:0}.result-img{width:100%;height:100%;object-fit:cover}.result-img-placeholder{width:100%;height:100%;background:var(--bg-surface)}.result-info{flex:1;min-width:0}.result-name{display:block;font-weight:500;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-genres{display:block;font-size:.75rem;color:var(--text-muted);margin-top:2px}.result-rating{font-size:.8rem;color:#f0c040;white-space:nowrap}.game-section{padding:0 0 40px}.game-header-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px;flex-wrap:wrap}.game-header-info{display:flex;align-items:center;gap:16px}.game-thumb{width:80px;height:50px;object-fit:cover;border-radius:var(--radius-sm);border:2px solid var(--color-primary);box-shadow:0 0 16px #0006}.game-title{font-family:var(--font-display);font-size:1.8rem;font-weight:700;letter-spacing:.5px}.game-genres{color:var(--text-muted);font-size:.85rem;margin-top:4px}.login-hint{color:var(--text-muted);font-size:.85rem;font-style:italic}.rooms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}.rooms-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--text-muted);display:flex;flex-direction:column;align-items:center;gap:16px}.room-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;display:flex;flex-direction:column;gap:12px;transition:all var(--transition);animation:fadeUp .2s ease}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.room-card:hover{border-color:var(--border-accent);background:var(--bg-surface-hover);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.room-card--active{border-color:var(--color-primary)!important;box-shadow:0 0 0 1px var(--color-primary),0 4px 20px #e8c03233}.room-card--full{opacity:.6}.room-card-top{display:flex;align-items:flex-start;gap:10px}.room-flag{font-size:1.2rem;flex-shrink:0;margin-top:2px}.room-title{font-weight:600;font-size:.95rem;line-height:1.3}.room-creator-row{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--text-muted)}.creator-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover}.creator-avatar--placeholder{background:var(--bg-surface-hover)}.creator-name{flex:1}.room-time{margin-left:auto}.room-slots-row{display:flex;align-items:center;gap:10px}.slots-bar{display:flex;gap:4px;flex:1}.slot-pip{flex:1;height:5px;border-radius:3px;background:var(--bg-surface-hover);transition:background var(--transition)}.slot-pip--on{background:var(--color-primary)}.slots-label{font-size:.8rem;color:var(--text-muted);white-space:nowrap}.slots-label--full{color:#f44}.btn-join{width:100%;padding:9px;background:var(--bg-surface-hover);border:1px solid var(--border-accent);border-radius:var(--radius-sm);color:var(--text);font-size:.875rem;font-weight:600;transition:all var(--transition)}.btn-join:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:#000}.btn-join--active{background:#e8c0321f;border-color:var(--color-primary);color:var(--color-primary)}.btn-join--full{color:var(--text-muted);cursor:not-allowed}.btn-primary{padding:10px 20px;background:var(--color-primary);border:none;border-radius:var(--radius-sm);color:#000;font-size:.9rem;font-weight:700;letter-spacing:.3px;transition:opacity var(--transition),transform var(--transition)}.btn-primary:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-full{width:100%}.btn-secondary{padding:8px 18px;background:var(--bg-surface);border:1px solid var(--border-accent);border-radius:var(--radius-sm);color:var(--text);font-size:.875rem;font-weight:500;transition:all var(--transition)}.btn-secondary:hover{background:var(--bg-surface-hover);border-color:var(--color-primary);color:var(--color-primary)}.btn-ghost{padding:8px 18px;background:none;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:.875rem;transition:all var(--transition)}.btn-ghost:hover{border-color:var(--border-accent);color:var(--text)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .15s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:#12121c;border:1px solid var(--border-accent);border-radius:var(--radius);width:100%;max-width:460px;padding:28px;box-shadow:var(--shadow);animation:slideUp .2s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-header h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700}.modal-close{background:none;border:none;color:var(--text-muted);font-size:1.2rem;line-height:1;padding:4px;transition:color var(--transition)}.modal-close:hover{color:var(--text)}.modal-game-badge{display:flex;align-items:center;gap:12px;padding:12px;background:var(--bg-surface);border-radius:var(--radius-sm);margin-bottom:20px}.modal-game-img{width:64px;height:40px;object-fit:cover;border-radius:var(--radius-xs)}.modal-game-name{font-weight:600;font-size:.95rem}.modal-form{display:flex;flex-direction:column;gap:18px}.form-label{display:flex;flex-direction:column;gap:8px;font-size:.85rem;color:var(--text-muted);font-weight:500}.form-input{padding:10px 14px;background:var(--bg-surface);border:1px solid var(--border-accent);border-radius:var(--radius-sm);color:var(--text);font-size:.95rem;outline:none;transition:border-color var(--transition)}.form-input:focus{border-color:var(--color-primary)}.form-input::placeholder{color:var(--text-muted)}.form-select{padding:10px 14px;background:var(--bg-surface);border:1px solid var(--border-accent);border-radius:var(--radius-sm);color:var(--text);font-size:.95rem;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:border-color var(--transition)}.form-select:focus{border-color:var(--color-primary)}.form-select option{background:#12121c}.slots-selector{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}.slot-btn{width:42px;height:38px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:.9rem;font-weight:600;transition:all var(--transition)}.slot-btn:hover{border-color:var(--border-accent);color:var(--text)}.slot-btn--active{background:var(--color-primary);border-color:var(--color-primary);color:#000}.form-checkbox{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:.9rem;color:var(--text-muted)}.form-checkbox input{width:16px;height:16px;accent-color:var(--color-primary);cursor:pointer}.form-error{color:#f44;font-size:.85rem;padding:8px 12px;background:#ff44441a;border-radius:var(--radius-xs)}.chat-window{position:fixed;bottom:0;right:24px;width:340px;max-height:520px;background:#11111a;border:1px solid var(--border-accent);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0;box-shadow:var(--shadow);display:flex;flex-direction:column;z-index:200;transition:max-height .25s ease}.chat-window--min{max-height:48px}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#ffffff0a;border-bottom:1px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0;border-radius:var(--radius) var(--radius) 0 0}.chat-header:hover{background:#ffffff12}.chat-header-info{display:flex;flex-direction:column;gap:1px;min-width:0}.chat-room-name{font-weight:600;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-user-count{font-size:.72rem;color:var(--text-muted)}.chat-header-actions{display:flex;align-items:center;gap:4px}.chat-btn-icon{background:none;border:none;color:var(--text-muted);font-size:.85rem;padding:4px 6px;border-radius:var(--radius-xs);transition:all var(--transition);line-height:1}.chat-btn-icon:hover{background:var(--bg-surface-hover);color:var(--text)}.chat-btn-close:hover{color:#f44}.chat-btn-end:hover{color:#f90}.chat-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;min-height:0;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-track{background:transparent}.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.chat-empty{color:var(--text-muted);font-size:.85rem;text-align:center;padding:20px}.chat-msg{display:flex;gap:8px;align-items:flex-end;animation:msgIn .15s ease}@keyframes msgIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.chat-msg--own{flex-direction:row-reverse}.chat-msg-avatar{width:28px;height:28px;flex-shrink:0}.chat-msg-avatar img{width:28px;height:28px;border-radius:50%;object-fit:cover}.avatar-placeholder{width:28px;height:28px;border-radius:50%;background:var(--bg-surface-hover);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:var(--text-muted);text-transform:uppercase}.chat-bubble{max-width:220px;background:var(--bg-surface);border-radius:12px;padding:8px 12px;border:1px solid var(--border)}.chat-msg--own .chat-bubble{background:#e8c0321f;border-color:#e8c03240}.chat-sender{display:block;font-size:.7rem;color:var(--color-primary);font-weight:600;margin-bottom:2px}.chat-text{font-size:.875rem;line-height:1.4;word-break:break-word}.chat-ts{display:block;font-size:.68rem;color:var(--text-muted);margin-top:4px;text-align:right}.chat-voice-toggle{padding:8px 12px;border-top:1px solid var(--border);flex-shrink:0}.voice-toggle-btn{width:100%;padding:7px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:.8rem;transition:all var(--transition)}.voice-toggle-btn:hover{border-color:var(--border-accent);color:var(--text)}.voice-toggle-btn--active{background:#22c55e1a;border-color:#22c55e;color:#22c55e}.voice-panel{padding:10px 12px;background:#22c55e0f;border-top:1px solid rgba(34,197,94,.2);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.voice-status{display:flex;align-items:center;gap:6px;font-size:.8rem;color:#22c55e}.voice-live-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;animation:pulse 1.4s ease infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.voice-actions{display:flex;gap:6px}.voice-mute-btn{padding:5px 10px;background:#22c55e26;border:1px solid rgba(34,197,94,.3);border-radius:var(--radius-xs);color:#22c55e;font-size:.75rem;transition:all var(--transition)}.voice-mute-btn--muted{background:#ff44441a;border-color:#ff44444d;color:#f44}.voice-leave-btn{padding:5px 10px;background:#ff44441a;border:1px solid rgba(255,68,68,.2);border-radius:var(--radius-xs);color:#f44;font-size:.75rem;transition:all var(--transition)}.voice-leave-btn:hover{background:#f443}.voice-error{padding:8px 12px;color:#f44;font-size:.8rem;text-align:center}.chat-form{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--border);flex-shrink:0}.chat-input{flex:1;padding:8px 12px;background:var(--bg-surface);border:1px solid var(--border);border-radius:20px;color:var(--text);font-size:.875rem;outline:none;transition:border-color var(--transition)}.chat-input:focus{border-color:var(--color-primary)}.chat-input::placeholder{color:var(--text-muted)}.chat-send-btn{width:36px;height:36px;background:var(--color-primary);border:none;border-radius:50%;color:#000;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity var(--transition),transform var(--transition)}.chat-send-btn:hover{opacity:.85;transform:scale(1.05)}.profile-page{max-width:800px;margin:0 auto;padding:40px 20px 80px}.profile-hero{display:flex;align-items:center;gap:28px;padding:32px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:32px;flex-wrap:wrap}.profile-avatar{width:96px;height:96px;border-radius:var(--radius-sm);object-fit:cover;border:3px solid var(--color-primary);box-shadow:0 0 24px #e8c0324d;flex-shrink:0}.profile-info{flex:1;min-width:200px}.profile-name{font-family:var(--font-display);font-size:2rem;font-weight:700;margin-bottom:16px}.profile-stats{display:flex;gap:20px;margin-bottom:20px}.stat-box{display:flex;flex-direction:column;align-items:center;padding:10px 20px;background:var(--bg-surface-hover);border-radius:var(--radius-sm);border:1px solid var(--border)}.stat-num{font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:var(--color-primary)}.stat-label{font-size:.75rem;color:var(--text-muted)}.profile-actions{display:flex;gap:10px;flex-wrap:wrap}.section-title{font-family:var(--font-display);font-size:1.4rem;font-weight:700;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border)}.history-empty{text-align:center;padding:60px 20px;color:var(--text-muted);display:flex;flex-direction:column;align-items:center;gap:16px}.history-list{display:flex;flex-direction:column;gap:10px}.history-item{display:flex;align-items:center;gap:16px;padding:14px 18px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);transition:all var(--transition)}.history-item:hover{border-color:var(--border-accent);background:var(--bg-surface-hover)}.history-img-wrap{flex-shrink:0}.history-game-img{width:72px;height:44px;object-fit:cover;border-radius:var(--radius-xs)}.history-game-img--placeholder{background:var(--bg-surface-hover)}.history-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.history-game-name{font-weight:600;font-size:.9rem}.history-room-title{font-size:.82rem;color:var(--text-muted)}.history-date{font-size:.75rem;color:var(--text-muted)}.history-status{padding:4px 10px;border-radius:20px;font-size:.75rem;font-weight:600;background:#ffffff0d;color:var(--text-muted);border:1px solid var(--border);white-space:nowrap}.history-status--active{background:#22c55e1a;color:#22c55e;border-color:#22c55e4d}.loading-spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite;margin:60px auto}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-accent);border-radius:3px}@media (max-width: 640px){.chat-window{right:0;left:0;width:100%;border-radius:var(--radius) var(--radius) 0 0;border-left:none;border-right:none}.hero{padding:50px 10px 40px}.game-header-bar{flex-direction:column;align-items:flex-start}.profile-hero{flex-direction:column;text-align:center}.profile-stats,.profile-actions{justify-content:center}}.wallpaper-slide{position:fixed;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;transition:opacity 1.5s ease-in-out;z-index:0;pointer-events:none}.wallpaper-slide--on{opacity:1}.stats-bar{position:fixed;bottom:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:center;gap:0;padding:10px 20px;background:#0a0a14d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--border);font-size:.82rem;color:var(--text-muted);flex-wrap:wrap}.stats-item{display:flex;align-items:center;gap:6px}.stats-item strong{color:var(--color-primary);font-weight:700}.stats-sep{margin:0 14px;opacity:.35}.stats-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 6px #22c55e;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.game-header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.btn-sm{padding:7px 16px;font-size:.82rem;border-radius:var(--radius-sm)}.main-page{padding-bottom:48px}.lang-switcher{position:relative;display:flex;align-items:center}.lang-btn{display:flex;align-items:center;gap:5px;padding:4px 10px;background:#ffffff12;border:1px solid var(--border);border-radius:var(--radius-xs);color:var(--text-muted);font-size:.8rem;cursor:pointer;transition:all var(--transition)}.lang-btn:hover{background:#ffffff1f;color:var(--text);border-color:var(--border-accent)}.lang-code{font-weight:600;letter-spacing:.04em}.lang-dropdown{position:absolute;bottom:calc(100% + 8px);right:0;background:#0f0f1cf7;border:1px solid var(--border-accent);border-radius:var(--radius-sm);padding:6px;display:flex;flex-direction:column;gap:2px;min-width:150px;box-shadow:var(--shadow);z-index:200;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.lang-option{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius-xs);background:transparent;border:none;color:var(--text-muted);font-size:.85rem;text-align:left;cursor:pointer;transition:all var(--transition);white-space:nowrap}.lang-option:hover{background:var(--bg-surface-hover);color:var(--text)}.lang-option--active{color:var(--color-primary);background:#e8c03214}