@keyframes glow-rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes top-line-flow{0%,100%{background-position:-100% 0}50%{background-position:100% 0}}@keyframes hologram-border{0%{transform:rotate(0);filter:hue-rotate(0deg) brightness(1)}25%{filter:hue-rotate(90deg) brightness(1.3)}50%{filter:hue-rotate(180deg) brightness(.8)}75%{filter:hue-rotate(270deg) brightness(1.3)}100%{transform:rotate(360deg);filter:hue-rotate(360deg) brightness(1)}}@keyframes hologram-scan{0%,100%{background-position:0 0,-100% -100%;opacity:.6}25%{background-position:0 -10px,-50% -50%;opacity:.8}50%{background-position:0 -20px,0 0;opacity:1}75%{background-position:0 -30px,50% 50%;opacity:.8}100%{background-position:0 -40px,100% 100%;opacity:.6}}@keyframes title-glow{0%,100%{background-position:0 50%;filter:drop-shadow(0 0 10px rgba(0, 245, 255, .3))}50%{background-position:100% 50%;filter:drop-shadow(0 0 20px rgba(0, 245, 255, .8))}}@keyframes icon-glow-pulse{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.requirement-hall-container{padding-top:calc(var(--navbar-height) + 10px);width:1200px;margin:0 auto}.search-filter-section{background:linear-gradient(135deg,rgba(15,23,42,.95),rgba(30,41,59,.9),rgba(15,23,42,.95));border-radius:16px;padding:32px 28px;margin-bottom:24px;box-shadow:0 8px 32px rgba(0,0,0,.4),0 0 0 1px rgba(59,130,246,.2),inset 0 1px 0 rgba(255,255,255,.1);backdrop-filter:blur(20px);border:1px solid rgba(148,163,184,.1);position:relative;overflow:hidden}.search-filter-section::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0,#3b82f6 20%,#06b6d4 40%,#10b981 60%,#3b82f6 80%,transparent 100%);background-size:200% 100%;animation:top-line-flow 6s ease-in-out infinite}.search-filter-container{display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;z-index:2}.search-filter-left{display:flex;align-items:center;gap:24px;flex:1}.search-area{flex-shrink:0}.search-input-wrapper{position:relative;width:360px}.search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#64748b;font-size:16px;z-index:2}.search-input{width:100%;padding:14px 52px 14px 50px;background:rgba(30,30,45,.8);border:1px solid rgba(59,130,246,.3);border-radius:12px;color:#f1f5f9;font-size:15px;backdrop-filter:blur(8px);transition:all .3s ease}.search-input:focus{outline:0;border-color:rgba(59,130,246,.6);box-shadow:0 0 20px rgba(59,130,246,.2)}.search-input::placeholder{color:#64748b}.search-clear-btn{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:0 0;border:none;color:#64748b;font-size:16px;cursor:pointer;padding:4px;border-radius:50%;transition:all .3s ease}.search-clear-btn:hover{color:#ef4444;background:rgba(239,68,68,.1)}.filter-area{display:flex;align-items:center;flex-wrap:wrap}.filter-row{display:flex;align-items:center;gap:24px}.filter-group{display:flex;align-items:center}.filter-tabs{display:flex;background:rgba(30,30,45,.8);border-radius:6px;border:1px solid rgba(148,163,184,.2);backdrop-filter:blur(8px);overflow:hidden}.filter-tab{padding:10px 18px;font-size:14px;font-weight:500;color:#94a3b8;cursor:pointer;transition:all .3s ease;border-right:1px solid rgba(148,163,184,.2);white-space:nowrap;position:relative}.filter-tab:last-child{border-right:none}.filter-tab:hover{color:#f1f5f9;background:rgba(59,130,246,.1)}.filter-tab.active{background:rgba(59,130,246,.2);color:#3b82f6;box-shadow:inset 0 0 10px rgba(59,130,246,.3)}.sort-tab{display:flex;align-items:center;gap:6px;min-width:90px;justify-content:center}.sort-tab .sort-icon{font-size:12px;transition:transform .3s ease;opacity:.7}.sort-tab.active .sort-icon{opacity:1;color:#3b82f6}.sort-tab:hover .sort-icon{opacity:1;transform:scale(1.1)}.sort-tab[data-sort-order=asc] .sort-icon{transform:rotate(180deg)}.sort-tab[data-sort-order=desc] .sort-icon{transform:rotate(0)}.filter-select{padding:10px 14px;background:rgba(30,30,45,.8);border:1px solid rgba(148,163,184,.2);border-radius:8px;color:#f1f5f9;font-size:14px;backdrop-filter:blur(8px);min-width:160px;cursor:pointer;transition:all .3s ease}.filter-select:focus{outline:0;border-color:rgba(59,130,246,.5);box-shadow:0 0 16px rgba(59,130,246,.2)}.filter-select option{background:rgba(30,30,45,.95);color:#f1f5f9}.actions-right{display:flex;align-items:center;flex-shrink:0}.action-buttons{display:flex;gap:16px}.room-action-btn{position:relative;display:flex;align-items:center;border:none;border-radius:16px;overflow:hidden;transition:all .4s cubic-bezier(.4, 0, .2, 1);cursor:pointer;padding:0;min-width:180px;backdrop-filter:blur(12px)}.my-rooms-btn{background:linear-gradient(135deg,rgba(59,130,246,.15) 0,rgba(37,99,235,.2) 50%,rgba(29,78,216,.15) 100%);border:2px solid rgba(59,130,246,.4);box-shadow:0 8px 32px rgba(59,130,246,.25),0 0 0 1px rgba(59,130,246,.1),inset 0 1px 0 rgba(255,255,255,.1)}.create-room-btn{background:linear-gradient(135deg,rgba(34,197,94,.15) 0,rgba(22,163,74,.2) 50%,rgba(21,128,61,.15) 100%);border:2px solid rgba(34,197,94,.4);box-shadow:0 8px 32px rgba(34,197,94,.25),0 0 0 1px rgba(34,197,94,.1),inset 0 1px 0 rgba(255,255,255,.1)}.room-action-btn .btn-glow{position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border-radius:18px;opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:-1}.my-rooms-btn .btn-glow{background:linear-gradient(45deg,rgba(59,130,246,.4),rgba(37,99,235,.5),rgba(29,78,216,.4))}.create-room-btn .btn-glow{background:linear-gradient(45deg,rgba(34,197,94,.4),rgba(22,163,74,.5),rgba(21,128,61,.4))}.room-action-btn:hover .btn-glow{opacity:1}.btn-content{display:flex;align-items:center;gap:14px;padding:8px 20px;position:relative;z-index:2;width:100%}.btn-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:12px;border:2px solid;position:relative;overflow:hidden;transition:all .4s cubic-bezier(.4, 0, .2, 1);flex-shrink:0}.my-rooms-btn .btn-icon{background:linear-gradient(135deg,rgba(59,130,246,.3) 0,rgba(37,99,235,.4) 100%);border-color:rgba(59,130,246,.6);box-shadow:0 4px 16px rgba(59,130,246,.3)}.create-room-btn .btn-icon{background:linear-gradient(135deg,rgba(34,197,94,.3) 0,rgba(22,163,74,.4) 100%);border-color:rgba(34,197,94,.6);box-shadow:0 4px 16px rgba(34,197,94,.3)}.btn-icon i{font-size:20px;z-index:2;transition:all .4s cubic-bezier(.4, 0, .2, 1)}.my-rooms-btn .btn-icon i{color:#3b82f6;filter:drop-shadow(0 2px 4px rgba(59, 130, 246, .5))}.create-room-btn .btn-icon i{color:#22c55e;filter:drop-shadow(0 2px 4px rgba(34, 197, 94, .5))}.btn-infos{display:flex;flex-direction:column;gap:2px;flex:1}.btn-name{font-size:15px;color:#f1f5f9;font-weight:700;line-height:1.2;transition:all .3s ease;white-space:nowrap;text-shadow:0 2px 4px rgba(0,0,0,.4)}.btn-desc{font-size:11px;color:#94a3b8;font-weight:500;line-height:1.3;transition:all .3s ease;opacity:.8}.my-rooms-btn:hover{transform:translateY(-2px) scale(1.02);border-color:rgba(59,130,246,.8);background:linear-gradient(135deg,rgba(59,130,246,.25) 0,rgba(37,99,235,.3) 50%,rgba(29,78,216,.25) 100%);box-shadow:0 12px 48px rgba(59,130,246,.4),0 0 60px rgba(59,130,246,.2),0 0 0 1px rgba(59,130,246,.3),inset 0 1px 0 rgba(255,255,255,.2)}.create-room-btn:hover{transform:translateY(-2px) scale(1.02);border-color:rgba(34,197,94,.8);background:linear-gradient(135deg,rgba(34,197,94,.25) 0,rgba(22,163,74,.3) 50%,rgba(21,128,61,.25) 100%);box-shadow:0 12px 48px rgba(34,197,94,.4),0 0 60px rgba(34,197,94,.2),0 0 0 1px rgba(34,197,94,.3),inset 0 1px 0 rgba(255,255,255,.2)}.my-rooms-btn:hover .btn-icon{transform:scale(1.1) rotate(-2deg);background:linear-gradient(135deg,rgba(59,130,246,.5) 0,rgba(37,99,235,.6) 100%);border-color:rgba(59,130,246,.8);box-shadow:0 6px 24px rgba(59,130,246,.5)}.create-room-btn:hover .btn-icon{transform:scale(1.1) rotate(2deg);background:linear-gradient(135deg,rgba(34,197,94,.5) 0,rgba(22,163,74,.6) 100%);border-color:rgba(34,197,94,.8);box-shadow:0 6px 24px rgba(34,197,94,.5)}.my-rooms-btn:hover .btn-icon i{transform:scale(1.15);color:#60a5fa;filter:drop-shadow(0 0 12px rgba(59, 130, 246, .8))}.create-room-btn:hover .btn-icon i{transform:scale(1.15);color:#34d399;filter:drop-shadow(0 0 12px rgba(34, 197, 94, .8))}.my-rooms-btn:hover .btn-name{color:#fff;text-shadow:0 0 12px rgba(59,130,246,.6)}.create-room-btn:hover .btn-name{color:#fff;text-shadow:0 0 12px rgba(34,197,94,.6)}.my-rooms-btn:hover .btn-desc{color:#cbd5e1;opacity:1}.create-room-btn:hover .btn-desc{color:#cbd5e1;opacity:1}.room-action-btn:active{transform:translateY(-1px) scale(1.01)}.rooms-list-section{margin-bottom:30px}.rooms-container{position:relative;min-height:400px}.rooms-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;position:relative;background:radial-gradient(circle at 50% 50%,rgba(0,245,255,.05) 0,transparent 50%),linear-gradient(45deg,transparent 30%,rgba(0,245,255,.02) 50%,transparent 70%);border-radius:20px;overflow:hidden;gap:30px}.rooms-loading::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,transparent 0,rgba(0,245,255,.02) 1px,transparent 2px,transparent 8px);animation:loading-scan 2s ease-in-out infinite}.loading-spinner{position:relative;width:80px;height:80px;border-radius:50%;border:3px solid transparent;background:linear-gradient(rgba(5,15,25,.9),rgba(5,15,25,.9)) padding-box,conic-gradient(from 0deg,#00f5ff,#0080ff,#8000ff,#ff0080,#ff8000,#00f5ff) border-box;animation:loading-rotation 2s linear infinite;font-size:32px;display:flex;align-items:center;justify-content:center;color:#00f5ff;text-shadow:0 0 20px rgba(0,245,255,.8)}.loading-spinner::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;background:radial-gradient(circle,rgba(0,245,255,.3) 0,transparent 70%);border-radius:50%;animation:loading-pulse 1.5s ease-in-out infinite}.loading-text{color:#00f5ff;font-size:18px;font-weight:600;text-shadow:0 0 10px rgba(0,245,255,.5);background:linear-gradient(45deg,#00f5ff,#fff,#0080ff);background-size:200% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:loading-text-flow 3s ease-in-out infinite;z-index:2;position:relative}@keyframes loading-rotation{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes loading-pulse{0%,100%{transform:translate(-50%,-50%) scale(.8);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}}@keyframes loading-text-flow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes loading-scan{0%,100%{background-position:0 0;opacity:.6}50%{background-position:0 -20px;opacity:1}}.loading-text{font-size:16px;font-weight:500}.rooms-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;color:#64748b;gap:20px}.empty-icon{font-size:64px;opacity:.6}.empty-title{font-size:24px;font-weight:600;color:#94a3b8}.empty-desc{font-size:16px;text-align:center;max-width:400px;line-height:1.5}.rooms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:20px 0;position:relative;perspective:2000px}.rooms-grid::before{content:'';position:absolute;top:-20px;left:-20px;right:-20px;bottom:-20px;background:radial-gradient(circle at 20% 20%,rgba(0,245,255,.05) 0,transparent 50%),radial-gradient(circle at 80% 80%,rgba(128,0,255,.05) 0,transparent 50%),linear-gradient(45deg,transparent 40%,rgba(0,245,255,.02) 50%,transparent 60%);animation:grid-background-pulse 8s ease-in-out infinite;pointer-events:none;border-radius:20px}@keyframes grid-background-pulse{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.02)}}.room-card{position:relative;border-radius:20px;padding:0;border:2px solid transparent;background-clip:padding-box;box-shadow:0 0 0 2px rgba(0,245,255,.3),0 8px 32px rgba(0,0,0,.6),0 0 40px rgba(0,245,255,.1),inset 0 2px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,245,255,.2);backdrop-filter:blur(20px);transition:all .4s cubic-bezier(.4, 0, .2, 1);overflow:hidden;cursor:pointer;transform-style:preserve-3d;perspective:1000px;animation:room-card-enter .6s ease-out}@keyframes room-card-enter{0%{opacity:0;transform:translateY(30px) rotateX(-15deg) scale(.9)}50%{opacity:.7;transform:translateY(-5px) rotateX(5deg) scale(1.02)}100%{opacity:1;transform:translateY(0) rotateX(0) scale(1)}}.room-card-header{position:relative;padding:20px 20px 16px 20px;border-bottom:1px solid rgba(255,255,255,.06);z-index:2}.room-title-center{display:flex;justify-content:center;margin-bottom:16px}.room-title{font-size:20px;font-weight:800;background:linear-gradient(45deg,#00f5ff 0,#fff 25%,#0080ff 50%,#fff 75%,#00f5ff 100%);background-size:200% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:title-glow 3s ease-in-out infinite;line-height:1.3;flex:1;margin:0;max-width:280px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;text-shadow:0 0 20px rgba(0,245,255,.5);filter:drop-shadow(0 0 10px rgba(0, 245, 255, .3))}.room-card-body{position:relative;padding:16px 20px;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center}.room-requirement-info{display:flex;align-items:center;gap:16px}.room-items-preview{display:flex;align-items:center;justify-content:center;width:100%}.items-preview-list{display:flex;gap:8px;flex-wrap:wrap;perspective:1000px;justify-content:center}.item-preview{width:60px;height:60px;border-radius:8px;border:2px solid transparent;background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,#00f5ff,#0080ff,#8000ff,#ff0080);background-clip:padding-box,border-box;background-origin:padding-box,border-box;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.4, 0, .2, 1);position:relative;overflow:hidden;cursor:pointer;transform-style:preserve-3d}.item-preview::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent 30%,rgba(0,245,255,.1) 50%,transparent 70%);opacity:0;transition:opacity .3s ease;animation:item-shimmer 3s ease-in-out infinite}.item-preview img{width:90%;height:90%;object-fit:contain;border-radius:4px;z-index:2;transition:all .3s ease}.item-preview:hover{transform:translateY(-4px) rotateX(10deg) rotateY(5deg) scale(1.2);box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(0,245,255,.4)}.item-preview:hover::before{opacity:1}@keyframes item-shimmer{0%,100%{transform:translateX(-100%);opacity:0}50%{transform:translateX(100%);opacity:.6}}.item-preview.grade-1{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(255,255,255,.3),rgba(200,200,200,.2))}.item-preview.grade-1:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(255,255,255,.3)}.item-preview.grade-2{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(76,175,80,.4),rgba(56,142,60,.3))}.item-preview.grade-2:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(76,175,80,.4)}.item-preview.grade-3{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(33,150,243,.4),rgba(21,101,192,.3))}.item-preview.grade-3:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(33,150,243,.4)}.item-preview.grade-4{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(156,39,176,.4),rgba(123,31,162,.3))}.item-preview.grade-4:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(156,39,176,.4)}.item-preview.grade-5{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(255,193,7,.4),rgba(245,127,23,.3))}.item-preview.grade-5:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(255,193,7,.4)}.item-preview.grade-6{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(244,67,54,.4),rgba(211,47,47,.3))}.item-preview.grade-6:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(244,67,54,.4)}.item-preview.grade-10,.item-preview.grade-7,.item-preview.grade-8,.item-preview.grade-9{background:linear-gradient(135deg,rgba(30,30,45,.8),rgba(45,45,70,.6)),linear-gradient(135deg,rgba(233,30,99,.4),rgba(136,14,79,.3));position:relative}.item-preview.grade-10:hover,.item-preview.grade-7:hover,.item-preview.grade-8:hover,.item-preview.grade-9:hover{box-shadow:0 15px 35px rgba(0,0,0,.5),0 0 30px rgba(233,30,99,.4)}.item-preview.grade-10::after,.item-preview.grade-7::after,.item-preview.grade-8::after,.item-preview.grade-9::after{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(45deg,#ff6ec7,#f39c12,#e67e22,#e74c3c,#9b59b6,#3498db,#1abc9c,#2ecc71);background-size:400% 400%;border-radius:10px;z-index:-1;animation:rainbow-glow 2s ease-in-out infinite}@keyframes rainbow-glow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}.items-count-more{font-size:12px;color:#64748b;font-weight:500}.room-creator-info{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:rgba(30,30,45,.6);border-radius:12px;border:1px solid rgba(255,255,255,.08)}.creator-details{display:flex;align-items:center;gap:12px}.creator-avatar-small{position:relative;width:32px;height:32px;flex-shrink:0}.creator-avatar-small img{width:100%;height:100%;border-radius:50%;border:2px solid rgba(59,130,246,.3);object-fit:cover;transition:all .3s ease}.creator-avatar{position:relative;width:36px;height:36px}.creator-avatar img{width:100%;height:100%;border-radius:50%;border:2px solid rgba(59,130,246,.3);object-fit:cover}.creator-status-dot{position:absolute;bottom:0;right:0;width:12px;height:12px;border-radius:50%;background:#22c55e;border:2px solid rgba(15,23,42,.9);box-shadow:0 0 8px rgba(34,197,94,.6);animation:creator-dot-pulse 2s ease-in-out infinite}.creator-status-dot.offline{background:#6b7280;box-shadow:0 0 8px rgba(107,114,128,.4);animation:none}@keyframes creator-dot-pulse{0%,100%{opacity:.8}50%{opacity:1}}.creator-text{display:flex;flex-direction:column;gap:2px;min-width:0}.creator-name-small{font-size:13px;font-weight:600;color:#f1f5f9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px}.creator-role{font-size:10px;color:#64748b;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.room-meta-tags{display:flex;align-items:center;gap:8px;flex-shrink:0}.user-count-tag{display:flex;align-items:center;gap:6px;padding:6px 12px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.3);border-radius:20px;font-size:11px;font-weight:600;color:#22c55e;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}.user-count-tag i{font-size:12px}.platform-tag{display:flex;align-items:center;gap:6px;padding:6px 12px;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.3);border-radius:20px;font-size:11px;font-weight:600;color:#3b82f6;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}.platform-tag i{font-size:12px}.creator-details{display:flex;gap:8px}.creator-name{font-size:14px;font-weight:600;color:#f1f5f9;line-height:1.2}.creator-role{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.5px}.room-stats{display:flex;align-items:center;gap:16px}.stat-item{display:flex;align-items:center;gap:6px;font-size:13px;color:#94a3b8}.stat-item i{font-size:14px;color:#3b82f6}.stat-value{font-weight:600;color:#f1f5f9}.room-card-footer{position:relative;padding:16px 20px;background:rgba(30,30,45,.5);border-top:1px solid rgba(255,255,255,.06);z-index:2;display:flex;justify-content:center}.room-join-btn{width:100%;padding:10px 16px;background:#3b82f6;border:none;border-radius:6px;color:#fff;font-size:13px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}.room-join-btn i{font-size:14px}.room-card.featured{border-color:rgba(251,191,36,.5);box-shadow:0 12px 48px rgba(0,0,0,.5),0 0 0 1px rgba(251,191,36,.3),inset 0 2px 0 rgba(255,255,255,.1)}.room-card.featured::before{background:linear-gradient(90deg,#fbbf24 0,#f59e0b 50%,#d97706 100%)}.room-card.hot{border-color:rgba(239,68,68,.5)}.room-card.hot::before{background:linear-gradient(90deg,#ef4444 0,#dc2626 50%,#b91c1c 100%)}.room-card.expired{opacity:.6;border-color:rgba(107,114,128,.5)}.room-card.expired::before{background:linear-gradient(90deg,#6b7280 0,#4b5563 50%,#374151 100%)}.room-status-badge{position:absolute;top:8px;right:8px;padding:4px 8px;border-radius:12px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;z-index:3}.room-status-badge.expired{background:rgba(107,114,128,.8);color:#d1d5db;border:1px solid rgba(107,114,128,.5)}.room-status-badge.mine{background:rgba(34,197,94,.8);color:#fff;border:1px solid rgba(34,197,94,.5)}.room-join-btn.expired{background:#6b7280;cursor:not-allowed;opacity:.6}.room-join-btn.my-room{background:#22c55e}.room-join-btn.full{background:#f59e0b;cursor:not-allowed;opacity:.8}.pagination-section{margin-top:40px;padding:20px 0}.pagination-container{display:flex;align-items:center;justify-content:center;gap:20px}.pagination-info{font-size:14px;color:#94a3b8}.pagination-controls{display:flex;align-items:center;gap:12px}.pagination-btn{padding:8px 16px;background:rgba(30,30,45,.8);border:1px solid rgba(148,163,184,.2);border-radius:8px;color:#94a3b8;font-size:14px;cursor:pointer;transition:all .3s ease;backdrop-filter:blur(8px);display:flex;align-items:center;gap:6px}.pagination-btn:hover:not(:disabled){border-color:rgba(59,130,246,.4);color:#f1f5f9;background:rgba(59,130,246,.1)}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-pages{display:flex;gap:6px}.pagination-page{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(30,30,45,.8);border:1px solid rgba(148,163,184,.2);border-radius:6px;color:#94a3b8;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.pagination-page:hover{border-color:rgba(59,130,246,.4);color:#f1f5f9;background:rgba(59,130,246,.1)}.pagination-page.active{background:rgba(59,130,246,.2);border-color:rgba(59,130,246,.5);color:#3b82f6;box-shadow:0 0 16px rgba(59,130,246,.3)}.create-room-modal{z-index:1055}.create-room-modal .modal-dialog{max-width:900px;margin:1.75rem auto}.create-room-modal .modal-content{background:linear-gradient(145deg,rgba(15,23,42,.98),rgba(30,41,59,.95));border:1px solid rgba(148,163,184,.2);border-radius:20px;box-shadow:0 25px 50px rgba(0,0,0,.6),0 0 0 1px rgba(59,130,246,.2),inset 0 1px 0 rgba(255,255,255,.1);backdrop-filter:blur(20px);overflow:hidden;position:relative}.create-room-modal .modal-content::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0,#3b82f6 20%,#06b6d4 40%,#10b981 60%,#3b82f6 80%,transparent 100%);background-size:200% 100%;animation:top-line-flow 6s ease-in-out infinite}.create-room-modal .modal-header{padding:20px 24px 16px;border-bottom:1px solid rgba(148,163,184,.1);background:rgba(30,41,59,.3);position:relative}.modal-header-content{flex:1}.modal-title-wrapper{display:flex;align-items:center;gap:10px;margin-bottom:6px}.modal-icon{width:36px;height:36px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.modal-icon i{font-size:18px;color:#fff}.create-room-modal .modal-title{font-size:20px;font-weight:700;color:#f1f5f9;margin:0;background:linear-gradient(45deg,#f1f5f9,#3b82f6);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.modal-subtitle{font-size:13px;color:#94a3b8;margin:0;line-height:1.4}.modal-close-btn{width:36px;height:36px;background:rgba(30,30,45,.8);border:1px solid rgba(148,163,184,.2);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#64748b;transition:all .3s ease;flex-shrink:0}.modal-close-btn:hover{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.3);color:#ef4444;transform:scale(1.05)}.modal-close-btn i{font-size:16px}.create-room-modal .modal-body{padding:0;max-height:70vh;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.create-room-modal .modal-body::-webkit-scrollbar{display:none}.create-room-form{padding:0}.form-sections{display:flex;flex-direction:column;gap:0}.form-section{padding:10px 24px 10px;border-bottom:1px solid rgba(148,163,184,.1);position:relative}.form-section:last-child{border-bottom:none}.section-header{margin-bottom:16px}.section-header h4{font-size:16px;font-weight:600;color:#f1f5f9;margin:0 0 4px 0;display:flex;align-items:center;gap:6px}.section-header h4 i{font-size:14px;color:#3b82f6}.section-header p{font-size:13px;color:#94a3b8;margin:0;line-height:1.4}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.form-group{display:flex;flex-direction:column}.form-group-full{grid-column:1/-1}.form-label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:#f1f5f9;margin-bottom:6px}.form-label i{font-size:12px;color:#64748b}.required{color:#ef4444;font-size:11px}.form-control{background:rgba(30,30,45,.8);border:1px solid rgba(148,163,184,.2);border-radius:6px;color:#f1f5f9;font-size:13px;padding:10px 12px;transition:all .3s ease;backdrop-filter:blur(8px)}.form-control:focus{outline:0;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1);background:rgba(30,30,45,.9)}.form-control::placeholder{color:#64748b}.form-select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px 12px;padding-right:40px}.form-select option{background:rgba(30,30,45,.95);color:#f1f5f9}.form-hint{font-size:12px;color:#64748b;margin-top:6px;line-height:1.4}.datetime-input-wrapper{position:relative;cursor:pointer}.datetime-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:0 0;cursor:pointer;z-index:1}.datetime-input-wrapper input[type=datetime-local]{cursor:pointer;position:relative;z-index:2}.datetime-input-wrapper input[type=datetime-local]::-webkit-calendar-picker-indicator{position:absolute;top:0;left:0;right:0;bottom:0;width:auto;height:auto;color:transparent;background:0 0;cursor:pointer}.voice-options{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.voice-option{position:relative}.voice-option input[type=radio]{position:absolute;opacity:0;pointer-events:none}.voice-option-label{display:flex;align-items:center;padding:12px;background:rgba(30,30,45,.6);border:2px solid rgba(148,163,184,.2);border-radius:8px;cursor:pointer;transition:all .3s ease;gap:10px;position:relative}.voice-option-label:hover{background:rgba(30,30,45,.8);border-color:rgba(59,130,246,.4);transform:translateY(-1px)}.voice-option input:checked+.voice-option-label{background:rgba(59,130,246,.1);border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.voice-option-icon{width:36px;height:36px;background:rgba(59,130,246,.2);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.voice-option-icon i{font-size:16px;color:#3b82f6}.voice-option-content{flex:1}.voice-option-title{font-size:14px;font-weight:600;color:#f1f5f9;margin-bottom:3px}.voice-option-desc{font-size:12px;color:#94a3b8;line-height:1.3}.voice-option-check{width:24px;height:24px;opacity:0;transition:all .3s ease;flex-shrink:0}.voice-option input:checked+.voice-option-label .voice-option-check{opacity:1}.voice-option-check i{font-size:20px;color:#3b82f6}.custom-voice-link{margin-top:12px;padding:12px;background:rgba(59,130,246,.05);border:1px solid rgba(59,130,246,.2);border-radius:6px}.platform-options{display:flex;gap:12px;flex-wrap:wrap}.platform-option{position:relative;flex:1;min-width:150px}.platform-option input[type=radio]{position:absolute;opacity:0;pointer-events:none}.platform-option-label{display:flex;align-items:center;padding:12px;background:rgba(30,30,45,.6);border:2px solid rgba(148,163,184,.2);border-radius:8px;cursor:pointer;transition:all .3s ease;gap:10px;position:relative;width:100%;box-sizing:border-box}.platform-option-label:hover{background:rgba(30,30,45,.8);border-color:rgba(59,130,246,.4);transform:translateY(-1px)}.platform-option input:checked+.platform-option-label{background:rgba(59,130,246,.1);border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.platform-option-icon{width:36px;height:36px;background:rgba(59,130,246,.2);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.platform-option-icon i{font-size:16px;color:#3b82f6}.platform-option-content{flex:1}.platform-option-title{font-size:14px;font-weight:600;color:#f1f5f9;margin-bottom:2px}.platform-option-desc{font-size:12px;color:#94a3b8;line-height:1.3}.platform-option-check{width:20px;height:20px;opacity:0;transition:all .3s ease;flex-shrink:0}.platform-option input:checked+.platform-option-label .platform-option-check{opacity:1}.platform-option-check i{font-size:16px;color:#3b82f6}.requirement-selector{background:rgba(30,30,45,.3);border-radius:12px;border:1px solid rgba(148,163,184,.1);overflow:hidden}.requirements-container{position:relative;min-height:200px}.requirements-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;gap:16px}.loading-spinner{width:32px;height:32px;display:flex;align-items:center;justify-content:center}.loading-spinner i{font-size:24px;color:#3b82f6;animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}.loading-text{font-size:14px;color:#94a3b8}.requirements-list{max-height:300px;overflow-y:auto;padding:12px}.requirements-list::-webkit-scrollbar{width:6px}.requirements-list::-webkit-scrollbar-track{background:rgba(30,30,45,.3);border-radius:3px}.requirements-list::-webkit-scrollbar-thumb{background:rgba(59,130,246,.3);border-radius:3px}.requirements-list::-webkit-scrollbar-thumb:hover{background:rgba(59,130,246,.5)}.requirement-item{display:flex;align-items:center;padding:12px;background:rgba(30,30,45,.5);border:1px solid rgba(148,163,184,.1);border-radius:8px;margin-bottom:8px;transition:all .3s ease;position:relative;overflow:hidden}.requirement-item:last-child{margin-bottom:0}.requirement-item:hover{background:rgba(30,30,45,.7);border-color:rgba(59,130,246,.3);transform:translateY(-1px)}.requirement-item.active{background:rgba(34,197,94,.1);border-color:#22c55e;box-shadow:0 0 0 2px rgba(34,197,94,.2)}.requirement-item-img{width:40px;height:40px;background:rgba(30,30,45,.8);border-radius:6px;border:1px solid rgba(148,163,184,.1);display:flex;align-items:center;justify-content:center;margin-right:12px;flex-shrink:0;overflow:hidden}.requirement-item-img img{width:32px;height:32px;object-fit:contain}.requirement-item-content{flex:1;min-width:0}.requirement-item-title{font-size:14px;font-weight:600;color:#f1f5f9;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.requirement-item-info{display:flex;align-items:center;gap:12px;font-size:12px;color:#64748b}.requirement-item-type{display:inline-flex;align-items:center;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:500;text-transform:uppercase}.requirement-item-type.buy{background:rgba(34,197,94,.2);color:#22c55e}.requirement-item-type.sell{background:rgba(239,68,68,.2);color:#ef4444}.requirement-price-tag{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;padding:4px 8px;border-radius:6px;font-size:12px;font-weight:600;margin-right:12px;flex-shrink:0}.requirement-select-btn{padding:6px 12px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border:none;border-radius:6px;color:#fff;font-size:12px;font-weight:500;cursor:pointer;transition:all .3s ease;white-space:nowrap;flex-shrink:0;display:flex;align-items:center;gap:4px}.requirement-select-btn:hover{background:linear-gradient(135deg,#2563eb,#1e40af);transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,.4)}.requirement-select-btn.selected{background:linear-gradient(135deg,#22c55e,#16a34a);cursor:default}.requirement-select-btn.selected:hover{background:linear-gradient(135deg,#22c55e,#16a34a);transform:none;box-shadow:none}.requirement-select-btn i{font-size:11px}.requirements-pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:rgba(30,30,45,.3);border-top:1px solid rgba(148,163,184,.1);border-radius:0 0 8px 8px}.requirements-pagination .pagination-info{font-size:12px;color:#94a3b8}.requirements-pagination .pagination-controls{display:flex;align-items:center;gap:8px}.requirements-pagination .pagination-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(30,30,45,.8);border:1px solid rgba(148,163,184,.2);border-radius:4px;color:#94a3b8;font-size:12px;cursor:pointer;transition:all .3s ease;padding:0}.requirements-pagination .pagination-btn:hover:not(:disabled){border-color:rgba(59,130,246,.4);color:#f1f5f9;background:rgba(59,130,246,.1)}.requirements-pagination .pagination-btn:disabled{opacity:.5;cursor:not-allowed}.requirements-pagination .pagination-btn i{font-size:10px}.requirements-pagination .current-page{font-size:12px;color:#f1f5f9;margin:0 4px}.requirements-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;gap:16px}.empty-icon{width:64px;height:64px;background:rgba(59,130,246,.1);border-radius:50%;display:flex;align-items:center;justify-content:center}.empty-icon i{font-size:32px;color:#3b82f6;opacity:.7}.empty-title{font-size:16px;font-weight:600;color:#f1f5f9;margin:0}.empty-desc{font-size:14px;color:#94a3b8;line-height:1.5;max-width:300px;margin:0}.empty-actions{margin-top:8px}.selected-requirement{padding:16px;background:rgba(59,130,246,.05);border-top:1px solid rgba(59,130,246,.2)}.selected-requirement-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.selected-requirement-header h5{font-size:14px;font-weight:600;color:#3b82f6;margin:0;display:flex;align-items:center;gap:6px}.selected-requirement-header h5 i{font-size:14px}.selected-requirement-content{background:rgba(30,30,45,.5);border-radius:8px;padding:12px;border:1px solid rgba(148,163,184,.1)}.create-room-modal .modal-footer{padding:10px 28px 4px;border-top:1px solid rgba(148,163,184,.1);background:rgba(30,41,59,.3);display:flex;flex-direction:column;gap:12px}.footer-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px}.footer-note{font-size:12px;color:#64748b;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px}.footer-note i{font-size:12px;color:#3b82f6}.create-room-modal .btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;display:flex;align-items:center;gap:6px;transition:all .3s ease;border:none}.create-room-modal .btn-primary{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff}.create-room-modal .btn-primary:hover{background:linear-gradient(135deg,#2563eb,#1e40af);transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,.4)}.create-room-modal .btn-secondary{background:rgba(30,30,45,.8);color:#94a3b8;border:1px solid rgba(148,163,184,.2)}.create-room-modal .btn-secondary:hover{background:rgba(30,30,45,.9);color:#f1f5f9;border-color:rgba(148,163,184,.3)}.create-room-modal .btn-outline-secondary{background:0 0;color:#94a3b8;border:1px solid rgba(148,163,184,.3)}.create-room-modal .btn-outline-secondary:hover{background:rgba(148,163,184,.1);color:#f1f5f9}@media (max-width:768px){.create-room-modal .modal-dialog{margin:1rem;max-width:none}.form-grid{grid-template-columns:1fr;gap:16px}.form-group-full{grid-column:1}.voice-options{gap:8px}.voice-option-label{padding:12px}.footer-actions{justify-content:stretch}.create-room-modal .btn{flex:1;justify-content:center}}.hidden{display:none!important}.room-notification{position:fixed;top:20px;right:-400px;width:380px;z-index:10000;transition:all .4s cubic-bezier(.68, -.55, .265, 1.55)}.room-notification.show{right:20px}.notification-content{background:rgba(15,23,42,.95);backdrop-filter:blur(20px);border:1px solid rgba(16,185,129,.15);border-radius:16px;box-shadow:0 20px 25px -5px rgba(0,0,0,.4),0 10px 10px -5px rgba(0,0,0,.2),0 0 0 1px rgba(16,185,129,.05),inset 0 1px 0 rgba(255,255,255,.1);overflow:hidden;position:relative}.notification-content::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#10b981,#22d3ee,#10b981);background-size:200% 100%;animation:notification-slide-in 2s ease-in-out infinite}.notification-header{display:flex;align-items:flex-start;padding:20px 20px 0;gap:12px}.notification-icon1{width:40px;height:40px;background:linear-gradient(135deg,#10b981,#22d3ee);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px rgba(16,185,129,.3)}.notification-icon1 i{font-size:20px;color:#fff}.notification-text{flex:1}.notification-title{font-size:16px;font-weight:600;color:var(--text-white);margin-bottom:4px}.notification-subtitle{font-size:14px;color:var(--text-muted);opacity:.8}.notification-close{background:0 0;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:4px;border-radius:6px;transition:all .2s ease;flex-shrink:0}.notification-close:hover{background:rgba(255,255,255,.1);color:var(--text-white)}.notification-close i{font-size:16px}.notification-actions{padding:16px 20px 20px;display:flex;gap:8px}.notification-btn{flex:1;padding:10px 16px;border-radius:10px;font-size:14px;font-weight:500;transition:all .2s ease;cursor:pointer;border:none;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px}.notification-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.notification-btn:hover::before{left:100%}.notification-btn i{font-size:14px}.notification-btn.btn-primary{background:linear-gradient(135deg,#10b981,#22d3ee);color:#fff;box-shadow:0 4px 12px rgba(16,185,129,.3)}.notification-btn.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(16,185,129,.4)}.notification-btn.btn-secondary{background:rgba(75,85,99,.8);color:var(--text-light);border:1px solid rgba(75,85,99,.4)}.notification-btn.btn-secondary:hover{background:#4b5563;color:var(--text-white);border-color:rgba(75,85,99,.6)}@keyframes notification-slide-in{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes notification-slide-out{from{right:20px;opacity:1;transform:scale(1) rotateX(0)}to{right:-400px;opacity:0;transform:scale(.9) rotateX(-10deg)}}