:root {
  --bg0: #0a1822;
  --bg1: #0e2432;
  --ink: #f2f8fa;
  --muted: #a3c0ce;
  --card: #134766;
  --card-edge: rgba(62, 175, 78, 0.28);
  --track: #2a5f78;
  --accent: #3eaf4e;
  --accent-2: #5ec96c;
  --accent-soft: rgba(62, 175, 78, 0.3);
  --logo-ink: #eef6f9;
  --logo-accent: #4dbd5c;
  --gauge-start: #2d9644;
  --gauge-mid: #3eaf4e;
  --gauge-end: #5ec96c;
  --btn-start: #72c97f;
  --btn-mid: #3eaf4e;
  --btn-end: #2f9640;
  --glow-left: rgba(62, 175, 78, 0.55);
  --glow-right: rgba(74, 168, 210, 0.32);
  --glow-beam: rgba(62, 175, 78, 0.38);
  --glow-frame: rgba(62, 175, 78, 0.28);
  --graph-idle: #2f5a70;
}

body {
  background:
    radial-gradient(900px 560px at 8% -8%, rgba(62, 175, 78, 0.16), transparent 50%),
    radial-gradient(760px 480px at 96% 6%, rgba(42, 130, 170, 0.14), transparent 48%),
    radial-gradient(640px 420px at 70% 110%, rgba(62, 175, 78, 0.1), transparent 52%),
    linear-gradient(165deg, var(--bg0), var(--bg1) 48%, #0c1e2a);
  background-attachment: fixed;
  color: var(--ink);
}

#ipDesk,
#ipMob,
.oDoLive-Status {
  fill: var(--muted);
}

.oDoLive-Speed,
.rtextnum,
.rtext,
.jitter-Mob,
.ConnectError {
  fill: var(--ink);
}

.rtext {
  fill: var(--muted);
}

.rtextmbms {
  fill: #b4ccd7;
}

.Cards {
  fill: var(--card);
  stroke: var(--card-edge);
}

.main-Gaugebg {
  stroke: var(--track);
}

.main-GaugeBlue {
  filter: drop-shadow(0 0 12px rgba(62, 175, 78, 0.35));
}

.uiBg {
  fill: #8eafbe;
}

.progressbg {
  stroke: #1f4d63;
}

.deskStart {
  filter: drop-shadow(0 0 14px rgba(62, 175, 78, 0.28));
}

.startButton {
  filter: drop-shadow(0 0 16px rgba(62, 175, 78, 0.65));
}

.startButton:hover {
  filter: drop-shadow(0 0 26px rgba(62, 175, 78, 0.9));
}

.ambient__glow--left-soft {
  background: radial-gradient(circle, rgba(42, 130, 170, 0.34), transparent 70%);
}

.Credits {
  color: #8eacbb;
}

.Credits a {
  color: #d4e6ee;
}

.Credits a:hover {
  color: var(--accent);
}

.server-meta {
  color: #8eacbb;
}

.server-meta__value,
.server-meta__host {
  color: #d4e6ee;
}

.server-meta__host:hover {
  color: var(--accent);
}

.server-meta__divider {
  background: rgba(142, 175, 190, 0.35);
}

.theme-toggle {
  color: #a3c0ce;
  opacity: 0.85;
}

.theme-toggle:hover {
  color: #ffffff;
  opacity: 1;
  background: rgba(255, 255, 255, 0.06);
}