:root {
  --ink: #172033;
  --muted: #667085;
  --muted-2: #8b94a7;
  --line: #e5e8f0;
  --line-strong: #d8ddea;
  --surface: #ffffff;
  --surface-soft: #f7f8fc;
  --surface-tint: #f1f3ff;
  --primary: #6557f5;
  --primary-dark: #5043df;
  --primary-pale: #ebe9ff;
  --green: #1c9b6c;
  --green-pale: #e5f7f0;
  --orange: #ea8b3d;
  --red: #e55a64;
  --navy: #151a2d;
  --shadow-sm: 0 5px 18px rgba(32, 40, 70, 0.06);
  --shadow-md: 0 18px 55px rgba(38, 47, 85, 0.1);
  --shadow-lg: 0 30px 85px rgba(29, 36, 70, 0.16);
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --shell: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--surface);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(101, 87, 245, 0.24);
  outline-offset: 2px;
}

.shell { width: min(calc(100% - 40px), var(--shell)); margin-inline: auto; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 999;
  transform: translateY(-160%);
  padding: 10px 14px;
  background: var(--navy);
  color: #fff;
  border-radius: 8px;
}
.skip-link:focus { transform: none; }

.announcement { background: #181d31; color: #e5e7ff; font-size: 12px; letter-spacing: .01em; }
.announcement-inner { height: 34px; display: flex; align-items: center; justify-content: center; gap: 18px; }
.announcement-inner > span { display: inline-flex; align-items: center; gap: 8px; }
.announcement a { color: #aaa3ff; font-weight: 700; }
.pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: #67e6b4; box-shadow: 0 0 0 5px rgba(103, 230, 180, .08); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, .91);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(226, 229, 238, .85);
}
.nav-wrap { min-height: 72px; display: flex; align-items: center; gap: 38px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 800; letter-spacing: -.04em; white-space: nowrap; }
.brand > span:last-child > span { color: var(--primary); }
.brand-mark {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(145deg, #7367ff, #4e42d9);
  border-radius: 11px 11px 11px 4px;
  box-shadow: 0 8px 16px rgba(101, 87, 245, .24);
  transform: rotate(-3deg);
}
.brand-mark span { transform: rotate(3deg); font-weight: 900; }
.primary-nav { display: flex; align-items: center; gap: 27px; margin-right: auto; }
.primary-nav a { color: #5f687a; font-size: 14px; font-weight: 650; transition: color .18s ease; }
.primary-nav a:hover, .primary-nav a.active { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 8px; }
.button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: 11px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 750;
  line-height: 1;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.button:hover { transform: translateY(-1px); }
.button-primary { color: #fff; background: linear-gradient(145deg, #7164ff, #5b4ee9); box-shadow: 0 8px 18px rgba(101, 87, 245, .2); }
.button-primary:hover { box-shadow: 0 10px 24px rgba(101, 87, 245, .28); }
.button-ghost { background: transparent; border-color: transparent; color: #4c566b; }
.button-ghost:hover { background: #f4f5f9; }
.button-secondary { background: #fff; border-color: var(--line-strong); color: #303a4e; box-shadow: var(--shadow-sm); }
.button-secondary:hover { border-color: #c8cce0; }
.button-dark { background: var(--navy); color: #fff; box-shadow: 0 8px 18px rgba(21, 26, 45, .16); }
.button-light { color: #312b75; background: #fff; box-shadow: 0 10px 25px rgba(30, 26, 96, .18); }
.button-icon { font-size: 18px; font-weight: 400; line-height: 0; }
.full-button { width: 100%; }
.icon-button { border: 0; background: transparent; padding: 8px; cursor: pointer; }
.menu-button { display: none; width: 42px; height: 42px; margin-left: auto; }
.menu-button span { display: block; width: 22px; height: 2px; margin: 4px auto; background: var(--ink); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }

.hero { position: relative; overflow: hidden; min-height: 680px; background: linear-gradient(180deg, #fbfbfe 0%, #f8f8fc 60%, #fff 100%); }
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(95, 84, 190, .032) 1px, transparent 1px), linear-gradient(90deg, rgba(95, 84, 190, .032) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
}
.hero-glow { position: absolute; border-radius: 999px; filter: blur(4px); pointer-events: none; }
.hero-glow-one { width: 460px; height: 460px; right: 2%; top: 4%; background: radial-gradient(circle, rgba(121, 106, 255, .15), rgba(121, 106, 255, 0) 70%); }
.hero-glow-two { width: 300px; height: 300px; left: 4%; bottom: -20%; background: radial-gradient(circle, rgba(82, 199, 168, .1), rgba(82, 199, 168, 0) 72%); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr); align-items: center; gap: 78px; padding-top: 94px; padding-bottom: 100px; }
.eyebrow, .section-kicker { color: var(--primary-dark); font-size: 11px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 7px 10px; background: #f0efff; border: 1px solid #e2dfff; border-radius: 999px; }
.eyebrow-icon { font-size: 12px; }
.hero h1 { max-width: 650px; margin: 20px 0 18px; color: #182039; font-size: clamp(54px, 6vw, 79px); line-height: .98; letter-spacing: -.067em; font-weight: 840; }
.hero-lead { max-width: 580px; margin-bottom: 28px; color: #626d80; font-size: 18px; line-height: 1.65; }
.hero-search { max-width: 610px; min-height: 62px; display: flex; align-items: center; gap: 12px; padding: 7px 7px 7px 18px; background: #fff; border: 1px solid #dfe3ed; border-radius: 15px; box-shadow: 0 16px 45px rgba(39, 46, 83, .11); }
.search-icon { position: relative; flex: 0 0 auto; width: 17px; height: 17px; border: 2px solid #8a93a6; border-radius: 50%; }
.search-icon::after { content: ""; position: absolute; width: 7px; height: 2px; right: -5px; bottom: -2px; transform: rotate(45deg); background: #8a93a6; border-radius: 2px; }
.hero-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink); background: transparent; }
.hero-search input::placeholder { color: #9ba2b2; }
.hero-search .button { min-height: 48px; padding-inline: 21px; }
.popular-searches { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 13px; color: #9098a8; font-size: 11px; }
.popular-searches button { padding: 0; border: 0; background: none; color: #626b7c; cursor: pointer; text-decoration: underline; text-decoration-color: #d6d9e0; text-underline-offset: 3px; }
.trust-row { display: flex; align-items: center; gap: 25px; margin-top: 37px; }
.trust-row > div { display: flex; align-items: center; gap: 10px; }
.trust-row > div + div { padding-left: 23px; border-left: 1px solid var(--line); }
.trust-icon { width: 30px; height: 30px; display: inline-grid; place-items: center; border-radius: 9px; font-size: 13px; font-weight: 900; }
.trust-shield { color: var(--green); background: var(--green-pale); }
.trust-spark { color: var(--primary); background: var(--primary-pale); }
.trust-bolt { color: #3f79c8; background: #e9f1fc; }
.trust-row strong, .trust-row small { display: block; white-space: nowrap; }
.trust-row strong { font-size: 12px; }
.trust-row small { margin-top: 1px; color: #98a0af; font-size: 10px; }

.hero-visual { position: relative; min-height: 475px; display: grid; place-items: center; }
.hero-visual::before { content: ""; position: absolute; width: 405px; height: 405px; border: 1px solid rgba(101, 87, 245, .14); border-radius: 50%; }
.orbit { position: absolute; border: 1px dashed rgba(101, 87, 245, .16); border-radius: 50%; }
.orbit-one { width: 500px; height: 500px; }
.orbit-two { width: 325px; height: 325px; }
.discovery-card { position: relative; z-index: 3; width: min(100%, 412px); padding: 25px; background: rgba(255, 255, 255, .94); border: 1px solid rgba(221, 224, 236, .92); border-radius: 24px; box-shadow: var(--shadow-lg); backdrop-filter: blur(10px); }
.discovery-card::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none; box-shadow: inset 0 1px rgba(255,255,255,.85); }
.discovery-card-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 18px; }
.mini-label { color: #858ea0; font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.discovery-card h2 { margin: 4px 0 0; font-size: 21px; letter-spacing: -.035em; }
.live-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; color: #187f5c; background: #e9f8f2; border-radius: 999px; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.live-pill span { width: 6px; height: 6px; background: #31b883; border-radius: 50%; box-shadow: 0 0 0 3px rgba(49, 184, 131, .12); }
.pulse-list { display: grid; gap: 10px; }
.pulse-row { display: grid; grid-template-columns: 45px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px; border: 1px solid #eceef4; border-radius: 13px; background: #fff; }
.pulse-logo { width: 45px; height: 45px; display: grid; place-items: center; color: #fff; border-radius: 12px; font-size: 13px; font-weight: 900; letter-spacing: -.03em; }
.pulse-logo.art-fivem { background: linear-gradient(145deg, #272b62, #7566ff); }.pulse-logo.art-redm { background: linear-gradient(145deg, #4a2c20, #c0814f); }.pulse-logo.art-minecraft { background: linear-gradient(145deg, #184536, #56a975); }.pulse-logo.art-roblox { background: linear-gradient(145deg, #293e68, #55abd7); }.pulse-logo.art-gmod { background: linear-gradient(145deg, #282f45, #6884b2); }.pulse-logo.art-ets2 { background: linear-gradient(145deg, #2c455d, #d4943f); }
.pulse-info { min-width: 0; }
.pulse-info strong, .pulse-info small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pulse-info strong { font-size: 11px; }
.pulse-info small { margin-top: 2px; color: #929aaa; font-size: 9px; }
.pulse-player { display: flex; align-items: center; gap: 5px; color: #566075; font-size: 9px; font-weight: 800; }
.pulse-player::before { content: ""; width: 6px; height: 6px; background: #2dba80; border-radius: 50%; }
.skeleton-row { min-height: 66px; background: linear-gradient(90deg, #f7f8fa 20%, #eef0f5 50%, #f7f8fa 80%); background-size: 220% 100%; animation: shimmer 1.6s infinite; }
.text-link { display: flex; justify-content: center; gap: 8px; margin-top: 17px; color: var(--primary); font-size: 10px; font-weight: 800; }
.floating-chip { position: absolute; z-index: 5; display: flex; align-items: center; gap: 7px; padding: 9px 12px; background: rgba(255,255,255,.94); border: 1px solid #e5e7ef; border-radius: 999px; box-shadow: var(--shadow-md); color: #4f596b; font-size: 10px; font-weight: 750; }
.chip-verified { top: 44px; right: -16px; }
.chip-verified span { display: grid; place-items: center; width: 18px; height: 18px; color: #fff; background: var(--primary); border-radius: 50%; font-size: 9px; }
.chip-online { bottom: 85px; left: -28px; }
.chip-online span { width: 7px; height: 7px; background: #2cb77e; border-radius: 50%; box-shadow: 0 0 0 4px #e6f8f1; }
.mini-stat-card { position: absolute; z-index: 5; right: -18px; bottom: 18px; width: 225px; display: grid; grid-template-columns: 32px 1fr 65px; align-items: center; gap: 9px; padding: 12px; background: rgba(255,255,255,.96); border: 1px solid #e8eaf0; border-radius: 14px; box-shadow: var(--shadow-md); }
.mini-stat-icon { width: 30px; height: 30px; display: grid; place-items: center; color: var(--primary); background: var(--primary-pale); border-radius: 9px; font-weight: 900; }
.mini-stat-card span, .mini-stat-card small { display: block; }
.mini-stat-card span { font-size: 13px; font-weight: 850; }
.mini-stat-card small { color: #939aaa; font-size: 8px; }
.mini-bars { height: 27px; display: flex; align-items: end; gap: 3px; }
.mini-bars i { flex: 1; border-radius: 3px 3px 1px 1px; background: linear-gradient(#8b81ff, #6557f5); }
.mini-bars i:nth-child(1) { height: 40%; }.mini-bars i:nth-child(2) { height: 65%; }.mini-bars i:nth-child(3) { height: 54%; }.mini-bars i:nth-child(4) { height: 88%; }.mini-bars i:nth-child(5) { height: 76%; }

.platform-band { padding: 27px 0 31px; border-bottom: 1px solid #eceef4; background: #fff; }
.band-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 17px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; }
.band-heading > span { color: #7b8496; }
.band-heading a { color: var(--primary); letter-spacing: 0; text-transform: none; }
.platform-list { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.platform-pill { min-width: 0; display: flex; align-items: center; gap: 10px; padding: 11px; text-align: left; border: 1px solid #e7e9ef; border-radius: 13px; background: #fff; cursor: pointer; transition: border-color .18s, box-shadow .18s, transform .18s; }
.platform-pill:hover { transform: translateY(-1px); border-color: #d7d9e8; box-shadow: var(--shadow-sm); }
.platform-pill.active { border-color: #beb8ff; background: #f8f7ff; box-shadow: 0 0 0 2px rgba(101,87,245,.08); }
.platform-logo { flex: 0 0 auto; width: 35px; height: 35px; display: grid; place-items: center; color: #fff; border-radius: 10px; font-size: 10px; font-weight: 900; }
.platform-all { background: linear-gradient(145deg, #7467ff, #5144da); }
.platform-fivem { background: #4e49bd; }.platform-redm { background: #9c5e35; }.platform-minecraft { background: #33825a; }.platform-roblox { background: #d6515a; }.platform-gmod { background: #3971c4; }.platform-ets2 { background: #b87325; }
.platform-pill > span:last-child { min-width: 0; }
.platform-pill strong, .platform-pill small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.platform-pill strong { font-size: 11px; }
.platform-pill small { margin-top: 1px; color: #979eac; font-size: 8px; }

.section { padding: 104px 0; }
.discover-section { background: var(--surface-soft); border-bottom: 1px solid #eceef4; }
.section-heading h2 { margin: 7px 0 8px; font-size: clamp(34px, 4vw, 46px); line-height: 1.08; letter-spacing: -.052em; }
.section-heading p { max-width: 650px; margin-bottom: 0; color: var(--muted); }
.discover-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 38px; }
.boost-balance { min-width: 150px; display: flex; align-items: center; gap: 10px; padding: 11px 14px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); }
.boost-gem { width: 34px; height: 34px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, #887cff, #5d4de9); border-radius: 11px 11px 11px 4px; }
.boost-balance strong, .boost-balance small { display: block; }
.boost-balance strong { font-size: 15px; }.boost-balance small { color: #8d95a4; font-size: 9px; }
.directory-grid { display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: 28px; align-items: start; }
.filters-panel { position: sticky; top: 96px; padding: 20px; background: #fff; border: 1px solid var(--line); border-radius: 17px; box-shadow: var(--shadow-sm); }
.filters-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 15px; border-bottom: 1px solid #eef0f4; }
.filters-head strong { font-size: 13px; }.filters-head button { padding: 0; border: 0; background: none; color: var(--primary); font-size: 10px; font-weight: 750; cursor: pointer; }
.filter-group { margin: 18px 0 0; padding: 0; border: 0; }
.filter-group > label, .filter-group legend { display: block; margin-bottom: 7px; color: #596376; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.filter-group select, .filter-group input, .tool-form select, .tool-form input, .listing-step select, .listing-step input, .listing-step textarea {
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  color: var(--ink);
  border: 1px solid #dfe2eb;
  border-radius: 10px;
  background: #fff;
  outline: none;
  transition: border-color .18s, box-shadow .18s;
}
.filter-group select:focus, .filter-group input:focus, .tool-form select:focus, .tool-form input:focus, .listing-step select:focus, .listing-step input:focus, .listing-step textarea:focus { border-color: #9c93ff; box-shadow: 0 0 0 3px rgba(101,87,245,.09); }
.small-search { position: relative; }
.small-search .search-icon { position: absolute; z-index: 1; top: 13px; left: 12px; width: 13px; height: 13px; border-width: 1.5px; }
.small-search input { padding-left: 34px; font-size: 11px; }
.check-group { display: grid; gap: 8px; }
.check-group legend { margin-bottom: 8px; }
.check-group label, .agree-row { position: relative; display: grid; grid-template-columns: 17px 1fr; align-items: center; gap: 8px; margin: 0; padding: 6px 0; cursor: pointer; text-transform: none; letter-spacing: 0; }
.check-group input, .agree-row input { position: absolute; opacity: 0; pointer-events: none; }
.custom-check { grid-row: span 2; width: 16px; height: 16px; border: 1.5px solid #cdd1dc; border-radius: 5px; background: #fff; transition: background .15s, border-color .15s; }
.check-group label > span:nth-of-type(2) { color: #3d475a; font-size: 11px; font-weight: 650; }
.check-group label small { grid-column: 2; margin-top: -6px; color: #9ba2b0; font-size: 8px; }
.check-group input:checked + .custom-check, .agree-row input:checked + .custom-check { background: var(--primary); border-color: var(--primary); box-shadow: inset 0 0 0 3px #fff; }
.check-group input:focus-visible + .custom-check, .agree-row input:focus-visible + .custom-check { outline: 3px solid rgba(101,87,245,.2); outline-offset: 2px; }
.filter-note { display: flex; gap: 9px; margin-top: 20px; padding: 11px; background: #f5f4ff; border: 1px solid #e5e2ff; border-radius: 10px; }
.filter-note > span { flex: 0 0 auto; width: 17px; height: 17px; display: grid; place-items: center; color: #fff; background: var(--primary); border-radius: 50%; font-family: Georgia, serif; font-size: 10px; }
.filter-note p { margin: 0; color: #76729d; font-size: 8px; line-height: 1.5; }.filter-note strong { display: block; color: #4e497c; font-size: 9px; }
.results-toolbar { min-height: 40px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; color: #8991a0; font-size: 10px; }
.results-toolbar p { margin: 0; }.results-toolbar p strong { color: var(--ink); font-size: 11px; }
.results-toolbar label { display: flex; align-items: center; gap: 7px; }
.results-toolbar select { border: 0; background: transparent; color: #4b5568; font-size: 10px; font-weight: 700; cursor: pointer; }
.server-list { display: grid; gap: 13px; }
.server-card { position: relative; display: grid; grid-template-columns: 104px minmax(0, 1fr) 138px; gap: 18px; min-height: 146px; padding: 17px; background: #fff; border: 1px solid #e5e7ee; border-radius: 17px; box-shadow: 0 6px 20px rgba(38,45,74,.045); transition: transform .2s, border-color .2s, box-shadow .2s; overflow: hidden; }
.server-card:hover { transform: translateY(-2px); border-color: #d8d8ef; box-shadow: 0 14px 34px rgba(40,46,78,.09); }
.server-card.hot { border-color: #d5d0ff; box-shadow: 0 10px 30px rgba(93,77,233,.09); }
.server-card.hot::before { content: ""; position: absolute; left: 0; top: 15px; bottom: 15px; width: 3px; border-radius: 0 3px 3px 0; background: linear-gradient(#8f83ff, #5c4fe8); }
.server-art { position: relative; min-height: 110px; display: grid; place-items: center; border-radius: 13px; overflow: hidden; isolation: isolate; }
.server-art::before { content: ""; position: absolute; inset: -20%; z-index: -1; background: radial-gradient(circle at 70% 25%, rgba(255,255,255,.35), transparent 25%), linear-gradient(145deg, var(--art-a), var(--art-b)); transform: rotate(-8deg); }
.server-art::after { content: ""; position: absolute; width: 95px; height: 95px; right: -45px; bottom: -42px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; box-shadow: 0 0 0 18px rgba(255,255,255,.06); }
.art-fivem { --art-a: #272b62; --art-b: #7566ff; }.art-redm { --art-a: #4a2c20; --art-b: #c0814f; }.art-minecraft { --art-a: #184536; --art-b: #56a975; }.art-roblox { --art-a: #293e68; --art-b: #55abd7; }.art-gmod { --art-a: #282f45; --art-b: #6884b2; }.art-ets2 { --art-a: #2c455d; --art-b: #d4943f; }
.server-initials { width: 51px; height: 51px; display: grid; place-items: center; color: #fff; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.35); border-radius: 15px; box-shadow: inset 0 1px rgba(255,255,255,.2), 0 10px 20px rgba(0,0,0,.14); backdrop-filter: blur(5px); font-size: 15px; font-weight: 900; letter-spacing: -.05em; }
.art-status { position: absolute; left: 8px; bottom: 8px; display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; color: #fff; background: rgba(18,25,42,.74); border-radius: 999px; backdrop-filter: blur(5px); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.art-status i { width: 5px; height: 5px; border-radius: 50%; background: #46d396; }.art-status.offline i { background: #b6bdc9; }
.server-main { min-width: 0; align-self: center; }
.server-meta { display: flex; align-items: center; gap: 7px; margin-bottom: 5px; }
.server-platform { color: #7a8292; font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.verified-badge { width: 15px; height: 15px; display: inline-grid; place-items: center; color: #fff; background: var(--primary); border-radius: 50%; font-size: 8px; font-weight: 900; }
.hot-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px; color: #7954d8; background: #eeeaff; border-radius: 999px; font-size: 7px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.server-main h3 { margin: 0 0 5px; font-size: 17px; line-height: 1.2; letter-spacing: -.03em; }
.server-main > p { display: -webkit-box; overflow: hidden; max-width: 570px; margin: 0 0 10px; color: #778092; font-size: 10px; line-height: 1.5; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.server-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.server-tags span { padding: 4px 7px; color: #626c7e; background: #f4f5f8; border: 1px solid #eceef3; border-radius: 6px; font-size: 7px; font-weight: 700; }
.server-side { display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 8px; padding-left: 16px; border-left: 1px solid #eef0f4; }
.player-count { display: flex; align-items: end; justify-content: space-between; gap: 8px; }
.player-count > span:first-child { font-size: 18px; line-height: 1; font-weight: 850; letter-spacing: -.04em; }.player-count small { color: #969dac; font-size: 8px; font-weight: 500; }
.player-state { display: inline-flex; align-items: center; gap: 4px; color: #23855f; font-size: 7px; font-weight: 800; text-transform: uppercase; }.player-state i { width: 5px; height: 5px; background: #29b679; border-radius: 50%; }.player-state.offline { color: #8f96a5; }.player-state.offline i { background: #aeb4c0; }
.capacity-bar { height: 4px; background: #edf0f3; border-radius: 99px; overflow: hidden; }.capacity-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7f73ff, #584ce2); }
.capacity-bar .fill-0 { width: 0; }.capacity-bar .fill-10 { width: 10%; }.capacity-bar .fill-20 { width: 20%; }.capacity-bar .fill-30 { width: 30%; }.capacity-bar .fill-40 { width: 40%; }.capacity-bar .fill-50 { width: 50%; }.capacity-bar .fill-60 { width: 60%; }.capacity-bar .fill-70 { width: 70%; }.capacity-bar .fill-80 { width: 80%; }.capacity-bar .fill-90 { width: 90%; }.capacity-bar .fill-100 { width: 100%; }
.server-actions { display: grid; grid-template-columns: 1fr 35px; gap: 6px; }
.server-actions .button { min-height: 35px; padding: 7px 8px; font-size: 9px; }
.favorite-button { min-height: 35px; display: grid; place-items: center; border: 1px solid #e2e5ec; border-radius: 9px; background: #fff; color: #7c8494; cursor: pointer; font-size: 16px; line-height: 1; }.favorite-button.active { color: #e55a78; background: #fff2f6; border-color: #ffd5e0; }
.boost-button { width: 100%; min-height: 28px; border: 0; background: #f5f3ff; color: #6758d9; border-radius: 8px; cursor: pointer; font-size: 8px; font-weight: 800; }.boost-button:disabled { cursor: not-allowed; opacity: .55; }
.server-skeleton { min-height: 146px; background: linear-gradient(90deg, #fff 20%, #f3f4f7 48%, #fff 78%); background-size: 230% 100%; animation: shimmer 1.5s infinite; }
.load-more { display: flex; margin: 18px auto 0; }
.empty-state { padding: 65px 20px; text-align: center; background: #fff; border: 1px dashed #d8dce7; border-radius: 17px; }
.empty-state > span { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 12px; color: var(--primary); background: var(--primary-pale); border-radius: 15px; font-size: 24px; }.empty-state h3 { margin-bottom: 4px; }.empty-state p { color: var(--muted); font-size: 12px; }.empty-state .button { margin-top: 8px; }
.mobile-filter-row { display: none; }

.category-section { background: #fff; }
.row-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 38px; }
.row-heading .button { flex: 0 0 auto; }
.category-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 13px; }
.category-card { position: relative; min-height: 144px; padding: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--category-bg, #f8f8fb); cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s; }
.category-card:hover { transform: translateY(-3px); border-color: #d5d5e6; box-shadow: var(--shadow-md); }
.category-card::after { content: ""; position: absolute; width: 85px; height: 85px; right: -32px; bottom: -30px; border: 18px solid var(--category-ring, rgba(101,87,245,.08)); border-radius: 50%; }
.category-style-0 { --category-bg: #f6f3ff; --category-color: #6c5be6; --category-icon: #e9e5ff; --category-ring: rgba(108,91,230,.08); }
.category-style-1 { --category-bg: #f1faf6; --category-color: #23845f; --category-icon: #def2e9; --category-ring: rgba(35,132,95,.08); }
.category-style-2 { --category-bg: #f2f7fd; --category-color: #3d76b7; --category-icon: #dceafb; --category-ring: rgba(61,118,183,.08); }
.category-style-3 { --category-bg: #fff8f0; --category-color: #bc6e2a; --category-icon: #fde8d2; --category-ring: rgba(188,110,42,.08); }
.category-style-4 { --category-bg: #fff4f6; --category-color: #c9556d; --category-icon: #fadce3; --category-ring: rgba(201,85,109,.08); }
.category-icon { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 19px; color: var(--category-color, var(--primary)); background: var(--category-icon, #ebe9ff); border-radius: 11px; font-weight: 900; }
.category-card strong, .category-card small { position: relative; z-index: 1; display: block; }.category-card strong { font-size: 13px; }.category-card small { margin-top: 2px; color: #8c94a3; font-size: 9px; }

.promotion { position: relative; min-height: 190px; display: grid; grid-template-columns: 80px minmax(0, 1fr) auto; align-items: center; gap: 28px; padding: 38px 52px; overflow: hidden; color: #fff; background: linear-gradient(125deg, #5749dd, #7569f7 60%, #927dfd); border-radius: 24px; box-shadow: 0 22px 55px rgba(85, 69, 215, .25); }
.promotion::before, .promotion::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.promotion::before { width: 390px; height: 390px; right: -80px; top: -205px; }.promotion::after { width: 210px; height: 210px; right: 105px; bottom: -135px; }
.promo-mark { position: relative; z-index: 2; width: 72px; height: 72px; display: grid; place-items: center; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); border-radius: 22px 22px 22px 8px; box-shadow: inset 0 1px rgba(255,255,255,.18); font-size: 28px; font-weight: 900; transform: rotate(-4deg); }
.promo-mark span { transform: rotate(4deg); }.promotion > div:nth-child(2) { position: relative; z-index: 2; }.promotion .mini-label { color: #d9d5ff; }.promotion h2 { margin: 6px 0 3px; font-size: 26px; letter-spacing: -.035em; }.promotion p { margin: 0; color: #dedbff; font-size: 12px; }.promotion .button { position: relative; z-index: 2; }

.credits-section { background: linear-gradient(180deg, #fff, #f8f8fd); }
.credit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; max-width: 930px; margin: 0 auto; }
.credit-card { display: flex; flex-direction: column; min-height: 305px; padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: 19px; box-shadow: var(--shadow-sm); }
.credit-card.featured { border-color: #cfcaff; box-shadow: 0 22px 55px rgba(101,87,245,.13); transform: translateY(-8px); }
.credit-card > span { color: var(--primary); font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.credit-card h3 { margin: 18px 0 7px; font-size: 26px; letter-spacing: -.045em; }
.credit-card p { min-height: 48px; color: var(--muted); font-size: 11px; }
.credit-card strong { display: block; margin: auto 0 17px; font-size: 30px; letter-spacing: -.04em; }
.purchase-confirm { max-width: 760px; display: grid; grid-template-columns: 18px 1fr; align-items: start; gap: 10px; margin: 26px auto 0; color: #5d6679; font-size: 11px; cursor: pointer; }
.purchase-confirm input { position: absolute; opacity: 0; pointer-events: none; }
.purchase-confirm .custom-check { width: 18px; height: 18px; display: grid; place-items: center; background: #fff; border: 1px solid var(--line-strong); border-radius: 5px; }
.purchase-confirm input:checked + .custom-check { color: #fff; background: var(--primary); border-color: var(--primary); }
.purchase-confirm input:checked + .custom-check::after { content: "✓"; font-size: 10px; font-weight: 900; }
.purchase-confirm input:focus-visible + .custom-check { outline: 3px solid rgba(101,87,245,.24); outline-offset: 2px; }
.credit-note { max-width: 760px; margin: 12px auto 0; color: #8a92a2; font-size: 10px; text-align: center; }

.tools-section { margin-top: 104px; background: #f6f7fb; border-top: 1px solid #ebeef3; border-bottom: 1px solid #ebeef3; }
.centered-heading { max-width: 760px; margin: 0 auto 45px; text-align: center; }.centered-heading p { margin-inline: auto; }
.tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.tool-card { padding: 28px; background: #fff; border: 1px solid #e4e7ee; border-radius: 19px; box-shadow: var(--shadow-sm); }
.tool-featured { grid-row: span 2; }
.tool-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.tool-icon { width: 43px; height: 43px; display: inline-grid; place-items: center; border-radius: 13px; font-size: 14px; font-weight: 900; }.tool-icon-purple { color: #695ae5; background: #eeecff; }.tool-icon-blue { color: #3676bc; background: #e9f2fd; }.tool-icon-green { color: #25845f; background: #e8f7f1; }.tool-icon-orange { color: #ba6d29; background: #fff0e3; }
.tool-status { padding: 5px 8px; color: #6c62b8; background: #f1efff; border-radius: 999px; font-size: 8px; font-weight: 850; letter-spacing: .08em; }
.tool-card h3 { margin: 0 0 7px; font-size: 21px; letter-spacing: -.035em; }.tool-card > p { color: var(--muted); font-size: 11px; }
.tool-form { display: grid; gap: 12px; margin-top: 22px; }.tool-form label, .listing-step > label { display: grid; gap: 6px; color: #566074; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }.two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.tool-form select, .tool-form input { font-size: 11px; text-transform: none; letter-spacing: 0; }
.name-results { display: grid; gap: 6px; margin: 17px 0 0; padding: 0; list-style: none; counter-reset: names; }.name-results li { display: flex; align-items: center; justify-content: space-between; min-height: 37px; padding: 7px 10px; background: #f8f8fc; border: 1px solid #eef0f5; border-radius: 9px; color: #485267; font-size: 10px; }.name-results button { border: 0; background: transparent; color: var(--primary); font-size: 9px; font-weight: 800; cursor: pointer; }
.hash-input-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }.hash-input-row .button { min-height: 42px; }
.hash-results { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 17px; }.hash-results div { min-width: 0; padding: 10px; background: #f7f8fb; border: 1px solid #eceef3; border-radius: 9px; }.hash-results span, .hash-results strong { display: block; overflow: hidden; text-overflow: ellipsis; }.hash-results span { color: #9299a8; font-size: 8px; }.hash-results strong { margin-top: 2px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; }
.compact-tool-card { display: flex; flex-direction: column; }.compact-tool-card > div:first-child { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }.compact-tool-card .button { margin-top: auto; }.status-dot { color: #8b93a2; font-size: 8px; font-weight: 850; letter-spacing: .07em; }.status-dot i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; background: #30b67e; border-radius: 50%; }

.staff-section { color: #fff; background: #161a2b; overflow: hidden; }
.staff-grid { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: 70px; }
.staff-copy .section-kicker { color: #9f96ff; }.staff-copy h2 { margin: 9px 0 17px; font-size: clamp(36px, 4vw, 51px); line-height: 1.08; letter-spacing: -.055em; }.staff-copy > p { color: #9fa6b8; }
.feature-list { display: grid; gap: 18px; margin: 28px 0 32px; padding: 0; list-style: none; }.feature-list li { display: flex; gap: 12px; }.feature-list li > span { flex: 0 0 auto; width: 24px; height: 24px; display: grid; place-items: center; color: #70e0b5; background: rgba(75,208,157,.12); border-radius: 7px; font-size: 10px; font-weight: 900; }.feature-list strong, .feature-list small { display: block; }.feature-list strong { font-size: 12px; }.feature-list small { max-width: 390px; margin-top: 3px; color: #8e96aa; font-size: 10px; }
.staff-copy .button-dark { background: #fff; color: #24293d; }
.admin-preview { display: grid; grid-template-columns: 54px 1fr; min-height: 430px; overflow: hidden; color: var(--ink); background: #f7f8fb; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; box-shadow: 0 30px 80px rgba(0,0,0,.3); transform: perspective(1400px) rotateY(-2deg) rotateX(1deg); }
.admin-side { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 14px 8px; background: #20263a; }.admin-logo { width: 31px; height: 31px; display: grid; place-items: center; margin-bottom: 15px; color: #fff; background: var(--primary); border-radius: 10px 10px 10px 4px; font-size: 12px; font-weight: 900; }.admin-side button { width: 32px; height: 32px; border: 0; border-radius: 9px; color: #818a9e; background: transparent; cursor: pointer; }.admin-side button.selected { color: #fff; background: #6860e9; }.admin-side > span { flex: 1; }
.admin-content { min-width: 0; padding: 25px; }.admin-top { display: flex; justify-content: space-between; align-items: center; }.admin-top small { color: #9199a8; font-size: 7px; font-weight: 850; letter-spacing: .11em; }.admin-top h3 { margin: 2px 0 0; font-size: 17px; }.admin-avatar { width: 31px; height: 31px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg,#685de9,#9b74ce); border-radius: 9px; font-size: 8px; font-weight: 850; }
.admin-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 22px; }.admin-metrics > div { padding: 13px; background: #fff; border: 1px solid #e8eaf0; border-radius: 10px; }.admin-metrics span, .admin-metrics strong, .admin-metrics small { display: block; }.admin-metrics span { color: #8f97a7; font-size: 7px; }.admin-metrics strong { margin: 3px 0 2px; font-size: 18px; }.admin-metrics small { color: #9ca3b1; font-size: 6px; }.admin-metrics small.positive { color: #2b9c71; }
.admin-lower { display: grid; grid-template-columns: 1.45fr .8fr; gap: 9px; margin-top: 9px; }.activity-chart, .security-card { min-width: 0; padding: 13px; background: #fff; border: 1px solid #e8eaf0; border-radius: 10px; }.activity-chart > div:first-child { display: flex; justify-content: space-between; }.activity-chart strong { font-size: 8px; }.activity-chart span { color: #999fad; font-size: 6px; }
.chart-bars { height: 84px; display: flex; align-items: end; gap: 7px; padding-top: 10px; border-bottom: 1px solid #eff0f4; }.chart-bars i { flex: 1; border-radius: 3px 3px 0 0; background: linear-gradient(#8c83f7,#665ce0); }.chart-bars i:nth-child(1){height:30%}.chart-bars i:nth-child(2){height:48%}.chart-bars i:nth-child(3){height:42%}.chart-bars i:nth-child(4){height:68%}.chart-bars i:nth-child(5){height:55%}.chart-bars i:nth-child(6){height:82%}.chart-bars i:nth-child(7){height:73%}
.security-card > div:first-child { display: flex; gap: 8px; align-items: center; }.security-icon { width: 25px; height: 25px; display: grid; place-items:center; color:#29936b; background:#e7f7f1; border-radius:8px; font-size:9px; }.security-card strong,.security-card small { display:block; }.security-card strong{font-size:8px}.security-card small{color:#9aa1af;font-size:6px}.masked-row { margin-top: 24px; padding-top: 10px; border-top: 1px solid #eef0f4; }.masked-row span,.masked-row strong{display:block}.masked-row span{color:#929aa9;font-size:6px}.masked-row strong{margin-top:4px;letter-spacing:.08em;font-size:10px}
.audit-preview { display: grid; grid-template-columns: 7px 1fr auto; align-items: center; gap: 8px; margin-top: 9px; padding: 10px 12px; background: #fff; border: 1px solid #e8eaf0; border-radius: 10px; }.audit-dot { width: 6px; height: 6px; background:#56c99d; border-radius:50%; box-shadow:0 0 0 3px #e9f8f2}.audit-preview p{margin:0}.audit-preview strong,.audit-preview small{display:block}.audit-preview strong{font-size:8px}.audit-preview small,.audit-preview time{color:#969daa;font-size:6px}

.foundation-section { background: #fff; }.narrow-heading { max-width: 720px; }.foundation-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }.foundation-grid article { padding: 25px; border: 1px solid var(--line); border-radius: 17px; background: linear-gradient(150deg,#fff,#fafafe); }.foundation-number { display: inline-block; margin-bottom: 31px; color: var(--primary); font-family: ui-monospace,monospace; font-size: 10px; font-weight: 850; }.foundation-grid h3{margin-bottom:7px;font-size:16px}.foundation-grid p{margin:0;color:var(--muted);font-size:10px;line-height:1.65}

.site-footer { padding: 67px 0 23px; color: #adb3c2; background: #121625; }.footer-grid { display: grid; grid-template-columns: 1.7fr repeat(3,1fr); gap: 55px; padding-bottom: 48px; }.brand-light { color:#fff}.footer-brand p { max-width:300px; margin:17px 0;color:#858da0;font-size:11px}.build-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid #2b3143;border-radius:999px;font-size:8px;font-weight:750}.build-badge i{width:6px;height:6px;background:#58d0a2;border-radius:50%}.footer-grid h2{margin:4px 0 15px;color:#fff;font-size:11px}.footer-grid > div:not(:first-child){display:flex;flex-direction:column;align-items:flex-start;gap:9px}.footer-grid a,.footer-grid button{padding:0;border:0;background:none;color:#8991a3;font-size:10px;cursor:pointer}.footer-grid a:hover,.footer-grid button:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:20px;border-top:1px solid #272c3d;font-size:8px}.footer-bottom div{display:flex;gap:18px}

.modal { width: min(calc(100% - 30px), 510px); padding: 0; border: 0; border-radius: 23px; box-shadow: 0 30px 100px rgba(20,26,50,.35); }.modal::backdrop { background: rgba(18,22,38,.67); backdrop-filter: blur(5px); }.modal-shell { position: relative; padding: 38px; }.dialog-close { position: absolute; top: 15px; right: 15px; width: 34px; height: 34px; display:grid;place-items:center;border:0;border-radius:10px;background:#f3f4f7;color:#6f7889;font-size:20px;cursor:pointer}.dialog-mark{margin-bottom:25px}.modal h2{margin:8px 0 10px;font-size:29px;line-height:1.12;letter-spacing:-.045em}.modal p{color:var(--muted);font-size:11px}.discord-button{margin-top:22px;background:#5865f2;color:#fff}.dialog-note{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:13px;color:#8c94a3;font-size:8px}.dialog-note span{color:var(--green)}
.listing-modal { width: min(calc(100% - 30px), 650px); }.listing-shell{min-height:540px}.listing-progress{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:37px}.listing-progress span{height:4px;background:#e9ebf1;border-radius:99px}.listing-progress span.active{background:var(--primary)}.listing-progress small{position:absolute;top:10px;right:0;color:#8d95a5;font-size:8px}.listing-step{display:none}.listing-step.active{display:block}.listing-step h2{margin-bottom:7px}.listing-step > p{margin-bottom:25px}.listing-step > label{margin-top:14px}.listing-step label > span{font-weight:500;text-transform:none}.listing-step textarea{min-height:130px;resize:vertical;text-transform:none;letter-spacing:0;font-size:11px}.listing-step label small{color:#9aa1af;font-size:8px;font-weight:500;text-transform:none;letter-spacing:0}.listing-step > .full-button{margin-top:24px}.listing-buttons{display:flex;justify-content:space-between;gap:10px;margin-top:27px}.listing-buttons .button{min-width:100px}.submission-preview{display:grid;gap:10px;margin:20px 0;padding:17px;background:#f7f7fb;border:1px solid #e9ebf1;border-radius:13px}.submission-preview div{display:grid;grid-template-columns:100px 1fr;gap:12px}.submission-preview span{color:#9098a7;font-size:8px;text-transform:uppercase;letter-spacing:.05em}.submission-preview strong{font-size:10px}.agree-row{grid-template-columns:17px 1fr!important;margin-top:17px!important;color:#5f687a!important;font-size:9px!important;font-weight:600!important;text-transform:none!important;letter-spacing:0!important}.listing-success{text-align:center;padding-top:65px}.success-check{width:62px;height:62px;display:grid;place-items:center;margin:0 auto 20px;color:#fff;background:linear-gradient(145deg,#35b987,#208b65);border-radius:20px;font-size:28px;box-shadow:0 15px 30px rgba(35,157,111,.22)}.listing-success strong{display:block;margin:18px 0;padding:10px;background:#f4f5f8;border-radius:9px;color:#5c6578;font-family:ui-monospace,monospace;font-size:10px}
.toast { position: fixed; z-index: 300; left: 50%; bottom: 25px; width: min(calc(100% - 32px), 410px); display: flex; align-items: center; gap: 10px; padding: 12px 14px; color: #fff; background: #171c2e; border: 1px solid #31384b; border-radius: 12px; box-shadow: 0 18px 50px rgba(17,22,38,.3); opacity: 0; transform: translate(-50%, 20px); pointer-events:none;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast>span{width:22px;height:22px;display:grid;place-items:center;color:#61d5a7;background:rgba(97,213,167,.12);border-radius:7px;font-size:9px}.toast p{margin:0;font-size:10px}

@keyframes shimmer { to { background-position: -120% 0; } }

@media (max-width: 1100px) {
  .primary-nav { gap: 18px; }.nav-wrap { gap: 24px; }
  .hero-grid { grid-template-columns: 1fr 420px; gap: 35px; }
  .chip-verified { right: 0; }.chip-online { left: 0; }.mini-stat-card { right: 0; }
  .platform-list { grid-template-columns: repeat(4,1fr); }
  .category-grid { grid-template-columns: repeat(3,1fr); }
  .staff-grid { gap: 40px; }.admin-content { padding: 20px; }
}

@media (max-width: 900px) {
  .announcement-inner { justify-content: space-between; }
  .menu-button { display: block; }
  .nav-wrap { min-height: 66px; }
  .primary-nav { position: absolute; left: 20px; right: 20px; top: calc(100% + 8px); display: none; flex-direction: column; align-items: stretch; gap: 3px; padding: 12px; background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg)}
  .primary-nav.open { display:flex }.primary-nav a{padding:10px;border-radius:8px}.primary-nav a:hover{background:#f5f6fa}
  .nav-actions .button-ghost { display:none }.nav-actions .button-primary{min-height:38px;padding-inline:12px}
  .hero-grid { grid-template-columns:1fr;gap:55px;padding-top:75px }.hero-copy{text-align:center}.hero h1,.hero-lead,.hero-search{margin-left:auto;margin-right:auto}.popular-searches,.trust-row{justify-content:center}.hero-visual{width:min(100%,600px);margin-inline:auto}.hero{min-height:auto}
  .directory-grid{grid-template-columns:1fr}.filters-panel{position:static;display:none;grid-template-columns:repeat(2,1fr);gap:0 16px;margin-bottom:12px}.filters-panel.open{display:grid}.filters-head,.filter-note{grid-column:1/-1}.mobile-filter-row{display:flex;justify-content:space-between;gap:10px;margin-bottom:14px}.mobile-filter-row .button span{min-width:18px;display:grid;place-items:center;padding:3px;background:#eff0f5;border-radius:99px;font-size:8px}.compact-sort select{height:42px;padding:0 11px;border:1px solid var(--line-strong);border-radius:11px;background:#fff;font-size:10px}
  .results-toolbar label{display:none}.server-card{grid-template-columns:95px minmax(0,1fr) 125px}
  .promotion{grid-template-columns:65px 1fr;padding:34px}.promotion .button{grid-column:2;justify-self:start}
  .credit-grid{grid-template-columns:1fr;max-width:520px}.credit-card{min-height:230px}.credit-card.featured{transform:none}
  .staff-grid{grid-template-columns:1fr}.staff-copy{text-align:center}.feature-list{width:min(100%,560px);margin-inline:auto;text-align:left}.admin-preview{width:min(100%,650px);margin-inline:auto;transform:none}
  .foundation-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1.5fr repeat(3,1fr);gap:25px}
}

@media (max-width: 680px) {
  .shell{width:min(calc(100% - 28px),var(--shell))}.announcement-inner{height:32px}.announcement a{display:none}
  .nav-actions .button-primary{display:none}.brand{margin-right:auto}.menu-button{margin-left:0}
  .hero-grid{padding-top:60px;padding-bottom:75px}.hero h1{font-size:52px}.hero-lead{font-size:15px}.hero-search{min-height:55px;padding-left:15px}.hero-search .button{min-height:43px;padding-inline:14px}.popular-searches{display:none}.trust-row{gap:13px;margin-top:28px}.trust-row>div+div{padding-left:13px}.trust-row small{display:none}.trust-row strong{font-size:9px}.trust-icon{width:26px;height:26px}.hero-visual{min-height:420px}.hero-visual::before{width:340px;height:340px}.orbit-one{width:420px;height:420px}.orbit-two{width:280px;height:280px}.discovery-card{width:min(100%,365px);padding:20px}.floating-chip{display:none}.mini-stat-card{right:8px;bottom:5px}.pulse-row{grid-template-columns:40px minmax(0,1fr) auto}.pulse-logo{width:40px;height:40px}
  .platform-band{padding-block:23px}.platform-list{display:flex;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none}.platform-list::-webkit-scrollbar{display:none}.platform-pill{flex:0 0 137px}.platform-pill.active{flex-basis:145px}
  .section{padding:76px 0}.section-heading h2{font-size:35px}.discover-heading{align-items:flex-start}.boost-balance{min-width:auto;padding:9px}.boost-balance small{display:none}.boost-gem{width:30px;height:30px}
  .filters-panel.open{display:block}.filter-note{display:flex}.server-card{grid-template-columns:78px minmax(0,1fr);gap:13px;min-height:0;padding:13px}.server-art{min-height:86px}.server-initials{width:44px;height:44px}.server-main h3{font-size:15px}.server-main>p{font-size:9px}.server-tags span:nth-child(n+3){display:none}.server-side{grid-column:1/-1;display:grid;grid-template-columns:1fr 130px;align-items:center;padding:11px 0 0;border-left:0;border-top:1px solid #eef0f4}.server-actions{grid-column:2;grid-row:1/3}.boost-button{grid-column:1;grid-row:2;width:max-content;padding-inline:10px}.player-count{justify-content:flex-start}.capacity-bar{width:100%}
  .row-heading{align-items:flex-start}.row-heading .button{display:none}.category-grid{grid-template-columns:repeat(2,1fr)}.category-card{min-height:130px}
  .promotion{width:calc(100% - 28px);grid-template-columns:1fr;text-align:center;padding:34px 24px}.promo-mark{margin-inline:auto}.promotion .button{grid-column:1;justify-self:center}.promotion h2{font-size:23px}
  .credit-card{padding:23px}.purchase-confirm{font-size:10px}
  .tools-section{margin-top:76px}.tool-grid{grid-template-columns:1fr}.tool-featured{grid-row:auto}.tool-card{padding:23px}.hash-results{grid-template-columns:1fr}.hash-results div{display:flex;justify-content:space-between;gap:10px}
  .admin-preview{grid-template-columns:43px 1fr;min-height:400px}.admin-side{padding-inline:5px}.admin-content{padding:15px}.admin-metrics{grid-template-columns:repeat(2,1fr)}.admin-metrics>div:nth-child(3){display:none}.admin-lower{grid-template-columns:1fr}.security-card{display:none}.activity-chart{padding:10px}
  .foundation-grid{grid-template-columns:1fr}.foundation-number{margin-bottom:18px}.footer-grid{grid-template-columns:repeat(2,1fr)}.footer-brand{grid-column:1/-1}.footer-bottom{align-items:flex-start;gap:14px;flex-direction:column}.footer-bottom div{flex-wrap:wrap}
  .modal-shell{padding:32px 24px}.listing-shell{min-height:530px}.two-fields{grid-template-columns:1fr}.submission-preview div{grid-template-columns:80px 1fr}
}

@media (max-width: 430px) {
  .hero h1{font-size:45px}.hero-search .search-icon{display:none}.hero-search{padding-left:10px}.hero-search input{font-size:12px}.hero-search .button{font-size:0}.hero-search .button::after{content:"Go";font-size:11px}.trust-row>div:nth-child(3){display:none}.discovery-card{padding:17px}.mini-stat-card{display:none}.hero-visual{min-height:370px}.orbit-one{width:355px;height:355px}
  .discover-heading{display:block}.boost-balance{width:max-content;margin-top:18px}.server-side{grid-template-columns:1fr 112px}.category-grid{grid-template-columns:1fr 1fr;gap:9px}.category-card{padding:14px}.category-icon{margin-bottom:13px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px 20px}
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
