*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:#020910;color:#eaf4ff;font-family:Inter,Segoe UI,Tahoma,Arial,sans-serif;font-size:14px;overflow-x:hidden}.site-bg{position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 18% 12%,rgba(30,100,160,.2),transparent 28%),radial-gradient(circle at 74% 4%,rgba(126,255,42,.16),transparent 21%),linear-gradient(180deg,#061321 0%,#03101d 45%,#020810 100%)}.site-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.62),transparent 18%,transparent 80%,rgba(0,0,0,.55)),repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 4px);opacity:.9;pointer-events:none}:root{--green:#9bea34;--green2:#62c819;--green3:#caff6a;--blue:#24c8ff;--purple:#8c57ff;--gold:#ffc928;--orange:#ff9b1a;--red:#ff554d;--panel:rgba(5,20,34,.82);--panel2:rgba(8,27,45,.88);--line:rgba(123,181,225,.18);--line2:rgba(155,234,52,.55);--muted:#86a2bc;--soft:#b6cbe0;--shadow:0 18px 48px rgba(0,0,0,.45)}button,a,input,select{font-family:inherit}.top-nav{height:60px;padding:0 34px;display:grid;grid-template-columns:290px 1fr minmax(560px,680px);gap:22px;align-items:center;border-bottom:1px solid rgba(88,138,182,.18);background:rgba(2,10,18,.82);backdrop-filter:blur(20px);position:sticky;top:0;z-index:50;box-shadow:0 10px 40px rgba(0,0,0,.28)}.brand{display:flex;align-items:center;text-decoration:none;color:#fff;gap:12px;min-width:0}.brand-bolt{font-size:35px;color:var(--gold);filter:drop-shadow(0 0 12px rgba(255,207,36,.45))}.brand-text strong{display:block;font-size:18px;letter-spacing:.035em;line-height:1}.brand-text small{display:block;color:#8daac4;font-size:12px;margin-top:4px}.main-menu{display:flex;justify-content:center;align-items:center;gap:30px;height:100%}.main-menu a{height:100%;display:flex;align-items:center;position:relative;text-decoration:none;color:#e7f0fb;font-size:13px;font-weight:800}.main-menu a.active{color:var(--green)}.main-menu a.active:after{content:"";position:absolute;height:3px;border-radius:3px;background:var(--green);box-shadow:0 0 14px var(--green);left:0;right:0;bottom:0}.nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px}.search-box{height:38px;min-width:360px;flex:1;display:flex;align-items:center;gap:10px;border:1px solid rgba(97,145,190,.24);border-radius:10px;background:rgba(4,16,28,.88);padding:0 13px;color:#7891aa;box-shadow:inset 0 1px rgba(255,255,255,.04)}.search-box input{width:100%;background:transparent;border:0;outline:0;color:#dceeff;font-weight:600;font-size:13px}.btn{border:0;outline:0;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:8px;padding:10px 17px;font-weight:900;cursor:pointer;transition:.16s ease;color:#07131d;white-space:nowrap}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.btn.primary{background:linear-gradient(180deg,#b7ff49 0%,#7fda26 52%,#59ac13 100%);box-shadow:0 0 0 1px rgba(210,255,120,.28) inset,0 9px 20px rgba(120,230,32,.25);color:#08120c;text-shadow:0 1px rgba(255,255,255,.22)}.btn.ghost,.btn.dark{background:rgba(7,20,35,.78);border:1px solid rgba(112,160,200,.28);color:#e7f2ff;box-shadow:inset 0 1px rgba(255,255,255,.06)}.btn.big{height:44px;min-width:154px;font-size:14px}.page-shell{width:min(100%,1920px);margin:0 auto;padding:16px 34px 8px}.panel,.hero-card,.live-room-card,.featured-panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(9,29,48,.82),rgba(4,15,27,.9));border-radius:10px;box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.05);position:relative;overflow:hidden}.panel:before,.featured-panel:before,.live-room-card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.05),transparent 35%,rgba(155,234,52,.035));pointer-events:none}.top-layout{display:grid;grid-template-columns:minmax(650px,1.36fr) minmax(640px,.96fr);gap:18px;min-height:305px}.hero-live-wrap{display:grid;grid-template-columns:minmax(430px,1.45fr) minmax(300px,.75fr);gap:16px;min-height:305px}.hero-card{border-radius:0;background:#06101c;min-height:305px;overflow:hidden}.hero-card:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,14,24,.98) 0%,rgba(5,14,24,.82) 40%,rgba(5,14,24,.30) 72%,rgba(5,14,24,.85) 100%);z-index:1}.hero-art{position:absolute;inset:0;background:radial-gradient(circle at 70% 36%,rgba(145,118,64,.34),transparent 22%),linear-gradient(115deg,rgba(12,30,44,.2),rgba(0,0,0,.3)),url('/maps/de_dust2.jpg') center/cover no-repeat;filter:saturate(.78) contrast(1.1) brightness(.55);transform:scale(1.08)}.hero-art:after{content:"";position:absolute;right:7%;bottom:-4%;width:340px;height:310px;background:radial-gradient(ellipse at 50% 40%,rgba(0,0,0,.5),rgba(0,0,0,0) 68%);filter:blur(4px)}.hero-content{position:relative;z-index:2;padding:24px 22px 18px}.hero-badge{display:inline-flex;align-items:center;padding:8px 12px;border:1px solid rgba(112,192,38,.28);background:rgba(12,45,35,.72);border-radius:7px;color:var(--green);font-weight:950;letter-spacing:.06em;font-size:12px;box-shadow:0 0 22px rgba(137,226,35,.08)}h1{font-size:clamp(34px,3.15vw,56px);line-height:.98;margin:18px 0 12px;letter-spacing:-.055em;max-width:560px}h1 strong{display:block;color:var(--green);text-shadow:0 0 22px rgba(155,234,52,.18)}.hero-content p{color:#c5d5e5;font-size:17px;line-height:1.45;margin:0 0 18px;max-width:520px}.hero-buttons{display:flex;gap:14px;margin-bottom:18px}.feature-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:710px}.feature-row div{display:grid;grid-template-columns:22px 1fr;column-gap:9px;align-items:start;min-width:0}.feature-row span{color:var(--green);font-size:18px;filter:drop-shadow(0 0 9px rgba(155,234,52,.35))}.feature-row b{font-size:12px;color:#eef7ff}.feature-row small{grid-column:2;color:#8aa1b7;font-size:11px;margin-top:2px}.live-room-card{padding:16px;min-height:305px}.live-head,.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.live-head strong,.section-head h2{margin:0;font-size:13px;letter-spacing:.06em;color:#eef7ff}.live-now{font-size:12px;color:var(--green);font-weight:900}.live-main{display:grid;grid-template-columns:170px 1fr;gap:14px;margin-top:12px}.live-img{height:130px;border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#081827}.live-img img{width:100%;height:100%;object-fit:cover;display:block}.live-title h3{margin:6px 0 6px;color:var(--green);font-size:18px}.live-title p{margin:0 0 14px;color:#a8bdd2}.live-meta{display:flex;gap:14px;color:#dce9f4;font-weight:800;font-size:12px}.live-meta span:nth-child(2){color:var(--green)}.avatar-stack{display:flex;margin-top:12px}.avatar-stack i{width:24px;height:24px;border-radius:50%;border:2px solid #0b1b2d;margin-left:-6px;background:linear-gradient(135deg,#ffc45d,#6bc4ff);display:block}.avatar-stack i:first-child{margin-left:0}.avatar-stack em{font-style:normal;margin-left:8px;color:#b7c9db;font-size:11px;align-self:center}.live-room-card .btn{width:160px;margin:16px 0 18px}.live-foot{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.08);padding-top:14px;color:#7f96ad;font-size:12px}.right-top-wrap{display:grid;grid-template-rows:70px 1fr;gap:14px}.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat-card{border:1px solid rgba(55,174,255,.32);background:linear-gradient(180deg,rgba(10,31,51,.82),rgba(5,15,27,.95));border-radius:10px;padding:10px 14px;display:grid;grid-template-columns:44px 1fr;align-items:center;gap:11px;min-width:0;box-shadow:0 15px 35px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.05)}.stat-card:nth-child(2){border-color:rgba(40,151,255,.4)}.stat-card:nth-child(3){border-color:rgba(156,91,255,.4)}.stat-card:nth-child(4){border-color:rgba(255,201,40,.38)}.stat-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:20px;background:rgba(155,234,52,.12);color:var(--green)}.stat-card:nth-child(2) .stat-icon{background:rgba(35,158,255,.12);color:#29a7ff}.stat-card:nth-child(3) .stat-icon{background:rgba(142,87,255,.13);color:#9b65ff}.stat-card:nth-child(4) .stat-icon{background:rgba(255,201,40,.13);color:var(--gold)}.stat-card strong{font-size:22px;color:#eef8ff;letter-spacing:.02em}.stat-card span{display:block;color:#8aa4bc;font-size:11px}.stat-card small{color:var(--green);font-size:11px;font-weight:800}.featured-panel{padding:12px}.section-head.tight{margin-bottom:10px}.section-head a{font-size:12px;text-decoration:none;color:#4bd2ff;font-weight:900}.section-head small{color:#8199b1}.featured-rooms{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.featured-card{border:1px solid rgba(116,160,199,.18);background:rgba(5,17,30,.82);border-radius:8px;overflow:hidden;min-width:0}.featured-thumb{height:78px;background:#081827;overflow:hidden}.featured-thumb img{width:100%;height:100%;object-fit:cover;display:block}.featured-body{padding:8px}.featured-body h3{margin:0;color:var(--green);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.featured-body p{margin:3px 0 8px;color:#9badbf;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-stats{display:flex;justify-content:space-between;font-size:11px;color:#b6c8dc}.mini-stats span:last-child{color:var(--green)}.featured-body .btn{width:100%;height:28px;margin-top:8px;border-radius:5px;padding:0;font-size:12px}.middle-layout{display:grid;grid-template-columns:minmax(700px,1.63fr) minmax(300px,.50fr) minmax(330px,.52fr);gap:14px;margin-top:16px}.glow-panel{border-color:rgba(155,234,52,.6);box-shadow:0 0 0 1px rgba(155,234,52,.15),0 0 28px rgba(155,234,52,.12),var(--shadow)}.season-ranking{min-height:348px;padding:14px}.ranking-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.title-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.gear{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(155,234,52,.12);color:var(--green);font-size:17px}.title-line h2{font-size:20px;margin:0;letter-spacing:.01em}.title-line em{font-style:normal;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);border-radius:6px;padding:5px 11px;color:#c8d8e8;font-size:12px}.title-line small{color:#8199b1}.rank-tabs{display:flex;background:rgba(3,15,27,.86);border:1px solid rgba(115,158,198,.2);border-radius:8px;padding:4px;min-width:150px}.rank-tab{flex:1;border:0;background:transparent;color:#a4bbd0;font-weight:900;border-radius:6px;padding:8px 11px;cursor:pointer}.rank-tab.active{color:#07130f;background:linear-gradient(180deg,var(--green),#65c915)}.ranking-body{display:grid;grid-template-columns:minmax(360px,.88fr) minmax(430px,1fr);gap:18px}.podium{height:220px;display:grid;grid-template-columns:1fr 1.08fr 1fr;align-items:end;gap:14px;padding:4px 14px 0;background:radial-gradient(circle at 50% 30%,rgba(255,206,40,.14),transparent 34%),linear-gradient(180deg,transparent,rgba(6,18,31,.6));border-radius:12px}.podium-item{text-align:center;position:relative}.podium-avatar{width:72px;height:72px;border-radius:50%;margin:0 auto -2px;border:3px solid rgba(255,255,255,.22);display:grid;place-items:center;background:linear-gradient(135deg,#28435d,#111c2d);box-shadow:0 0 22px rgba(255,255,255,.12);font-weight:900;font-size:23px}.podium-item.first .podium-avatar{width:96px;height:96px;border-color:rgba(255,220,55,.72);box-shadow:0 0 30px rgba(255,207,35,.36)}.podium-rank{width:34px;height:34px;border-radius:50%;margin:-10px auto 0;display:grid;place-items:center;background:linear-gradient(180deg,#ffe25c,#d49a00);color:#fff;font-weight:950;text-shadow:0 1px rgba(0,0,0,.3)}.podium-base{height:66px;border-radius:8px 8px 0 0;background:linear-gradient(180deg,rgba(255,216,71,.33),rgba(255,216,71,.1));border:1px solid rgba(255,214,49,.18);display:flex;flex-direction:column;align-items:center;justify-content:center}.podium-item.second .podium-base{height:52px;background:linear-gradient(180deg,rgba(180,205,230,.22),rgba(180,205,230,.08))}.podium-item.third .podium-base{height:46px;background:linear-gradient(180deg,rgba(255,140,28,.25),rgba(255,140,28,.08))}.podium-name{font-weight:950;color:#fff;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.podium-score{color:var(--gold);font-weight:900;margin-top:4px}.personal-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}.personal-stats div{border:1px solid rgba(113,156,194,.16);background:rgba(255,255,255,.035);border-radius:8px;text-align:center;padding:10px}.personal-stats strong{display:block;font-size:18px;color:#fff}.personal-stats small{display:block;margin-top:3px;color:#8da4bc}.ranking-table-wrap{background:rgba(4,15,26,.45);border:1px solid rgba(112,160,200,.13);border-radius:10px;padding:10px;min-width:0}.ranking-table{width:100%;border-collapse:collapse;font-size:13px}.ranking-table th{color:#8fa8bf;font-size:11px;text-transform:uppercase;text-align:left;padding:10px;border-bottom:1px solid rgba(255,255,255,.07)}.ranking-table td{padding:11px 10px;border-bottom:1px solid rgba(255,255,255,.06);color:#cbdced}.ranking-table tr:last-child td{border-bottom:0}.ranking-table td:nth-child(3),.ranking-table td:nth-child(6){color:var(--gold);font-weight:900}.player-cell{display:flex;align-items:center;gap:8px;font-weight:900;color:#fff}.player-icon{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:linear-gradient(135deg,#ffbb4f,#6ed2ff);font-size:12px}.link-btn{border:0;background:transparent;color:#35d7ff;font-weight:900;margin:10px auto 0;display:block;cursor:pointer}.combat-panel,.quick-create{padding:14px;min-height:348px}.combat-panel h3{font-size:13px;margin:12px 0 10px;letter-spacing:.08em}.weapon-list{display:grid;gap:10px}.weapon-row{display:grid;grid-template-columns:54px 1fr 42px;align-items:center;gap:10px;color:#cfe0ef;font-size:13px}.bar{height:5px;border-radius:9px;background:rgba(109,146,182,.18);overflow:hidden}.bar span{height:100%;display:block;background:linear-gradient(90deg,var(--green),#caff6a);box-shadow:0 0 12px rgba(155,234,52,.32)}.weapon-row small{text-align:right;color:#bcd0e2}.kill-list,.activity-list{display:grid;gap:8px}.kill-row{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid rgba(255,255,255,.05);padding-bottom:7px;font-size:12px;color:#c5d6e5}.kill-row b{font-weight:800;color:#dbeaff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kill-row span{color:var(--green);font-weight:900}.quick-create label{display:block;color:#8fa8bf;font-size:12px;margin:10px 0 6px}.quick-create input,.quick-create select{width:100%;height:38px;background:rgba(3,14,26,.76);border:1px solid rgba(116,163,205,.17);border-radius:7px;color:#dceeff;padding:0 12px;outline:0}.form-grid{display:grid;gap:10px}.form-grid.three{grid-template-columns:1fr 1fr .75fr}.form-grid.two{grid-template-columns:1fr .6fr}.create-now{width:100%;height:44px;margin-top:14px}.switch-row{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.07);padding:13px 0;color:#d8e7f7}.switch-row small{display:block;color:#8399af;font-size:11px;margin-top:2px}.switch input{display:none}.switch span{width:45px;height:24px;border-radius:20px;background:#213144;display:block;position:relative;box-shadow:inset 0 1px 4px rgba(0,0,0,.55)}.switch span:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;left:3px;top:3px;background:#9fb3c5;transition:.18s}.switch input:checked+span{background:rgba(123,225,32,.25);box-shadow:0 0 18px rgba(155,234,52,.22)}.switch input:checked+span:after{left:24px;background:var(--green)}.private-pass{display:none}.hidden-field{display:none!important}.status-text{min-height:18px;margin:8px 0 0;color:var(--gold);font-size:12px}.bottom-layout{display:grid;grid-template-columns:minmax(600px,1.28fr) minmax(330px,.58fr) minmax(320px,.48fr);gap:14px;margin-top:14px}.maps-panel,.activity-panel,.community-panel{padding:12px}.popular-maps{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.map-card{border:1px solid rgba(116,160,199,.17);border-radius:8px;background:rgba(5,17,30,.78);overflow:hidden;min-width:0;cursor:pointer}.map-card:hover{border-color:rgba(155,234,52,.45);transform:translateY(-1px)}.map-thumb{height:98px;background:#071827;overflow:hidden}.map-thumb img{width:100%;height:100%;object-fit:cover;display:block}.map-card-body{padding:9px}.map-card-body b{display:block;color:#eaf4ff;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-card-body small{display:block;color:#8ea7bf;margin-top:3px;font-size:11px}.map-card-body small.live{color:var(--green)}.activity-row{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center}.activity-row img{width:52px;height:38px;border-radius:6px;object-fit:cover}.activity-row b{display:block;color:var(--green);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-row small{display:block;color:#8ca4bc;font-size:11px;margin-top:1px}.activity-row em{font-style:normal;color:var(--green);font-size:11px;text-align:right}.community-panel p{color:#9fb4ca;line-height:1.45}.discord-btn{height:42px;border-radius:7px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:#fff;background:linear-gradient(180deg,#7277ff,#5058e8);font-weight:900;margin:16px 10px;box-shadow:0 12px 22px rgba(90,95,255,.22)}.social-row{display:flex;justify-content:center;gap:22px;font-size:22px}.social-row span:nth-child(1){color:#ff3b31}.social-row span:nth-child(2){color:#2c8dff}.social-row span:nth-child(3){color:#8174ff}.all-rooms-panel{padding:14px;margin-top:14px}.section-head{margin-bottom:12px}.section-head h2{font-size:16px}.section-head p{margin:4px 0 0;color:#8aa3bb}.room-filter-row{display:flex;gap:8px}.room-filter{border:1px solid rgba(116,160,199,.18);background:rgba(5,17,30,.84);color:#b8cadc;border-radius:7px;padding:8px 12px;font-weight:900;cursor:pointer}.room-filter.active{background:linear-gradient(180deg,var(--green),#60bd17);color:#07130f}.rooms-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.room-card{border:1px solid rgba(112,160,200,.16);background:rgba(5,17,30,.76);border-radius:10px;overflow:hidden}.room-card .featured-thumb{height:106px}.room-card .featured-body h3{font-size:15px}.room-actions{display:flex;gap:8px;margin-top:10px}.room-actions a,.room-actions button{flex:1;height:30px;border-radius:6px;border:1px solid rgba(116,160,199,.18);background:rgba(255,255,255,.04);color:#e8f4ff;text-decoration:none;display:grid;place-items:center;font-weight:900;font-size:12px}.room-actions a:first-child{background:linear-gradient(180deg,var(--green),#5eb914);color:#07130f}.why-row{display:grid;grid-template-columns:270px 1fr;align-items:center;padding:12px 15px;margin-top:14px}.why-row h2{font-size:16px;margin:0}.why-items{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.why-items div{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:9px}.why-items span{font-size:22px;color:var(--green)}.why-items b{display:block;color:#eaf4ff}.why-items small{display:block;color:#8ea5bc;font-size:11px;margin-top:2px}.footer{width:min(100%,1920px);margin:0 auto;padding:18px 42px 30px;display:grid;grid-template-columns:1fr 220px 220px 220px;gap:30px;color:#8ca3b8}.footer a{display:block;color:#8ca3b8;text-decoration:none;margin-top:5px}.footer b{display:block;color:#dcecff;margin-bottom:6px}.footer-brand{display:flex;gap:13px;align-items:center}.footer-brand span{font-size:42px;color:var(--gold)}.footer-brand small{display:block;color:#8ca3b8;margin-top:4px}.panel-empty,.empty-state{height:100%;display:grid;place-items:center;color:#89a3bb;border:1px dashed rgba(116,160,199,.2);border-radius:8px;padding:18px;text-align:center}.modal{position:fixed;inset:0;background:rgba(0,0,0,.68);z-index:90;display:none;align-items:center;justify-content:center;padding:24px}.modal.open{display:flex}.modal-box{width:min(720px,92vw);background:#061321;border:1px solid rgba(155,234,52,.25);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.55);padding:16px}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head button{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;border-radius:8px;padding:8px 12px}.share-grid{display:grid;grid-template-columns:190px 1fr;gap:18px}.share-qr img{width:180px;height:180px;background:#fff;border-radius:8px;padding:8px}.share-url{word-break:break-all;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:10px;color:#bfe8ff}.share-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.share-actions a,.share-actions button{padding:9px 12px;border-radius:8px;border:0;text-decoration:none;background:var(--green);color:#06120b;font-weight:900}.no-image{background:linear-gradient(135deg,#10263e,#07131f)!important;position:relative}.no-image:after{content:"CS";position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.12);font-weight:950;font-size:38px}.skeleton{animation:pulse 1.2s infinite alternate}@keyframes pulse{from{opacity:.55}to{opacity:1}}@media(max-width:1500px){.top-nav{grid-template-columns:250px 1fr 500px;padding:0 24px}.main-menu{gap:18px}.search-box{min-width:260px}.page-shell{padding:14px 24px}.featured-rooms{grid-template-columns:repeat(3,1fr)}.featured-thumb{height:70px}.top-layout{grid-template-columns:1fr}.right-top-wrap{grid-template-rows:auto auto}.middle-layout{grid-template-columns:1fr 340px}.quick-create{grid-column:2}.season-ranking{grid-column:1;grid-row:1 / span 2}.bottom-layout{grid-template-columns:1fr 1fr}.community-panel{grid-column:1 / -1}.rooms-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:1050px){.top-nav{height:auto;grid-template-columns:1fr;padding:14px}.main-menu{justify-content:flex-start;overflow:auto;height:42px}.nav-actions{justify-content:stretch}.search-box{min-width:0}.page-shell{padding:12px}.hero-live-wrap,.middle-layout,.bottom-layout,.ranking-body,.why-row{grid-template-columns:1fr}.stats-row{grid-template-columns:repeat(2,1fr)}.popular-maps,.featured-rooms,.rooms-grid{grid-template-columns:repeat(2,1fr)}.quick-create{grid-column:auto}.season-ranking{grid-column:auto;grid-row:auto}.feature-row{grid-template-columns:repeat(2,1fr)}.footer{grid-template-columns:1fr 1fr;padding:18px}.why-items{grid-template-columns:1fr 1fr}}@media(max-width:620px){h1{font-size:38px}.hero-buttons,.nav-actions{flex-direction:column;align-items:stretch}.stats-row,.popular-maps,.featured-rooms,.rooms-grid,.personal-stats,.why-items{grid-template-columns:1fr}.live-main{grid-template-columns:1fr}.podium{grid-template-columns:1fr;height:auto}.footer{grid-template-columns:1fr}.form-grid.three,.form-grid.two{grid-template-columns:1fr}}
/* ===== CounterStorm Pixel Mockup V3 - ajustes de fidelidade 16:9 ===== */
@media (min-width: 1181px){
body{
background:
radial-gradient(circle at 18% 16%, rgba(14,72,116,.34), transparent 27%),
radial-gradient(circle at 78% 16%, rgba(143,234,52,.12), transparent 22%),
linear-gradient(180deg,#020912 0%,#03101d 45%,#02070e 100%);
}
.top-nav{
height:64px!important;
padding:0 28px!important;
grid-template-columns:310px minmax(520px,1fr) minmax(620px,720px)!important;
gap:22px!important;
}
.brand-bolt{font-size:42px!important;line-height:1!important}
.brand-text strong{font-size:20px!important;letter-spacing:.04em!important}
.brand-text small{font-size:12px!important;color:#90a8bd!important}
.main-menu{gap:30px!important}
.main-menu a{font-size:13px!important}
.search-box{height:40px!important;min-width:420px!important;border-radius:9px!important}
.nav-actions .btn{height:40px!important;padding:0 18px!important;border-radius:8px!important}
.page-shell{
width:min(calc(100vw - 58px), 1848px)!important;
max-width:1848px!important;
margin:0 auto!important;
padding:18px 0 8px!important;
}
.panel,.hero-card,.live-room-card,.featured-panel{
border-radius:14px!important;
border-color:rgba(94,149,196,.22)!important;
background:linear-gradient(180deg,rgba(9,30,50,.90),rgba(3,14,25,.96))!important;
box-shadow:0 22px 56px rgba(0,0,0,.46), inset 0 1px rgba(255,255,255,.055)!important;
}
.top-layout{
display:grid!important;
grid-template-columns:minmax(980px, 1.34fr) minmax(720px, .96fr)!important;
gap:18px!important;
min-height:318px!important;
}
.hero-live-wrap{
display:grid!important;
grid-template-columns:minmax(620px, 1.48fr) minmax(365px, .78fr)!important;
gap:16px!important;
min-height:318px!important;
}
.right-top-wrap{
display:grid!important;
grid-template-rows:78px 1fr!important;
gap:14px!important;
min-height:318px!important;
}
.hero-card{min-height:318px!important;border-radius:14px!important}
.hero-card:after{
background:
linear-gradient(90deg,rgba(4,13,23,.98) 0%,rgba(4,13,23,.88) 36%,rgba(4,13,23,.34) 72%,rgba(4,13,23,.83) 100%),
radial-gradient(circle at 68% 42%,rgba(155,234,52,.08),transparent 28%)!important;
}
.hero-art{
background:
radial-gradient(circle at 68% 48%,rgba(0,0,0,.1),transparent 32%),
linear-gradient(90deg,rgba(4,12,20,.22),rgba(0,0,0,.08)),
url('/maps/de_dust2.jpg') center/cover no-repeat!important;
filter:saturate(.86) contrast(1.16) brightness(.46)!important;
transform:scale(1.1)!important;
}
.hero-content{padding:26px 26px 20px!important}
.hero-badge{font-size:12px!important;padding:8px 12px!important;border-radius:7px!important}
h1{font-size:clamp(54px,3.25vw,68px)!important;line-height:.96!important;margin:18px 0 14px!important;max-width:690px!important;letter-spacing:-.06em!important}
.hero-content p{font-size:18px!important;line-height:1.42!important;max-width:610px!important;margin-bottom:20px!important;color:#d3e2ef!important}
.hero-buttons{gap:16px!important;margin-bottom:18px!important}
.btn.big{height:48px!important;min-width:184px!important;font-size:14px!important}
.feature-row{max-width:760px!important;gap:22px!important}
.feature-row b{font-size:12px!important}.feature-row small{font-size:11px!important}
.live-room-card{min-height:318px!important;padding:16px!important}
.live-main{grid-template-columns:180px 1fr!important;gap:16px!important;margin-top:14px!important}
.live-img{height:132px!important;border-radius:8px!important}
.live-title h3{font-size:20px!important;margin-top:6px!important}
.live-title p{font-size:13px!important;margin-bottom:13px!important}
.live-room-card .btn{width:184px!important;height:44px!important;margin:14px 0 18px!important}
.stats-row{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.stat-card{height:78px!important;padding:12px 14px!important;border-radius:12px!important;grid-template-columns:48px 1fr!important}
.stat-icon{width:46px!important;height:46px!important;border-radius:14px!important;font-size:22px!important}
.stat-card strong{font-size:26px!important;line-height:1!important}.stat-card span{font-size:11px!important}.stat-card small{font-size:11px!important}
.featured-panel{padding:12px!important;min-height:226px!important}
.featured-rooms{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important}
.featured-thumb{height:82px!important}.featured-body{padding:8px!important}.featured-body h3{font-size:13px!important}.featured-body .btn{height:30px!important}
.middle-layout{
display:grid!important;
grid-template-columns:minmax(930px,1.55fr) minmax(330px,.50fr) minmax(360px,.54fr)!important;
gap:14px!important;
margin-top:16px!important;
}
.season-ranking,.combat-panel,.quick-create{min-height:356px!important}
.season-ranking{padding:16px!important}
.ranking-body{grid-template-columns:minmax(400px,.72fr) minmax(500px,1fr)!important;gap:20px!important}
.podium{height:202px!important;gap:16px!important}
.podium-item .avatar{width:76px!important;height:76px!important}.podium-item.first .avatar{width:94px!important;height:94px!important}
.pedestal{min-height:56px!important}
.personal-stats{grid-template-columns:repeat(4,1fr)!important;gap:10px!important}
.ranking-table-wrap{min-height:248px!important}.ranking-table th{font-size:11px!important}.ranking-table td{padding:10px!important}
.combat-panel,.quick-create{padding:16px!important}.weapon-row{grid-template-columns:56px 1fr 42px!important}.kill-row{font-size:12px!important}
.bottom-layout{
display:grid!important;
grid-template-columns:minmax(810px,1.17fr) minmax(400px,.56fr) minmax(360px,.50fr)!important;
gap:14px!important;
margin-top:14px!important;
}
.maps-panel,.activity-panel,.community-panel{padding:14px!important;min-height:198px!important}
.popular-maps{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:12px!important}
.map-thumb{height:96px!important}.map-card-body b{font-size:13px!important}.map-card-body small{font-size:11px!important}
.activity-row{grid-template-columns:58px 1fr auto!important}.activity-row img{width:58px!important;height:42px!important}
.community-panel p{font-size:14px!important;margin-top:18px!important}.discord-btn{height:44px!important;margin:18px 10px!important}
.all-rooms-panel{
display:none!important;
}
.why-row{
grid-template-columns:300px 1fr!important;
padding:14px 18px!important;
margin-top:14px!important;
min-height:66px!important;
}
.why-row h2{font-size:18px!important;white-space:nowrap!important}
.why-items{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important}
.why-items div{
display:grid!important;
grid-template-columns:36px minmax(0,1fr)!important;
grid-template-areas:"icon title" "icon desc"!important;
column-gap:10px!important;
row-gap:2px!important;
align-items:center!important;
min-width:0!important;
}
.why-items span{grid-area:icon!important;font-size:24px!important}.why-items b{grid-area:title!important;font-size:13px!important;white-space:nowrap!important}.why-items small{grid-area:desc!important;font-size:11px!important;line-height:1.25!important;margin:0!important;white-space:normal!important}
.footer{
width:min(calc(100vw - 58px),1848px)!important;
max-width:1848px!important;
padding:24px 10px 36px!important;
grid-template-columns:1fr 230px 230px 230px!important;
}
}
@media (min-width:1181px) and (max-width:1500px){
.top-layout{grid-template-columns:minmax(760px,1.22fr) minmax(520px,.82fr)!important}
.hero-live-wrap{grid-template-columns:minmax(460px,1.32fr) minmax(280px,.78fr)!important}
.middle-layout{grid-template-columns:minmax(680px,1.4fr) minmax(280px,.55fr) minmax(300px,.55fr)!important}
.bottom-layout{grid-template-columns:minmax(620px,1.1fr) minmax(320px,.55fr) minmax(300px,.5fr)!important}
h1{font-size:clamp(42px,3.4vw,56px)!important}
.featured-rooms{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.popular-maps{grid-template-columns:repeat(5,minmax(0,1fr))!important}
}
@media (max-width:1180px){
.why-items div{
display:grid!important;
grid-template-columns:36px minmax(0,1fr)!important;
grid-template-areas:"icon title" "icon desc"!important;
}
.why-items span{grid-area:icon!important}.why-items b{grid-area:title!important}.why-items small{grid-area:desc!important;margin:0!important;line-height:1.3!important}
}
/* CounterStorm V4 - ajuste fino do topo 16:9 */
.right-top-wrap{
grid-template-rows:76px 1fr;
min-width:0;
}
.stats-row{
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;
align-items:stretch;
height:76px;
min-width:0;
}
.stat-card{
min-width:0;
min-height:76px;
padding:10px 12px;
grid-template-columns:42px minmax(0,1fr);
overflow:hidden;
}
.stat-card strong{
display:block;
line-height:1;
font-size:clamp(20px,1.35vw,26px);
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.stat-card span,
.stat-card small{
max-width:100%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
line-height:1.14;
}
.stat-card span{font-size:11px;margin-top:2px;}
.stat-card small{font-size:11px;margin-top:3px;display:block;}
.featured-panel{
min-height:258px;
height:258px;
padding:12px 13px;
}
.featured-rooms{
grid-template-columns:repeat(6,minmax(0,1fr));
gap:10px;
align-items:start;
}
.featured-card{
min-height:196px;
height:196px;
display:flex;
flex-direction:column;
}
.featured-thumb{
flex:0 0 78px;
}
.featured-body{
flex:1;
display:flex;
flex-direction:column;
min-width:0;
}
.featured-body h3{
font-size:13px;
line-height:1.05;
min-height:14px;
text-transform:uppercase;
max-width:100%;
}
.featured-body p{
max-width:100%;
font-size:11px;
line-height:1.18;
}
.featured-body p:nth-of-type(2){
margin-top:auto;
min-height:14px;
}
.mini-stats{
gap:7px;
white-space:nowrap;
overflow:hidden;
}
.mini-stats span{
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
}
.featured-body .btn{
flex:0 0 28px;
}
.live-room-card{
overflow:hidden;
}
.live-title h3{
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
line-height:1.08;
max-height:42px;
}
.live-title p,
.live-foot span{
min-width:0;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.live-foot{
gap:12px;
min-width:0;
}
.live-foot span{display:block;}
.rooms-grid .featured-body h3,
.room-card .featured-body h3{
text-transform:none;
white-space:nowrap;
}
@media (max-width:1500px){
.featured-rooms{grid-template-columns:repeat(4,minmax(0,1fr));}
.featured-panel{height:auto;min-height:292px;}
.featured-card:nth-child(n+5){display:none;}
.stat-card{grid-template-columns:38px minmax(0,1fr);padding:9px 10px;}
.stat-icon{width:38px;height:38px;}
}
/* Ranking inteligente V5 */
#ranking .title-line small{
color:#9fb5cb;
max-width:360px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.rank-tab.active{
box-shadow:0 0 18px rgba(146,236,42,.32);
}
/* =========================================================
CounterStorm - ajuste seguro Salas em Destaque
Somente CSS, sem recriar cards e sem afetar outras seções
========================================================= */
section:has(.cs-featured-safe-final),
div:has(.cs-featured-safe-final) {
overflow: visible !important;
}
/* aplicado pelo JS abaixo somente no bloco correto */
.cs-featured-safe-final {
height: auto !important;
min-height: 292px !important;
padding-bottom: 20px !important;
overflow: visible !important;
}
.cs-featured-safe-final .cs-featured-card-fixed {
min-height: 238px !important;
height: 238px !important;
display: flex !important;
flex-direction: column !important;
overflow: hidden !important;
padding-bottom: 12px !important;
}
.cs-featured-safe-final .cs-featured-card-fixed a,
.cs-featured-safe-final .cs-featured-card-fixed button {
min-height: 38px !important;
height: 38px !important;
line-height: 38px !important;
margin-top: auto !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
flex-shrink: 0 !important;
}