.public-server-shell {
  --server-card:#101721;
  --server-line:rgba(168,198,229,.2);
  --server-cyan:#35d9ff;
  --server-green:#7fd332;
  --server-gold:#e4b34f;
  min-height:100vh;
}

.public-server-top .public-support-link.active {
  color:#fff;
  text-shadow:0 0 18px rgba(53,217,255,.38);
}

.public-server-directory,
.public-server-detail {
  position:relative;
  z-index:1;
  width:min(1760px,calc(100% - clamp(28px,5vw,92px)));
  margin:0 auto;
  padding:clamp(44px,5vw,80px) 0 72px;
}

.public-server-intro {
  width:100%;
  max-width:none;
  margin-bottom:clamp(46px,5vw,78px);
}

.public-server-eyebrow,
.public-server-section-kicker {
  display:block;
  color:#8edff4;
  font-size:12px;
  font-weight:950;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.public-server-intro h1 {
  width:100%;
  max-width:none;
  margin:13px 0 16px;
  color:#f8fbff;
  font-size:clamp(42px,5.4vw,78px);
  line-height:1;
  letter-spacing:-.04em;
  overflow-wrap:anywhere;
}

.public-server-intro p {
  width:100%;
  max-width:none;
  margin:0;
  color:#bdc8d6;
  font-size:clamp(17px,1.5vw,20px);
  line-height:1.65;
  overflow-wrap:anywhere;
}

.public-server-podium {
  margin-bottom:clamp(64px,6vw,100px);
}

.public-server-section-heading h2,
.public-server-results-head h2,
.public-server-about h2 {
  margin:7px 0 0;
  color:#f7faff;
  font-size:clamp(28px,2.7vw,42px);
  line-height:1.08;
  letter-spacing:-.025em;
}

.public-server-section-heading {
  margin-bottom:22px;
}

.public-server-podium-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2.2vw,34px);
  align-items:stretch;
  max-width:1480px;
}

.public-server-card {
  position:relative;
  min-width:0;
  overflow:visible;
  border:1px solid var(--server-line);
  border-radius:16px;
  background:linear-gradient(160deg,rgba(22,32,44,.97),rgba(11,16,24,.98));
  box-shadow:0 22px 54px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.public-server-card:hover,
.public-server-card:focus-within {
  z-index:2;
  transform:translateY(-4px);
  border-color:rgba(53,217,255,.48);
  box-shadow:0 28px 65px rgba(0,0,0,.4),0 0 32px rgba(53,217,255,.1),inset 0 1px 0 rgba(255,255,255,.09);
}

.public-server-card.is-premium:not(.is-podium) {
  border-color:rgba(228,179,79,.52);
  box-shadow:0 22px 54px rgba(0,0,0,.34),0 0 28px rgba(228,179,79,.15),inset 0 0 0 1px rgba(255,216,120,.13);
}

.public-server-card.is-premium:not(.is-podium):hover,
.public-server-card.is-premium:not(.is-podium):focus-within {
  border-color:rgba(255,212,105,.8);
  box-shadow:0 30px 70px rgba(0,0,0,.42),0 0 46px rgba(228,179,79,.28),inset 0 0 0 1px rgba(255,225,151,.22);
}

.public-server-card-link {
  position:relative;
  display:flex;
  height:100%;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border-radius:15px;
}

.public-server-card.is-premium .public-server-card-link::after {
  content:"";
  position:absolute;
  z-index:4;
  inset:3px;
  border:1px solid rgba(255,215,117,.35);
  border-radius:12px;
  pointer-events:none;
  box-shadow:inset 0 0 24px rgba(228,179,79,.1);
}

.public-server-card-cover {
  position:relative;
  flex:0 0 auto;
  aspect-ratio:4 / 1;
  overflow:hidden;
  background:radial-gradient(circle at 74% 20%,rgba(53,217,255,.3),transparent 42%),radial-gradient(circle at 20% 80%,rgba(127,211,50,.14),transparent 38%),linear-gradient(145deg,#142234,#0b111b 70%);
}

.public-server-card.is-podium .public-server-card-cover {
  aspect-ratio:4 / 1;
}

.public-server-card-cover > img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

.public-server-card-cover > img.public-server-card-fallback {
  padding:12px;
  object-fit:contain;
  opacity:.34;
  filter:drop-shadow(0 0 32px rgba(53,217,255,.42));
}

.public-server-card-cover-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(4,8,14,.1),rgba(4,7,12,.25) 40%,rgba(6,10,16,.9));
}

.public-server-rank {
  position:absolute;
  z-index:3;
  top:10px;
  left:10px;
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border:1px solid currentColor;
  border-radius:11px;
  color:#fff1b2;
  background:linear-gradient(145deg,rgba(83,59,12,.94),rgba(24,19,12,.94));
  box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 24px rgba(228,179,79,.3),inset 0 1px 0 rgba(255,255,255,.2);
}

.public-server-rank strong {
  font-size:20px;
  line-height:1;
}

.public-server-rank small {
  position:absolute;
  top:3px;
  left:5px;
  font-size:8px;
}

.public-server-card.podium-rank-1 {
  border-color:rgba(255,207,82,.78);
  box-shadow:0 25px 64px rgba(0,0,0,.38),0 0 46px rgba(228,179,79,.3),inset 0 1px 0 rgba(255,241,186,.16);
}

.public-server-card.podium-rank-2 {
  border-color:rgba(196,214,234,.66);
  box-shadow:0 25px 64px rgba(0,0,0,.38),0 0 38px rgba(173,198,226,.22),inset 0 1px 0 rgba(255,255,255,.14);
}

.public-server-card.podium-rank-2 .public-server-rank {
  color:#e8f1fb;
  background:linear-gradient(145deg,rgba(83,101,119,.94),rgba(24,29,35,.94));
  box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 24px rgba(182,205,228,.3),inset 0 1px 0 rgba(255,255,255,.2);
}

.public-server-card.podium-rank-3 {
  border-color:rgba(215,135,74,.65);
  box-shadow:0 25px 64px rgba(0,0,0,.38),0 0 38px rgba(180,92,42,.22),inset 0 1px 0 rgba(255,222,197,.12);
}

.public-server-card.podium-rank-3 .public-server-rank {
  color:#ffd4b1;
  background:linear-gradient(145deg,rgba(111,57,27,.94),rgba(30,19,14,.94));
  box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 24px rgba(215,120,60,.27),inset 0 1px 0 rgba(255,255,255,.18);
}

.public-server-premium-badge {
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  max-width:100%;
  padding:6px 10px;
  border:1px solid rgba(244,199,92,.62);
  border-radius:999px;
  color:#ffe6a2;
  background:linear-gradient(180deg,rgba(90,66,18,.86),rgba(45,31,8,.9));
  box-shadow:0 0 18px rgba(228,179,79,.22),inset 0 1px 0 rgba(255,255,255,.14);
  font-size:11px;
  font-weight:950;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.035em;
  white-space:nowrap;
}

.public-server-premium-badge img {
  display:block;
  width:22px;
  height:22px;
  object-fit:contain;
  filter:drop-shadow(0 0 6px rgba(255,206,90,.5));
}

.public-server-bump-count {
  position:absolute;
  z-index:3;
  right:15px;
  bottom:13px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  color:#dce7f3;
  background:rgba(5,8,13,.68);
  backdrop-filter:blur(10px);
  font-size:11px;
  font-weight:800;
}

.public-server-bump-count strong {
  color:#fff;
}

.public-server-card-body {
  position:relative;
  display:flex;
  flex:1;
  min-width:0;
  flex-direction:column;
  gap:10px;
  padding:14px;
}

.public-server-card.is-podium .public-server-card-body {
  gap:12px;
  padding:17px;
}

.public-server-card-title-row {
  position:relative;
  display:block;
  min-height:40px;
  min-width:0;
  padding-left:58px;
}

.public-server-card-title-row > .public-server-avatar,
.public-server-card-title-row > img,
.public-server-card-title-row > .public-server-guild-fallback {
  position:absolute;
  top:-38px;
  left:0;
}

.public-server-card-title-row > div {
  min-width:0;
  padding-top:1px;
}

.public-server-card-title-row h3 {
  margin:0;
  overflow:hidden;
  color:#fff;
  font-size:16px;
  line-height:1.18;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.public-server-card.is-podium .public-server-card-title-row h3 {
  font-size:clamp(18px,1.35vw,22px);
}

.public-server-card-title-row > div > span {
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#8998aa;
  font-size:12px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.public-server-card-body > p {
  display:-webkit-box;
  min-height:42px;
  margin:0;
  overflow:hidden;
  color:#c7d0dc;
  font-size:14px;
  line-height:1.45;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.public-server-avatar {
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  overflow:visible;
  border:2px solid rgba(53,217,255,.6);
  border-radius:50%;
  color:#dcf8ff;
  background:radial-gradient(circle at 50% 35%,rgba(53,217,255,.23),rgba(12,18,27,.97));
  box-shadow:0 0 0 3px rgba(53,217,255,.07),0 0 20px rgba(53,217,255,.18),0 10px 24px rgba(0,0,0,.34);
  font-weight:950;
}

.public-server-avatar.small {
  width:48px;
  height:48px;
  font-size:18px;
}

.public-server-card-title-row > img,
.public-server-card-title-row > .public-server-guild-fallback {
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  overflow:hidden;
  border:2px solid rgba(53,217,255,.6);
  border-radius:50%;
  background:#101b28;
  object-fit:cover;
  box-shadow:0 0 0 3px rgba(53,217,255,.07),0 0 20px rgba(53,217,255,.18),0 10px 24px rgba(0,0,0,.34);
}

.public-server-card.is-premium .public-server-card-title-row > img,
.public-server-card.is-premium .public-server-card-title-row > .public-server-guild-fallback {
  border-color:#f4c75c;
  box-shadow:0 0 0 3px rgba(228,179,79,.12),0 0 22px rgba(255,207,93,.42),0 9px 22px rgba(0,0,0,.36);
}

.public-server-avatar.large {
  width:104px;
  height:104px;
  font-size:36px;
}

.public-server-avatar > img:not(.public-server-avatar-emblem) {
  display:block;
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
}

.public-server-avatar.is-premium {
  border-color:#f4c75c;
  box-shadow:0 0 0 3px rgba(228,179,79,.12),0 0 22px rgba(255,207,93,.6),0 0 40px rgba(228,179,79,.28),0 12px 28px rgba(0,0,0,.36);
}

.public-server-avatar .public-server-avatar-emblem {
  position:absolute;
  z-index:2;
  right:-7px;
  bottom:-7px;
  width:31px;
  height:31px;
  border-radius:0;
  object-fit:contain;
  filter:drop-shadow(0 5px 7px rgba(0,0,0,.82)) drop-shadow(0 0 8px rgba(228,179,79,.62));
}

.public-server-avatar.large .public-server-avatar-emblem {
  right:-9px;
  bottom:-9px;
  width:42px;
  height:42px;
}

.public-server-tags {
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}

.public-server-tags > span {
  max-width:100%;
  overflow:hidden;
  padding:4px 8px;
  border:1px solid rgba(53,217,255,.23);
  border-radius:999px;
  color:#bfeeff;
  background:rgba(18,62,80,.28);
  font-size:10px;
  font-weight:850;
  line-height:1.15;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.public-server-card-meta {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px 12px;
  margin:auto 0 0;
  padding-top:10px;
  border-top:1px solid rgba(183,199,222,.13);
}

.public-server-card-meta div {
  min-width:0;
}

.public-server-card-meta .public-server-card-owner {
  grid-column:1 / -1;
}

.public-server-card-meta dt {
  overflow:hidden;
  color:#77879b;
  font-size:10px;
  font-weight:900;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}

.public-server-card-meta dd {
  display:flex;
  align-items:center;
  gap:6px;
  margin:3px 0 0;
  overflow:hidden;
  color:#e5ebf3;
  font-size:11px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.public-server-card-owner dd {
  flex-wrap:wrap;
  overflow:visible;
  white-space:normal;
}

.public-server-card-owner dd > span:first-child {
  flex:0 1 auto;
  max-width:100%;
  white-space:nowrap;
}

.public-server-card-meta dd > span:first-child {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.public-server-card-meta .public-server-premium-badge {
  flex:0 0 auto;
  gap:3px;
  padding:3px 6px 3px 4px;
  font-size:7px;
  letter-spacing:0;
}

.public-server-card-meta .public-server-premium-badge img {
  width:12px;
  height:12px;
}

.public-server-results-head {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:24px;
}

.public-server-search {
  display:flex;
  width:min(100%,650px);
  gap:9px;
  justify-content:flex-end;
}

.public-server-search input {
  width:min(420px,100%);
  min-height:46px;
  padding:0 15px;
  border:1px solid rgba(183,199,222,.22);
  border-radius:9px;
  outline:0;
  color:#f4f7fb;
  background:rgba(10,15,23,.78);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  font:inherit;
}

.public-server-search input:focus {
  border-color:rgba(53,217,255,.64);
  box-shadow:0 0 0 3px rgba(53,217,255,.1),inset 0 1px 0 rgba(255,255,255,.05);
}

.public-server-search .btn {
  display:inline-flex;
  min-height:46px;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}

.public-server-card-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:clamp(14px,1.5vw,22px);
}

.public-server-pagination {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin-top:38px;
}

.public-server-pagination > span:not(.btn) {
  color:#9da9b8;
  font-weight:850;
}

.public-server-pagination .is-disabled {
  cursor:not-allowed;
  opacity:.38;
}

.public-server-empty {
  display:grid;
  justify-items:center;
  max-width:660px;
  margin:50px auto 0;
  padding:44px 28px;
  border:1px solid rgba(183,199,222,.16);
  border-radius:16px;
  background:linear-gradient(150deg,rgba(22,31,43,.8),rgba(10,15,23,.84));
  text-align:center;
}

.public-server-empty img {
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 0 18px rgba(53,217,255,.28));
}

.public-server-empty h1,
.public-server-empty h3 {
  margin:16px 0 7px;
  color:#fff;
  font-size:clamp(25px,3vw,38px);
}

.public-server-empty p {
  max-width:520px;
  margin:0 0 20px;
  color:#aab6c5;
}

.public-server-not-found {
  position:relative;
  z-index:1;
  min-height:calc(100vh - 160px);
  align-content:center;
  margin-top:0;
}

.public-server-breadcrumbs {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:24px;
  color:#8f9dae;
  font-size:13px;
  font-weight:800;
}

.public-server-breadcrumbs a {
  color:#b9edfb;
}

.public-server-profile {
  position:relative;
  border:1px solid rgba(183,199,222,.2);
  border-radius:20px;
  background:linear-gradient(150deg,rgba(21,29,40,.88),rgba(9,14,22,.94));
  box-shadow:0 32px 84px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.07);
}

.public-server-profile.is-premium {
  border-color:rgba(244,199,92,.66);
  box-shadow:0 32px 84px rgba(0,0,0,.42),0 0 58px rgba(228,179,79,.25),inset 0 0 0 2px rgba(255,217,123,.12),inset 0 1px 0 rgba(255,255,255,.12);
}

.public-server-profile.is-premium::after {
  content:"";
  position:absolute;
  z-index:4;
  inset:5px;
  border:1px solid rgba(255,219,130,.28);
  border-radius:15px;
  pointer-events:none;
  box-shadow:inset 0 0 44px rgba(228,179,79,.08);
}

.public-server-hero {
  position:relative;
  min-height:0;
  aspect-ratio:4 / 1;
  overflow:hidden;
  border-radius:19px 19px 0 0;
  background:#070c14;
}

.public-server-hero-media {
  position:absolute;
  inset:0;
  overflow:hidden;
  background:radial-gradient(circle at 70% 20%,rgba(53,217,255,.3),transparent 42%),radial-gradient(circle at 20% 80%,rgba(127,211,50,.12),transparent 42%),linear-gradient(145deg,#16263a,#0b111b 70%);
}

.public-server-hero-background {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

.public-server-hero-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(5,8,13,.94) 0%,rgba(5,8,13,.78) 40%,rgba(5,8,13,.2) 80%),linear-gradient(180deg,rgba(5,8,13,.12),rgba(5,8,13,.4) 65%,rgba(5,8,13,.92));
}

.public-server-hero-content {
  position:absolute;
  z-index:2;
  right:clamp(28px,5vw,70px);
  bottom:clamp(30px,5vw,70px);
  left:clamp(28px,5vw,70px);
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:clamp(20px,3vw,36px);
  align-items:end;
}

.public-server-hero-copy {
  min-width:0;
}

.public-server-hero-copy h1 {
  max-width:900px;
  margin:12px 0 8px;
  color:#fff;
  font-size:clamp(37px,5vw,72px);
  line-height:.98;
  letter-spacing:-.04em;
  overflow-wrap:anywhere;
  text-wrap:balance;
}

.public-server-hero-copy > p {
  max-width:780px;
  margin:0 0 14px;
  color:#d3dce7;
  font-size:clamp(16px,1.5vw,20px);
  line-height:1.5;
}

.public-server-join {
  display:inline-flex;
  min-height:52px;
  align-items:center;
  justify-content:center;
  padding-inline:22px;
  white-space:nowrap;
}

.public-server-detail-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(270px,350px);
  gap:clamp(28px,4vw,58px);
  padding:clamp(32px,5vw,68px);
}

.public-server-about {
  min-width:0;
}

.public-server-prose {
  max-width:900px;
  margin-top:26px;
  color:#d3dbe5;
  font-size:16px;
  line-height:1.75;
  overflow-wrap:anywhere;
}

.public-server-prose > :first-child {
  margin-top:0;
}

.public-server-prose h2,
.public-server-prose h3,
.public-server-prose h4,
.public-server-prose h5,
.public-server-prose h6 {
  margin:1.6em 0 .5em;
  color:#f7faff;
  line-height:1.2;
  letter-spacing:-.015em;
}

.public-server-prose h2 { font-size:28px; }
.public-server-prose h3 { font-size:23px; }
.public-server-prose h4,.public-server-prose h5,.public-server-prose h6 { font-size:19px; }
.public-server-prose p { margin:0 0 1.15em; }
.public-server-prose ul,.public-server-prose ol { margin:0 0 1.2em; padding-left:1.4em; }
.public-server-prose li + li { margin-top:.42em; }
.public-server-prose a { color:#8de8ff; text-decoration:underline; text-decoration-color:rgba(141,232,255,.4); text-underline-offset:3px; }
.public-server-prose strong { color:#f6f9fd; }

.public-server-sidebar {
  display:grid;
  align-content:start;
  gap:18px;
}

.public-server-owner-card,
.public-server-stat-card {
  padding:21px;
  border:1px solid rgba(183,199,222,.17);
  border-radius:13px;
  background:rgba(8,13,21,.62);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}

.public-server-profile.is-premium .public-server-owner-card {
  border-color:rgba(228,179,79,.38);
  background:linear-gradient(145deg,rgba(45,35,17,.56),rgba(8,13,21,.7));
  box-shadow:0 0 25px rgba(228,179,79,.1),inset 0 1px 0 rgba(255,232,177,.08);
}

.public-server-owner-identity {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:13px;
  align-items:center;
  margin-top:15px;
}

.public-server-owner-identity > img,
.public-server-owner-fallback {
  display:grid;
  place-items:center;
  width:56px;
  height:56px;
  border:1px solid rgba(53,217,255,.42);
  border-radius:50%;
  color:#dff9ff;
  background:#132333;
  object-fit:cover;
  font-size:21px;
  font-weight:950;
}

.public-server-owner-identity strong {
  display:block;
  margin-bottom:8px;
  overflow:hidden;
  color:#fff;
  font-size:16px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.public-server-stat-card dl {
  display:grid;
  gap:0;
  margin:12px 0 0;
}

.public-server-stat-card dl div {
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:12px 0;
  border-bottom:1px solid rgba(183,199,222,.1);
}

.public-server-stat-card dt {
  color:#8997a9;
  font-size:12px;
  font-weight:800;
}

.public-server-stat-card dd {
  margin:0;
  color:#eef3f9;
  font-size:12px;
  font-weight:900;
  text-align:right;
}

.public-server-website {
  display:flex;
  justify-content:center;
  margin-top:18px;
}

@media (min-width:1900px) {
  .public-server-card-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
}

@media (max-width:1480px) {
  .public-server-card-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

@media (max-width:1060px) {
  .public-server-results-head { align-items:stretch; flex-direction:column; }
  .public-server-search { width:100%; justify-content:flex-start; }
  .public-server-search input { flex:1; width:auto; }
  .public-server-detail-layout { grid-template-columns:1fr; }
  .public-server-sidebar { grid-template-columns:1fr 1fr; }
  .public-server-hero { aspect-ratio:auto; }
  .public-server-hero-media { position:relative; inset:auto; aspect-ratio:4 / 1; }
  .public-server-hero-content { position:relative; right:auto; bottom:auto; left:auto; grid-template-columns:auto minmax(0,1fr); padding:26px; background:linear-gradient(150deg,rgba(15,23,34,.98),rgba(6,11,18,.99)); }
  .public-server-join { grid-column:1 / -1; justify-self:start; }
}

@media (max-width:900px) {
  .public-server-podium-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .public-server-card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width:760px) {
  .public-server-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:680px) {
  .public-server-directory,
  .public-server-detail { width:min(100% - 24px,1760px); padding-top:34px; }
  .public-server-intro { margin-bottom:42px; }
  .public-server-intro h1 { font-size:clamp(38px,13vw,58px); }
  .public-server-card-grid { grid-template-columns:1fr; }
  .public-server-podium-grid { grid-template-columns:minmax(0,1fr); max-width:520px; margin-inline:auto; }
  .public-server-rank { width:34px; height:34px; border-radius:9px; }
  .public-server-rank strong { font-size:17px; }
  .public-server-search { display:grid; grid-template-columns:1fr auto; }
  .public-server-search input { grid-column:1 / -1; width:100%; }
  .public-server-search-clear { grid-column:auto; }
  .public-server-sidebar { grid-template-columns:1fr; }
  .public-server-hero-content { right:auto; bottom:auto; left:auto; grid-template-columns:1fr; justify-items:start; padding:24px 20px 28px; }
  .public-server-hero-copy h1 { font-size:clamp(37px,12vw,54px); }
  .public-server-avatar.large { width:82px; height:82px; }
  .public-server-detail-layout { padding:28px 20px; }
  .public-server-pagination { display:grid; grid-template-columns:1fr 1fr; }
  .public-server-pagination > span:not(.btn) { grid-column:1 / -1; grid-row:1; text-align:center; }
  .public-server-pagination .btn { justify-content:center; }
}

@media (prefers-reduced-motion:reduce) {
  .public-server-card,
  .public-server-card-cover > img { transition:none; }
}