:root {
  --gt-server-bg: #030712;
  --gt-server-surface: rgba(8, 14, 32, 0.82);
  --gt-server-surface-2: rgba(8, 16, 36, 0.94);
  --gt-server-border: rgba(74, 85, 123, 0.26);
  --gt-server-text: #eef2ff;
  --gt-server-text-soft: #cbd5e1;
  --gt-server-muted: #8ea2c4;
  --gt-server-accent-a: #8b5cf6;
  --gt-server-accent-b: #06b6d4;
  --gt-server-accent-c: #f472b6;
}

body.gt-server-page {
  background:
    radial-gradient(circle at top left, rgba(168,85,247,0.22), transparent 28%),
    radial-gradient(circle at top right, rgba(14,165,233,0.16), transparent 24%),
    linear-gradient(180deg, #020617 0%, #020817 36%, #030712 100%);
  color: var(--gt-server-text);
}

.gt-page-shell {
  position: relative;
  z-index: 1;
}

.gt-page-shell::before,
.gt-page-shell::after {
  content: "";
  position: fixed;
  inset: auto;
  pointer-events: none;
  filter: blur(70px);
  opacity: .32;
  z-index: -1;
}

.gt-page-shell::before {
  top: 100px;
  left: -40px;
  width: 220px;
  height: 220px;
  background: rgba(139, 92, 246, 0.28);
}

.gt-page-shell::after {
  top: 260px;
  right: 0;
  width: 260px;
  height: 260px;
  background: rgba(6, 182, 212, 0.18);
}

.gt-page-backbar {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  padding: .72rem 1rem;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,0.18);
  background: rgba(7,12,28,0.46);
  color: var(--gt-server-text-soft);
  text-decoration: none;
  backdrop-filter: blur(10px);
  transition: all .2s ease;
}

.gt-page-backbar:hover {
  color: #fff;
  border-color: rgba(168,85,247,0.32);
  transform: translateY(-1px);
}

.gt-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(10, 16, 35, 0.92), rgba(4, 9, 22, 0.96)) !important;
  border-color: var(--gt-server-border) !important;
  box-shadow: 0 26px 60px rgba(2, 8, 23, 0.24);
  backdrop-filter: blur(16px);
}

.gt-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(99,102,241,.08), rgba(6,182,212,.05) 40%, rgba(15,23,42,0) 78%);
}

.gt-card > * {
  position: relative;
  z-index: 1;
}

.gt-page-shell > .gt-card:first-of-type {
  background:
    radial-gradient(circle at top right, rgba(59,130,246,0.16), transparent 26%),
    radial-gradient(circle at left top, rgba(168,85,247,0.18), transparent 28%),
    linear-gradient(180deg, rgba(9, 16, 36, 0.98), rgba(4, 9, 22, 0.98)) !important;
}

.gt-page-shell > .gt-card:first-of-type .text-2xl,
.gt-page-shell > .gt-card:first-of-type .font-bold {
  letter-spacing: -.04em;
}

.gt-card .text-slate-100,
.gt-card .text-slate-200 {
  color: var(--gt-server-text) !important;
}

.gt-card .text-slate-300,
.gt-card .text-slate-400 {
  color: var(--gt-server-muted) !important;
}

.gt-card .bg-slate-800,
.gt-card .bg-slate-950\/30,
.gt-card .bg-slate-950\/40,
.gt-card .bg-slate-950\/50,
.gt-card .bg-slate-900\/60,
.gt-card .bg-black\/20,
.gt-card .bg-black\/30 {
  background: rgba(7, 12, 28, 0.55) !important;
}

.gt-card .border-slate-700,
.gt-card .border-slate-800 {
  border-color: rgba(148, 163, 184, 0.16) !important;
}

.gt-card table {
  width: 100%;
  border-collapse: collapse;
}

.gt-card table thead th {
  font-size: .72rem;
  color: var(--gt-server-muted) !important;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 700;
}

.gt-card table tbody tr {
  transition: background-color .2s ease;
}

.gt-card table tbody tr:hover {
  background: rgba(30, 41, 59, 0.16);
}

.gt-card button,
.gt-card a[class*='rounded'] {
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.gt-card button:hover,
.gt-card a[class*='rounded']:hover {
  transform: translateY(-1px);
}

.gt-banner-showcase .gt-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(51,65,85,.7);
  background: rgba(2,6,23,.28);
}

.gt-banner-showcase .gt-meta-label {
  color: var(--gt-server-muted);
  font-weight: 600;
}

.gt-banner-showcase .gt-meta-value {
  color: var(--gt-server-text);
  font-weight: 700;
  text-align: right;
}

.gt-banner-showcase .gt-preview-large,
.gt-banner-showcase .gt-preview-small {
  box-shadow: 0 18px 40px rgba(2, 8, 23, 0.28);
}

.gt-server-section-title {
  color: var(--gt-server-text);
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -.02em;
}

html.gt-theme-light body.gt-server-page {
  background:
    radial-gradient(circle at top left, rgba(168,85,247,0.12), transparent 28%),
    radial-gradient(circle at top right, rgba(14,165,233,0.1), transparent 24%),
    linear-gradient(180deg, #eff4fb 0%, #f7f9fc 100%);
  color: #0f172a;
}

html.gt-theme-light .gt-page-backbar {
  background: rgba(255,255,255,0.86);
  color: #334155;
  border-color: rgba(148,163,184,0.24);
}

html.gt-theme-light .gt-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(246,248,252,0.98)) !important;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
}

html.gt-theme-light .gt-page-shell > .gt-card:first-of-type {
  background:
    radial-gradient(circle at top right, rgba(59,130,246,0.1), transparent 26%),
    radial-gradient(circle at left top, rgba(168,85,247,0.12), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,248,252,0.98)) !important;
}

html.gt-theme-light .gt-card .text-slate-100,
html.gt-theme-light .gt-card .text-slate-200 {
  color: #0f172a !important;
}

html.gt-theme-light .gt-card .text-slate-300,
html.gt-theme-light .gt-card .text-slate-400,
html.gt-theme-light .gt-banner-showcase .gt-meta-label {
  color: #475569 !important;
}

html.gt-theme-light .gt-card .border-slate-700,
html.gt-theme-light .gt-card .border-slate-800,
html.gt-theme-light .gt-banner-showcase .border-slate-700,
html.gt-theme-light .gt-banner-showcase .border-slate-800 {
  border-color: rgba(148,163,184,0.22) !important;
}

html.gt-theme-light .gt-card .bg-slate-800,
html.gt-theme-light .gt-card .bg-slate-950\/30,
html.gt-theme-light .gt-card .bg-slate-950\/40,
html.gt-theme-light .gt-card .bg-slate-950\/50,
html.gt-theme-light .gt-card .bg-slate-900\/60,
html.gt-theme-light .gt-card .bg-black\/20,
html.gt-theme-light .gt-card .bg-black\/30,
html.gt-theme-light .gt-banner-showcase .bg-black\/30,
html.gt-theme-light .gt-banner-showcase .gt-meta-row,
html.gt-theme-light .gt-banner-showcase .gt-mini-stat {
  background: rgba(238, 243, 250, 0.86) !important;
}

html.gt-theme-light .gt-card table tbody tr:hover {
  background: rgba(226, 232, 240, 0.62);
}

@media (max-width: 767.98px) {
  .gt-page-backbar {
    padding: .68rem .9rem;
  }
}