:root {
  --bg: #080a0c;
  --bg-2: #0d1013;
  --panel: #111519;
  --panel-2: #161b20;
  --line: rgba(255,255,255,.09);
  --line-strong: rgba(255,255,255,.16);
  --text: #f6f3ed;
  --muted: #9ba2aa;
  --orange: #ff6814;
  --orange-2: #ff8a32;
  --orange-soft: rgba(255,104,20,.14);
  --green: #36d276;
  --red: #ff4e4e;
  --yellow: #ffc34a;
  --shadow: 0 24px 80px rgba(0,0,0,.42);
  --radius: 18px;
  --container: 1220px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  overflow-x: hidden;
}
body.cart-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; }
img { max-width: 100%; }
.hidden { display: none !important; }
.container { width: min(var(--container), calc(100% - 40px)); margin: 0 auto; }
.noise {
  position: fixed; inset: 0; z-index: 1000; pointer-events: none; opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}

.site-header {
  position: fixed; inset: 0 0 auto; z-index: 100;
  background: rgba(8,10,12,.82); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--line);
}
.header-inner { height: 78px; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand-mark {
  width: 40px; height: 44px; display: grid; place-items: center;
  clip-path: polygon(50% 0,100% 18%,90% 82%,50% 100%,10% 82%,0 18%);
  background: linear-gradient(145deg,var(--orange-2),var(--orange)); color: #130b06;
  font-size: 24px; font-weight: 1000; font-style: italic;
  filter: drop-shadow(0 0 20px rgba(255,104,20,.25));
}
.brand > span:last-child { display: grid; grid-template-columns: auto auto; align-items: end; line-height: .88; letter-spacing: -.8px; }
.brand strong { font-size: 20px; font-weight: 950; }
.brand b { font-size: 20px; color: var(--orange); font-weight: 950; }
.brand small { grid-column: 1 / -1; font-size: 7px; letter-spacing: 2.4px; color: var(--muted); margin-top: 6px; }
.nav { display: flex; align-items: center; gap: 25px; margin-left: auto; }
.nav a { position: relative; color: #c5c8cc; font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .8px; transition: .2s; }
.nav a:hover { color: #fff; }
.nav a::after { content:""; position: absolute; left: 0; right: 100%; bottom: -11px; height: 2px; background: var(--orange); transition: .2s; }
.nav a:hover::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 10px; }
.steam-button, .profile-button {
  height: 43px; border: 1px solid var(--line-strong); background: #171b20; border-radius: 8px;
  display: inline-flex; align-items: center; gap: 9px; padding: 0 14px; font-size: 12px; font-weight: 800; cursor: pointer;
  transition: .2s;
}
.steam-button:hover, .profile-button:hover { border-color: rgba(255,104,20,.55); transform: translateY(-1px); }
.steam-logo { width: 22px; height: 22px; border: 2px solid #fff; border-radius: 50%; display:grid; place-items:center; font-size:10px; }
.profile-avatar { width: 27px; height: 27px; border-radius: 7px; background: var(--orange); color:#140b06; display:grid; place-items:center; font-weight:950; background-size: cover; background-position: center; }
.icon-button { width: 43px; height: 43px; border: 1px solid var(--line); background: transparent; border-radius: 8px; cursor: pointer; position: relative; }
.cart-count { position: absolute; top:-6px; right:-6px; min-width:19px; height:19px; padding:0 5px; border-radius:20px; background:var(--orange); color:#120903; display:grid; place-items:center; font-size:10px; font-weight:950; }
.mobile-menu { display:none; margin-left:auto; border:0; background:transparent; font-size:24px; cursor:pointer; }

.hero { min-height: 820px; position: relative; padding-top: 78px; overflow: hidden; display: grid; align-items: center; background:
  radial-gradient(circle at 72% 38%, rgba(255,104,20,.14), transparent 26%),
  linear-gradient(100deg, #080a0c 0%, #0b0e11 55%, #080a0c 100%);
}
.hero::before {
  content:""; position:absolute; inset:0; opacity:.28;
  background:
    linear-gradient(90deg,rgba(8,10,12,.98) 0%,rgba(8,10,12,.76) 43%,rgba(8,10,12,.32) 70%,rgba(8,10,12,.8) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='800' viewBox='0 0 900 800'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.22'%3E%3Cpath d='M50 680L230 420l110 90 145-260 125 170 130-130 120 390' stroke-width='9'/%3E%3Cpath d='M30 720h820M130 690V500m490 190V390M730 690V480' stroke-width='4'/%3E%3Ccircle cx='482' cy='250' r='44'/%3E%3C/g%3E%3C/svg%3E") right center / 58% auto no-repeat;
}
.hero-grid { position:absolute; inset:0; opacity:.12; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(to bottom,transparent,black 30%,transparent); transform:perspective(700px) rotateX(65deg) scale(1.5) translateY(35%); transform-origin:bottom; }
.hero-glow { position:absolute; width:540px; height:540px; border-radius:50%; border:1px solid rgba(255,104,20,.18); right:6%; top:18%; box-shadow:0 0 90px rgba(255,104,20,.08), inset 0 0 80px rgba(255,104,20,.04); }
.hero-content { position:relative; z-index:2; display:grid; grid-template-columns:1.08fr .72fr; gap:80px; align-items:center; padding:90px 0 80px; }
.eyebrow, .section-kicker { color:var(--orange-2); font-size:11px; font-weight:900; letter-spacing:2.2px; text-transform:uppercase; }
.live-dot { width:8px; height:8px; display:inline-block; border-radius:50%; background:var(--green); box-shadow:0 0 0 5px rgba(54,210,118,.1),0 0 18px rgba(54,210,118,.7); margin-right:9px; }
.hero h1 { margin:22px 0 22px; font-size:clamp(62px,7vw,104px); line-height:.86; letter-spacing:-5px; font-weight:1000; text-transform:uppercase; font-style:italic; }
.hero h1 span, .section-heading h2 span, .community-copy h2 span { color:var(--orange); }
.hero-copy > p { max-width:610px; color:#b3b8be; font-size:17px; }
.hero-actions { display:flex; gap:12px; margin-top:34px; }
.btn { min-height:48px; border-radius:7px; padding:0 22px; border:1px solid transparent; display:inline-flex; justify-content:center; align-items:center; font-weight:900; font-size:12px; letter-spacing:.7px; text-transform:uppercase; cursor:pointer; transition:.2s; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:linear-gradient(135deg,var(--orange-2),var(--orange)); color:#170b04; box-shadow:0 10px 28px rgba(255,104,20,.2); }
.btn-primary:hover { box-shadow:0 15px 38px rgba(255,104,20,.3); }
.btn-secondary { border-color:var(--line-strong); background:#13171b; }
.btn-secondary:hover, .btn-ghost:hover { border-color:rgba(255,104,20,.5); }
.btn-ghost { background:transparent; border-color:var(--line); }
.btn-danger { background:rgba(255,78,78,.12); border-color:rgba(255,78,78,.4); color:#ff9b9b; }
.full { width:100%; }
.hero-meta { display:flex; gap:34px; margin-top:42px; }
.hero-meta span { display:flex; flex-direction:column; color:#787f87; font-size:10px; text-transform:uppercase; letter-spacing:1.3px; }
.hero-meta b { color:#e8e8e8; font-size:17px; letter-spacing:0; }
.server-card { background:linear-gradient(145deg,rgba(24,29,34,.95),rgba(13,17,20,.95)); border:1px solid var(--line-strong); border-radius:var(--radius); padding:27px; box-shadow:var(--shadow); position:relative; overflow:hidden; }
.server-card::after { content:""; position:absolute; width:170px; height:170px; border-radius:50%; right:-70px; top:-70px; background:rgba(255,104,20,.12); filter:blur(30px); }
.server-card-top { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; position:relative; z-index:1; }
.server-card h2 { font-size:19px; margin:7px 0 0; letter-spacing:-.4px; }
.status-pill { display:inline-flex; align-items:center; gap:7px; padding:7px 10px; border-radius:30px; font-size:9px; font-weight:900; letter-spacing:1px; text-transform:uppercase; border:1px solid; }
.status-pill i, .footer-status i { width:7px; height:7px; border-radius:50%; display:block; }
.status-pill.online { color:#80eba8; border-color:rgba(54,210,118,.25); background:rgba(54,210,118,.08); }
.status-pill.online i, .footer-status.online i { background:var(--green); box-shadow:0 0 10px var(--green); }
.status-pill.offline { color:#ff9b9b; border-color:rgba(255,78,78,.25); background:rgba(255,78,78,.08); }
.status-pill.offline i, .footer-status.offline i { background:var(--red); }
.server-visual { margin:30px 0; min-height:170px; border:1px solid var(--line); border-radius:13px; background:radial-gradient(circle at center,rgba(255,104,20,.09),transparent 58%),#0b0e10; display:grid; place-items:center; position:relative; overflow:hidden; }
.radar { position:absolute; width:170px; height:170px; border:1px solid rgba(255,104,20,.18); border-radius:50%; }
.radar::before,.radar::after,.radar span { content:""; position:absolute; border:1px solid rgba(255,104,20,.12); border-radius:50%; inset:25px; }
.radar::after { inset:52px; }
.radar span { inset:78px; background:var(--orange); box-shadow:0 0 25px rgba(255,104,20,.8); }
.radar i { position:absolute; left:50%; top:50%; width:50%; height:1px; background:linear-gradient(90deg,var(--orange),transparent); transform-origin:left; animation:radar 4s linear infinite; }
@keyframes radar { to { transform:rotate(360deg); } }
.population { position:relative; z-index:2; display:flex; align-items:baseline; gap:6px; text-shadow:0 2px 12px #000; }
.population strong { font-size:58px; line-height:1; color:#fff; }
.population span { color:var(--orange); font-size:25px; }
.population b { color:#8c939a; font-size:25px; }
.population small { position:absolute; left:50%; top:68px; transform:translateX(-50%); width:max-content; font-size:8px; letter-spacing:2px; color:#777f87; }
.server-details { margin:0; display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.server-details div { border-bottom:1px solid var(--line); padding-bottom:11px; }
.server-details dt { color:#767e87; font-size:9px; text-transform:uppercase; letter-spacing:1px; }
.server-details dd { margin:3px 0 0; font-size:12px; font-weight:750; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.server-details .good { color:#86e4a8; }
.btn-server { width:100%; margin-top:22px; background:var(--orange-soft); border-color:rgba(255,104,20,.35); color:var(--orange-2); }
.hero-bottom-line { position:absolute; left:0; right:0; bottom:0; height:3px; background:linear-gradient(90deg,transparent,var(--orange),transparent); opacity:.75; }

.trust-strip { border-bottom:1px solid var(--line); background:#0d1013; }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); min-height:112px; }
.trust-grid > div { padding:27px 28px; display:grid; grid-template-columns:auto 1fr; gap:1px 13px; align-content:center; border-right:1px solid var(--line); }
.trust-grid > div:first-child { border-left:1px solid var(--line); }
.trust-grid span { grid-row:1/3; font-size:24px; filter:grayscale(1); opacity:.9; }
.trust-grid strong { font-size:11px; letter-spacing:1px; }
.trust-grid small { color:#747c84; font-size:10px; }

.section { padding:112px 0; }
.section-heading { margin-bottom:50px; }
.section-heading.center { text-align:center; max-width:760px; margin-left:auto; margin-right:auto; }
.section-heading.split { display:flex; justify-content:space-between; gap:50px; align-items:end; }
.section-heading h2, .community-copy h2 { margin:12px 0 0; font-size:clamp(42px,5vw,68px); line-height:.94; letter-spacing:-3px; text-transform:uppercase; font-weight:1000; font-style:italic; }
.section-heading > p, .section-heading.split > p { color:var(--muted); max-width:430px; margin:0; }
.section-heading.center > p { margin:20px auto 0; color:var(--muted); }
.experience-section { background:linear-gradient(180deg,#090b0d,#0d1013); }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.feature-card { min-height:310px; padding:26px; border:1px solid var(--line); background:#111519; border-radius:12px; position:relative; overflow:hidden; transition:.25s; }
.feature-card:hover { transform:translateY(-5px); border-color:rgba(255,104,20,.35); }
.feature-card.featured { background:linear-gradient(160deg,rgba(255,104,20,.13),#12171b 55%); border-color:rgba(255,104,20,.25); }
.feature-number { position:absolute; right:18px; top:14px; color:rgba(255,255,255,.07); font-size:52px; font-weight:1000; font-style:italic; }
.feature-icon { width:55px; height:55px; display:grid; place-items:center; border-radius:12px; background:var(--orange-soft); border:1px solid rgba(255,104,20,.18); font-size:25px; }
.feature-card h3 { margin:70px 0 10px; font-size:18px; text-transform:uppercase; }
.feature-card p { color:#8e969e; font-size:13px; }

.store-section { background:#0a0d0f; border-top:1px solid var(--line); }
.store-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:28px; }
.category-tabs { display:flex; flex-wrap:wrap; gap:8px; }
.category-tabs button { border:1px solid var(--line); background:#111519; color:#a6adb4; padding:9px 14px; border-radius:7px; cursor:pointer; font-size:10px; font-weight:850; text-transform:uppercase; letter-spacing:.7px; }
.category-tabs button.active, .category-tabs button:hover { color:#160b04; background:var(--orange); border-color:var(--orange); }
.search-box { width:250px; height:41px; border:1px solid var(--line); background:#111519; border-radius:7px; display:flex; align-items:center; padding:0 12px; gap:8px; }
.search-box span { color:var(--orange); font-size:20px; }
.search-box input { width:100%; border:0; outline:0; background:transparent; color:#fff; font-size:12px; }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.product-card { background:#111519; border:1px solid var(--line); border-radius:13px; overflow:hidden; min-height:405px; display:flex; flex-direction:column; transition:.25s; position:relative; }
.product-card:hover { transform:translateY(-5px); border-color:rgba(255,104,20,.42); box-shadow:0 20px 55px rgba(0,0,0,.25); }
.product-card.featured::before { content:""; position:absolute; inset:0 0 auto; height:2px; background:linear-gradient(90deg,transparent,var(--orange),transparent); }
.product-art { height:140px; display:grid; place-items:center; background:radial-gradient(circle at center,rgba(255,104,20,.14),transparent 60%),linear-gradient(145deg,#171c21,#0d1114); position:relative; border-bottom:1px solid var(--line); }
.product-art::before { content:""; position:absolute; width:85px; height:85px; border:1px solid rgba(255,104,20,.18); transform:rotate(45deg); }
.product-icon { font-size:48px; position:relative; z-index:1; filter:drop-shadow(0 10px 15px rgba(0,0,0,.45)); }
.product-badge { position:absolute; left:13px; top:13px; z-index:2; font-size:8px; letter-spacing:1px; text-transform:uppercase; color:var(--orange-2); border:1px solid rgba(255,104,20,.28); background:rgba(8,10,12,.75); border-radius:20px; padding:5px 8px; }
.product-content { padding:21px; display:flex; flex-direction:column; flex:1; }
.product-category { color:#757e87; font-size:8px; font-weight:900; letter-spacing:1.6px; text-transform:uppercase; }
.product-content h3 { margin:7px 0 8px; font-size:19px; }
.product-content > p { margin:0; color:#929aa2; font-size:12px; min-height:38px; }
.product-list { list-style:none; padding:0; margin:16px 0; display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.product-list li { color:#b8bec4; font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.product-list li::before { content:"✓"; color:var(--green); margin-right:5px; font-weight:900; }
.product-bottom { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:16px; }
.product-price strong { display:block; font-size:24px; color:#fff; }
.product-price small { display:block; font-size:8px; color:#6f7780; text-transform:uppercase; }
.add-cart { width:44px; height:44px; border-radius:8px; border:1px solid rgba(255,104,20,.34); background:var(--orange-soft); color:var(--orange); font-size:22px; cursor:pointer; }
.add-cart:hover { background:var(--orange); color:#140b05; }
.loading-card, .empty-products { grid-column:1/-1; min-height:220px; display:grid; place-items:center; color:var(--muted); border:1px dashed var(--line-strong); border-radius:12px; }
.store-note { margin-top:22px; border:1px solid var(--line); background:#101418; border-radius:10px; padding:16px 18px; display:flex; align-items:center; gap:14px; color:#8e969e; font-size:11px; }
.store-note span { font-size:21px; }.store-note p { margin:0; }.store-note strong { color:#dce0e4; }

.ranking-section { background:linear-gradient(180deg,#0e1114,#090b0d); }
.podium { display:grid; grid-template-columns:1fr 1.15fr 1fr; max-width:860px; margin:0 auto 35px; align-items:end; gap:12px; }
.podium-slot { background:#12171b; border:1px solid var(--line); border-radius:13px 13px 0 0; min-height:175px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; position:relative; }
.podium-slot.first { min-height:220px; border-color:rgba(255,104,20,.35); background:linear-gradient(180deg,rgba(255,104,20,.11),#12171b); }
.podium-avatar { width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:#232a30; border:2px solid #555e67; font-weight:1000; font-size:21px; margin-bottom:10px; background-size:cover; background-position:center; }
.first .podium-avatar { width:72px; height:72px; border-color:var(--orange); box-shadow:0 0 25px rgba(255,104,20,.2); }
.crown { position:absolute; top:-25px; color:var(--orange); font-size:35px; }
.podium-slot > span { color:var(--orange); font-size:10px; font-weight:900; }
.podium-slot strong { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; margin:5px 0; }
.podium-slot small { color:#77808a; font-size:10px; }
.ranking-card { border:1px solid var(--line); background:#101418; border-radius:12px; overflow:hidden; }
.ranking-head,.ranking-row { display:grid; grid-template-columns:.7fr 2.2fr 1fr 1.2fr 1fr 1fr; align-items:center; min-height:58px; padding:0 22px; gap:10px; }
.ranking-head { min-height:42px; background:#171c20; color:#717a83; font-size:8px; font-weight:900; letter-spacing:1.1px; }
.ranking-row { border-top:1px solid var(--line); font-size:12px; transition:.2s; }
.ranking-row:hover { background:rgba(255,255,255,.025); }
.rank-number { color:#858d95; font-weight:900; }.rank-number.top { color:var(--orange); font-size:17px; }
.rank-player { display:flex; align-items:center; gap:10px; min-width:0; }
.rank-avatar { width:30px; height:30px; border-radius:6px; background:#262d33; display:grid; place-items:center; font-weight:900; color:#bbc1c6; }
.rank-player strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rank-kills { color:#fff; font-weight:900; }.rank-headshots { color:#f5b863; }.rank-kdr { color:#8fdda9; }
.empty-state { min-height:130px; display:grid; place-items:center; color:#727a83; font-size:12px; text-align:center; padding:20px; }

.community-section { background:#0d1013; border-top:1px solid var(--line); }
.community-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; align-items:center; }
.community-copy h2 { margin:12px 0 22px; }
.community-copy > p { color:var(--muted); max-width:500px; }
.community-actions { display:flex; gap:20px; align-items:center; margin-top:30px; }
.text-link { color:#bac0c6; font-size:12px; font-weight:800; }.text-link:hover { color:var(--orange); }
.social-numbers { display:flex; gap:28px; margin-top:48px; padding-top:28px; border-top:1px solid var(--line); }
.social-numbers div { display:flex; flex-direction:column; }.social-numbers strong { font-size:22px; color:var(--orange); }.social-numbers span { font-size:9px; color:#747d85; text-transform:uppercase; letter-spacing:.8px; }
.chat-panel { border:1px solid var(--line); background:#0a0d0f; border-radius:14px; overflow:hidden; box-shadow:var(--shadow); }
.chat-header { height:58px; display:flex; justify-content:space-between; align-items:center; padding:0 18px; border-bottom:1px solid var(--line); background:#13181c; font-size:10px; letter-spacing:1px; }
.chat-header div { display:flex; align-items:center; gap:9px; }.chat-header i { width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 10px var(--green); }.chat-header > span { color:#6e7780; font-size:8px; }
.chat-messages { height:315px; overflow:auto; padding:17px; display:flex; flex-direction:column; gap:10px; }
.chat-empty { margin:auto; color:#68717a; font-size:11px; text-align:center; }
.chat-message { display:flex; gap:9px; align-items:flex-start; }
.chat-user { min-width:28px; height:28px; border-radius:6px; display:grid; place-items:center; background:#21282e; color:#dce0e4; font-size:9px; font-weight:900; }
.chat-body { min-width:0; }.chat-body strong { color:var(--orange-2); font-size:10px; }.chat-body p { margin:1px 0 0; color:#adb4ba; font-size:11px; word-break:break-word; }.chat-body time { color:#555e66; font-size:8px; margin-left:6px; }
.chat-form { height:58px; display:flex; border-top:1px solid var(--line); padding:9px; gap:8px; }
.chat-form input { flex:1; border:1px solid var(--line); background:#12171b; color:#fff; border-radius:7px; padding:0 12px; outline:0; font-size:11px; }.chat-form input:focus { border-color:rgba(255,104,20,.45); }
.chat-form button { width:80px; border:0; border-radius:7px; background:var(--orange); color:#160b04; font-weight:900; font-size:10px; cursor:pointer; }.chat-form button:disabled,.chat-form input:disabled { opacity:.45; cursor:not-allowed; }

.dashboard-section { background:#0a0d0f; border-top:1px solid var(--line); }
.dashboard-layout { display:grid; grid-template-columns:300px 1fr; gap:20px; align-items:start; }
.player-card { border:1px solid var(--line); background:linear-gradient(160deg,rgba(255,104,20,.09),#111519 45%); border-radius:14px; padding:24px; position:sticky; top:100px; }
.big-avatar { width:88px; height:88px; border-radius:14px; display:grid; place-items:center; background:#262d33; color:#fff; font-size:27px; font-weight:1000; background-size:cover; background-position:center; border:2px solid rgba(255,104,20,.35); }
.player-card h3 { margin:16px 0 2px; font-size:20px; }.player-card .steam-id { color:#69727a; font-size:9px; word-break:break-all; }
.player-tags { display:flex; flex-wrap:wrap; gap:6px; margin:16px 0 22px; }.tag { padding:5px 8px; border:1px solid var(--line); border-radius:20px; font-size:8px; text-transform:uppercase; letter-spacing:.8px; }.tag.vip { color:var(--yellow); border-color:rgba(255,195,74,.3); }.tag.admin { color:#ff9292; border-color:rgba(255,78,78,.3); }.tag.verified { color:#79dda0; border-color:rgba(54,210,118,.3); }
.balance-box { border:1px solid var(--line); background:#0b0e10; border-radius:9px; padding:14px; display:flex; justify-content:space-between; align-items:center; }.balance-box span { color:#7d858d; font-size:9px; text-transform:uppercase; }.balance-box strong { color:var(--orange); font-size:18px; }
.dashboard-main { display:grid; gap:16px; }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.stat-box { border:1px solid var(--line); background:#111519; border-radius:11px; padding:18px; }.stat-box span { display:block; color:#737b84; font-size:8px; text-transform:uppercase; letter-spacing:1px; }.stat-box strong { display:block; font-size:27px; margin-top:5px; }.stat-box small { color:#5f6871; font-size:8px; }
.dashboard-card { border:1px solid var(--line); background:#111519; border-radius:12px; padding:20px; overflow:hidden; }
.card-title { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding-bottom:13px; margin-bottom:16px; }.card-title h3 { margin:0; font-size:14px; text-transform:uppercase; }.card-title span { color:#69727b; font-size:9px; text-transform:uppercase; }
.daily-reward { display:flex; align-items:center; gap:16px; }.coin-stack { width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:rgba(255,195,74,.12); border:1px solid rgba(255,195,74,.3); color:var(--yellow); font-size:25px; }.daily-reward div:nth-child(2) { flex:1; }.daily-reward strong { font-size:14px; }.daily-reward p { margin:2px 0 0; color:#747d85; font-size:10px; }
.order-item { display:grid; grid-template-columns:1.2fr .7fr .5fr; gap:12px; align-items:center; min-height:58px; border-bottom:1px solid var(--line); font-size:10px; }.order-item:last-child { border:0; }.order-item strong { font-size:11px; }.order-item small { display:block; color:#667079; }.order-status { justify-self:start; padding:5px 8px; border-radius:20px; background:#1b2227; text-transform:uppercase; font-size:8px; }.order-status.delivered { color:#7be2a1; background:rgba(54,210,118,.08); }.order-status.delivering { color:#ffc671; background:rgba(255,195,74,.08); }.order-status.pending_payment { color:#9da5ac; }
.ticket-form { display:grid; grid-template-columns:1fr auto; gap:10px; }.ticket-form input,.ticket-form textarea { border:1px solid var(--line); background:#0b0e10; color:#fff; border-radius:7px; outline:0; padding:10px 12px; font-size:11px; }.ticket-form textarea { grid-column:1/-1; min-height:100px; resize:vertical; }.ticket-form button { grid-column:2; }

.admin-section { background:#0d1013; border-top:1px solid var(--line); }
.admin-actions { display:flex; gap:10px; }
.admin-summary { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-bottom:18px; }.admin-metric { border:1px solid var(--line); background:#111519; border-radius:10px; padding:16px; }.admin-metric span { color:#737c84; font-size:8px; text-transform:uppercase; }.admin-metric strong { display:block; font-size:24px; margin-top:4px; }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.admin-table { max-height:520px; overflow:auto; }.admin-row { border-bottom:1px solid var(--line); padding:11px 0; display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; }.admin-row:last-child { border:0; }.admin-row strong { font-size:10px; }.admin-row small { display:block; color:#657078; font-size:8px; }.admin-buttons { display:flex; gap:4px; flex-wrap:wrap; justify-content:flex-end; }.mini-btn { border:1px solid var(--line); background:#171c20; border-radius:5px; padding:5px 7px; font-size:7px; text-transform:uppercase; cursor:pointer; }.mini-btn.active { border-color:rgba(255,104,20,.4); color:var(--orange); }.mini-btn.danger.active { color:#ff8787; border-color:rgba(255,78,78,.4); }

.rules-section { background:#090b0d; }
.rules-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.rules-grid article { border-top:2px solid var(--orange); background:#111519; padding:23px; min-height:205px; }.rules-grid b { color:rgba(255,104,20,.5); font-size:28px; font-style:italic; }.rules-grid h3 { text-transform:uppercase; font-size:15px; margin:25px 0 8px; }.rules-grid p { color:#858e96; font-size:11px; }

footer { border-top:1px solid var(--line); background:#07090a; padding-top:58px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; padding-bottom:48px; }.footer-brand { align-self:start; }.footer-grid h4 { font-size:9px; letter-spacing:1.2px; text-transform:uppercase; color:#858e96; margin:0 0 14px; }.footer-grid > div:not(:first-child) { display:flex; flex-direction:column; gap:8px; }.footer-grid a { color:#69727b; font-size:10px; }.footer-grid a:hover { color:var(--orange); }
.footer-bottom { min-height:60px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; color:#555e67; font-size:9px; }.footer-status { display:flex; align-items:center; gap:7px; }.footer-status i { background:#707880; }

.cart-drawer { position:fixed; z-index:300; right:0; top:0; bottom:0; width:min(430px,100%); background:#0d1013; border-left:1px solid var(--line-strong); transform:translateX(100%); transition:.28s ease; display:flex; flex-direction:column; box-shadow:-25px 0 70px rgba(0,0,0,.45); }
.cart-open .cart-drawer { transform:translateX(0); }.drawer-overlay { position:fixed; z-index:290; inset:0; background:rgba(0,0,0,.7); opacity:0; visibility:hidden; transition:.25s; backdrop-filter:blur(4px); }.cart-open .drawer-overlay { opacity:1; visibility:visible; }
.cart-header { display:flex; justify-content:space-between; padding:25px; border-bottom:1px solid var(--line); }.cart-header h2 { margin:4px 0 0; font-size:28px; }.cart-header button { border:0; background:transparent; font-size:30px; color:#7a838c; cursor:pointer; }
.cart-items { flex:1; overflow:auto; padding:18px; }.empty-cart { height:100%; display:grid; place-content:center; justify-items:center; color:#707983; }.empty-cart span { font-size:40px; opacity:.5; }
.cart-item { display:grid; grid-template-columns:54px 1fr auto; gap:12px; align-items:center; border-bottom:1px solid var(--line); padding:14px 0; }.cart-item-icon { width:54px; height:54px; border-radius:9px; background:#171c21; display:grid; place-items:center; font-size:25px; }.cart-item strong { font-size:11px; }.cart-item small { color:#777f87; display:block; font-size:9px; }.cart-item-controls { display:flex; align-items:center; gap:6px; margin-top:6px; }.cart-item-controls button { width:22px; height:22px; border:1px solid var(--line); background:#171c20; border-radius:4px; cursor:pointer; }.cart-remove { border:0!important; background:transparent!important; color:#d76f6f; }
.cart-footer { border-top:1px solid var(--line); padding:20px; background:#101418; }.cart-footer label { color:#737c84; font-size:8px; text-transform:uppercase; letter-spacing:1px; }.cart-footer input { width:100%; height:39px; margin-top:6px; border:1px solid var(--line); background:#090c0e; color:#fff; border-radius:6px; padding:0 10px; outline:0; }.cart-total { display:flex; justify-content:space-between; align-items:center; margin:18px 0; }.cart-total span { color:#91999f; font-size:11px; }.cart-total strong { font-size:25px; color:var(--orange); }.cart-footer small { display:block; color:#626b73; font-size:8px; text-align:center; margin-top:10px; }.cart-footer button:disabled { opacity:.4; cursor:not-allowed; transform:none; }

.toast-container { position:fixed; z-index:500; right:18px; bottom:18px; display:grid; gap:9px; }.toast { width:min(360px,calc(100vw - 36px)); padding:14px 16px; border-radius:9px; border:1px solid var(--line-strong); background:#171c20; box-shadow:var(--shadow); font-size:11px; animation:toastIn .25s ease; }.toast.success { border-left:3px solid var(--green); }.toast.error { border-left:3px solid var(--red); }.toast.info { border-left:3px solid var(--orange); }
@keyframes toastIn { from { transform:translateY(15px); opacity:0; } }
.reveal { animation:fadeUp .65s both; }
@keyframes fadeUp { from { opacity:0; transform:translateY(18px); } }

@media (max-width:1050px) {
  .nav { position:fixed; left:20px; right:20px; top:88px; display:none; flex-direction:column; align-items:stretch; background:#111519; border:1px solid var(--line-strong); border-radius:12px; padding:15px; box-shadow:var(--shadow); }
  .nav.open { display:flex; }.nav a { padding:10px; }.mobile-menu { display:block; }.header-actions { margin-left:0; }.header-inner { gap:13px; }
  .hero-content { grid-template-columns:1fr .8fr; gap:35px; }.hero h1 { font-size:70px; }
  .feature-grid { grid-template-columns:1fr 1fr; }.product-grid { grid-template-columns:1fr 1fr; }.community-grid { gap:35px; }
  .admin-summary { grid-template-columns:repeat(3,1fr); }.rules-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:780px) {
  .container { width:min(100% - 26px,var(--container)); }.site-header .brand small { display:none; }.site-header .brand-mark { width:33px; height:37px; }.site-header .brand strong,.site-header .brand b { font-size:16px; }
  .steam-button span:last-child,.profile-button span:last-child { display:none; }.steam-button,.profile-button { padding:0 10px; }.header-actions { gap:6px; }.icon-button { width:40px; }
  .hero { min-height:auto; }.hero-content { grid-template-columns:1fr; padding-top:75px; }.hero h1 { font-size:clamp(53px,16vw,78px); letter-spacing:-3px; }.hero-copy > p { font-size:14px; }.server-card { margin-bottom:30px; }
  .trust-grid { grid-template-columns:1fr 1fr; }.trust-grid > div { border-bottom:1px solid var(--line); }.section { padding:82px 0; }.section-heading.split { display:block; }.section-heading.split > p { margin-top:18px; }.section-heading h2,.community-copy h2 { font-size:45px; letter-spacing:-2px; }
  .feature-grid,.product-grid { grid-template-columns:1fr; }.store-toolbar { align-items:stretch; flex-direction:column; }.search-box { width:100%; }.product-card { min-height:390px; }
  .podium { gap:5px; }.podium-slot { padding:10px; min-height:145px; }.podium-slot.first { min-height:185px; }.podium-avatar { width:45px;height:45px; }.first .podium-avatar { width:58px;height:58px; }.podium-slot strong { font-size:9px; }.ranking-head,.ranking-row { grid-template-columns:.5fr 1.8fr .8fr .9fr; padding:0 10px; }.ranking-head span:nth-child(5),.ranking-head span:nth-child(6),.ranking-row > :nth-child(5),.ranking-row > :nth-child(6) { display:none; }
  .community-grid { grid-template-columns:1fr; }.community-actions { flex-wrap:wrap; }.social-numbers { justify-content:space-between; gap:10px; }.dashboard-layout { grid-template-columns:1fr; }.player-card { position:static; }.stat-grid { grid-template-columns:1fr 1fr; }.daily-reward { flex-wrap:wrap; }.daily-reward .btn { width:100%; }.ticket-form { grid-template-columns:1fr; }.ticket-form button { grid-column:1; }.admin-grid { grid-template-columns:1fr; }.admin-summary { grid-template-columns:1fr 1fr; }.admin-actions { margin-top:20px; flex-wrap:wrap; }.rules-grid { grid-template-columns:1fr; }.footer-grid { grid-template-columns:1fr 1fr; }.footer-brand { grid-column:1/-1; }.footer-bottom { gap:20px; align-items:flex-start; flex-direction:column; padding:20px 0; }
}
@media (max-width:480px) {
  .hero-actions { flex-direction:column; }.hero-actions .btn { width:100%; }.hero-meta { gap:16px; }.server-details { grid-template-columns:1fr; }.trust-grid { grid-template-columns:1fr; }.trust-grid > div { border-left:1px solid var(--line); }.category-tabs { display:grid; grid-template-columns:1fr 1fr; }.category-tabs button:last-child { grid-column:1/-1; }.product-list { grid-template-columns:1fr; }.podium { margin-left:-5px; margin-right:-5px; }.social-numbers { display:grid; grid-template-columns:repeat(3,1fr); }.social-numbers strong { font-size:18px; }.chat-messages { height:270px; }.admin-summary { grid-template-columns:1fr; }.footer-grid { grid-template-columns:1fr; }.footer-brand { grid-column:auto; }
}

/* =========================================================
   HURTLATAN 2.0 — TACTICAL VISUAL UPGRADE
   ========================================================= */
:root {
  --orange-deep: #a92d00;
  --steel: #cfd4d7;
  --ink: #050708;
}
body::before {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 15% 10%, rgba(255,104,20,.06), transparent 25%),
    radial-gradient(circle at 85% 75%, rgba(255,104,20,.035), transparent 28%);
}
.site-header {
  background:linear-gradient(180deg,rgba(5,7,8,.96),rgba(8,10,12,.86));
  box-shadow:0 12px 45px rgba(0,0,0,.28);
}
.site-header::after {
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,104,20,.55),transparent);
}
.brand-logo { min-width:0; }
.brand-logo img { width:215px; height:auto; display:block; filter:drop-shadow(0 8px 16px rgba(0,0,0,.48)); }
.footer-brand img { width:min(270px,100%); }

.hero {
  min-height:900px;
  background:
    linear-gradient(90deg,rgba(5,7,8,.98) 0%,rgba(5,7,8,.92) 38%,rgba(5,7,8,.55) 68%,rgba(5,7,8,.92) 100%),
    radial-gradient(circle at 74% 40%, rgba(255,104,20,.17), transparent 31%),
    #060809;
}
.hero::before {
  opacity:.5;
  background:
    linear-gradient(90deg,rgba(5,7,8,.98) 0%,rgba(5,7,8,.72) 45%,rgba(5,7,8,.18) 74%,rgba(5,7,8,.8) 100%),
    url('/assets/hurtlatan-radar.svg') right -80px center / min(66vw,780px) auto no-repeat;
  filter:saturate(.85) contrast(1.08);
}
.hero::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(115deg,transparent 0 82px,rgba(255,255,255,.018) 83px 84px),
    linear-gradient(180deg,transparent 72%,rgba(0,0,0,.72));
}
.hero-grid { opacity:.15; }
.hero-glow {
  width:620px; height:620px;
  right:2%; top:17%;
  border-color:rgba(255,104,20,.24);
  box-shadow:0 0 130px rgba(255,104,20,.1), inset 0 0 110px rgba(255,104,20,.04);
}
.hero-seal { display:flex; align-items:center; gap:18px; margin-bottom:20px; }
.hero-seal img { width:min(430px,78vw); height:auto; }
.hero-seal span {
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  color:#6f777d;
  font-size:7px;
  letter-spacing:2px;
  font-weight:900;
}
.hero h1 {
  text-shadow:0 10px 35px rgba(0,0,0,.65);
  max-width:760px;
}
.hero h1 span { text-shadow:0 0 35px rgba(255,104,20,.16); }
.hero-copy > p { max-width:670px; }
.hero-meta { flex-wrap:wrap; }
.hero-meta span { position:relative; padding-left:14px; }
.hero-meta span::before { content:""; position:absolute; left:0; top:6px; width:4px; height:26px; background:linear-gradient(var(--orange),transparent); }

.server-card {
  border-color:rgba(255,104,20,.25);
  background:
    linear-gradient(145deg,rgba(20,24,28,.96),rgba(8,11,13,.98)),
    url('/assets/hurtlatan-radar.svg') center/cover;
  box-shadow:0 32px 100px rgba(0,0,0,.58),0 0 0 1px rgba(255,104,20,.04) inset;
}
.server-card::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.035),transparent 35%),repeating-linear-gradient(90deg,transparent 0 28px,rgba(255,255,255,.012) 29px 30px);
}
.server-visual { min-height:220px; background:#070a0c; }
.server-radar-map { position:absolute; inset:-38%; width:176%; max-width:none; opacity:.22; animation:radarDrift 18s ease-in-out infinite alternate; }
@keyframes radarDrift { to { transform:scale(1.04) rotate(3deg); opacity:.3; } }
.radar-coordinates { position:absolute; inset:12px 13px auto; display:flex; justify-content:space-between; color:rgba(255,174,91,.6); font-size:7px; font-weight:850; letter-spacing:1.4px; }
.radar { width:190px; height:190px; box-shadow:0 0 45px rgba(255,104,20,.05); }
.population strong { font-size:68px; }
.sync-telemetry { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:17px; }
.sync-telemetry span { display:flex; align-items:center; justify-content:center; gap:6px; min-height:29px; border:1px solid var(--line); background:rgba(6,8,10,.62); border-radius:5px; color:#7e878e; font-size:7px; font-weight:900; letter-spacing:.7px; }
.sync-telemetry i { width:5px; height:5px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); }
.sync-telemetry .offline i { background:var(--red); box-shadow:0 0 8px var(--red); }

.trust-strip { background:linear-gradient(180deg,#0d1013,#090c0e); }
.trust-grid > div { position:relative; overflow:hidden; }
.trust-grid > div::after { content:""; position:absolute; right:-20px; bottom:-30px; width:80px; height:80px; border:1px solid rgba(255,104,20,.08); transform:rotate(45deg); }
.feature-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:linear-gradient(90deg,transparent,rgba(255,104,20,.55),transparent); transform:scaleX(0); transition:.25s; }
.feature-card:hover::after { transform:scaleX(1); }

.intel-section {
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(110deg,rgba(7,9,11,.98),rgba(12,15,17,.94)),
    repeating-linear-gradient(0deg,transparent 0 39px,rgba(255,255,255,.015) 40px);
}
.intel-section::before {
  content:"HURTLATAN // COMBAT NETWORK // LIVE SIGNAL";
  position:absolute;
  left:-12px; right:-12px; top:24px;
  color:rgba(255,255,255,.025);
  font-size:76px;
  font-weight:1000;
  letter-spacing:-3px;
  white-space:nowrap;
  transform:rotate(-2deg);
}
.intel-layout { position:relative; z-index:1; display:grid; grid-template-columns:minmax(360px,.9fr) 1.1fr; gap:80px; align-items:center; }
.intel-radar { position:relative; aspect-ratio:1; border:1px solid rgba(255,104,20,.25); border-radius:50%; overflow:hidden; background:#060809; box-shadow:0 0 100px rgba(255,104,20,.08); }
.intel-radar::before { content:""; position:absolute; inset:8%; border:1px solid rgba(255,104,20,.18); border-radius:50%; z-index:2; }
.intel-radar img { width:100%; height:100%; object-fit:cover; opacity:.82; }
.intel-scanline { position:absolute; z-index:3; left:50%; top:50%; width:48%; height:2px; transform-origin:left; background:linear-gradient(90deg,var(--orange),transparent); box-shadow:0 0 20px rgba(255,104,20,.65); animation:radar 4s linear infinite; }
.intel-label { position:absolute; z-index:4; left:50%; transform:translateX(-50%); padding:7px 12px; background:rgba(5,7,8,.78); border:1px solid rgba(255,104,20,.25); color:#ffad62; font-size:7px; font-weight:900; letter-spacing:1.6px; white-space:nowrap; }
.intel-label.top { top:7%; }.intel-label.bottom { bottom:7%; }
.intel-copy h2 { margin:13px 0 20px; font-size:clamp(46px,5vw,70px); line-height:.92; letter-spacing:-3px; text-transform:uppercase; font-style:italic; }
.intel-copy h2 span { color:var(--orange); }
.intel-copy > p { color:#9ba3aa; max-width:650px; font-size:15px; }
.intel-list { margin-top:34px; display:grid; gap:10px; }
.intel-list article { display:grid; grid-template-columns:48px 1fr; gap:15px; align-items:center; min-height:76px; padding:13px 15px; border:1px solid var(--line); background:linear-gradient(90deg,rgba(255,104,20,.05),rgba(13,17,20,.7)); border-radius:8px; }
.intel-list b { color:rgba(255,104,20,.7); font-size:25px; font-style:italic; }
.intel-list strong { display:block; font-size:11px; letter-spacing:1px; }
.intel-list span { display:block; color:#7f8990; font-size:11px; margin-top:3px; }

.store-section { background:radial-gradient(circle at 85% 15%,rgba(255,104,20,.055),transparent 28%),#090c0e; }
.product-card { box-shadow:0 16px 40px rgba(0,0,0,.12); }
.product-art { overflow:hidden; }
.product-art::after { content:"HLT"; position:absolute; right:12px; bottom:-12px; color:rgba(255,255,255,.025); font-size:72px; font-weight:1000; font-style:italic; }
.ranking-section { background:linear-gradient(180deg,#080a0c,#0e1215); }
.ranking-card { box-shadow:0 24px 80px rgba(0,0,0,.28); }

.chat-panel { border-color:rgba(255,104,20,.2); box-shadow:0 24px 75px rgba(0,0,0,.35); }
.chat-header { background:linear-gradient(90deg,rgba(255,104,20,.08),transparent),#101418; }
.bridge-state { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border:1px solid; border-radius:30px; font-size:7px!important; letter-spacing:.9px!important; }
.bridge-state::before { content:""; width:6px; height:6px; border-radius:50%; }
.bridge-state.online { color:#7ce3a2!important; border-color:rgba(54,210,118,.25); background:rgba(54,210,118,.07); }
.bridge-state.online::before { background:var(--green); box-shadow:0 0 8px var(--green); }
.bridge-state.offline { color:#ff9292!important; border-color:rgba(255,78,78,.25); background:rgba(255,78,78,.07); }
.bridge-state.offline::before { background:var(--red); }
.chat-message { position:relative; }
.chat-message::after { content:""; position:absolute; left:42px; right:0; bottom:-8px; height:1px; background:linear-gradient(90deg,var(--line),transparent); }

@media (max-width:1050px) {
  .brand-logo img { width:185px; }
  .intel-layout { gap:45px; }
}
@media (max-width:900px) {
  .intel-layout { grid-template-columns:1fr; }
  .intel-radar { width:min(560px,100%); margin:0 auto; }
}
@media (max-width:780px) {
  .brand-logo img { width:150px; }
  .hero { min-height:auto; }
  .hero-seal img { width:min(360px,85vw); }
  .hero-seal span { display:none; }
  .hero::before { background-position:center 110px; background-size:760px auto; opacity:.28; }
  .sync-telemetry { grid-template-columns:1fr; }
  .intel-section::before { font-size:44px; }
}
@media (max-width:480px) {
  .brand-logo img { width:123px; }
  .header-inner { gap:8px; }
  .hero-seal { margin-bottom:12px; }
  .hero-meta { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .intel-list article { grid-template-columns:38px 1fr; }
  .intel-copy h2 { font-size:43px; }
}