html[data-theme-id="centrum-blue"] {
  --app-bg: #07131f;
  --app-canvas-bg: #020a11;
  --app-surface: #0b1b29;
  --app-surface-raised: #10283b;
  --app-surface-soft: #15344b;
  --app-navbar-bg: #071624;
  --app-control-bg: #0c2336;
  --app-control-hover: #123a58;
  --app-control-active: #176f9f;
  --app-border: #214b65;
  --app-border-strong: #39789b;
  --app-grid-major: rgba(113, 202, 255, 0.30);
  --app-grid-mid: rgba(72, 191, 255, 0.18);
  --app-grid-minor: rgba(72, 191, 255, 0.08);
  --app-text: #e6f6ff;
  --app-text-muted: #9eb8c8;
  --app-accent: #48bfff;
  --app-accent-cyan: #30d4d4;
  --app-accent-soft: rgba(72, 191, 255, 0.20);
  --app-success: #42caa2;
  --app-warning: #e1bd52;
  --app-danger: #e06666;
  --app-shadow: 0 14px 36px rgba(0, 0, 0, 0.46);
  --lumo-primary-color: var(--app-accent);
  --lumo-primary-color-10pct: var(--app-accent-soft);
  --lumo-primary-text-color: #8edcff;
  color: var(--app-text);
  background: var(--app-bg);

  --login-bg: #080f16;
  --login-bg-rgb: 8,15,22;
  --login-text: #e9f3f8;
  --login-accent-rgb: 77,163,223;
  --login-accent-deep-rgb: 47,120,173;
  --login-grid-rgb: 99,178,230;
  --login-radar-rgb: 128,217,255;
  --login-radar-strong-rgb: 159,223,255;
  --login-radar-hot-rgb: 176,235,255;
  --login-radar-soft-rgb: 120,231,255;
  --login-radar-soft-strong-rgb: 157,243,255;
  --login-contact: #d9f6ff;
  --login-contact-rgb: 167,235,255;
  --login-contact-border-rgb: 151,226,255;
  --login-contact-ring-rgb: 147,251,255;
  --login-contact-soft-rgb: 142,225,255;
  --login-bright-rgb: 235,252,255;
  --login-node-rgb: 213,249,255;
  --login-node-border-rgb: 190,244,255;
  --login-logo-panel-rgb: 23,48,68;
  --login-logo-panel-deep-rgb: 18,36,52;
  --login-logo-border-rgb: 135,214,255;
  --login-logo-ring-rgb: 160,224,255;
  --login-logo-track-rgb: 117,207,255;
  --login-logo-glow-rgb: 128,219,255;
  --login-logo-hover-rgb: 166,235,255;
  --login-title: #f4fbff;
  --login-label: #a9bbc6;
  --login-input-border-rgb: 97,128,148;
  --login-input-rgb: 16,26,36;
  --login-focus: #4da3df;
  --login-scan-rgb: 120,210,255;
  --login-axis-rgb: 200,244,255;
  --login-sweep-rgb: 92,197,255;
  --login-echo: #b8efff;
  --login-echo-rgb: 91,190,255;
  --login-contact-text-rgb: 83,190,255;
  --login-target: #b9f8ff;
  --login-plane: #e8fbff;
}

html[data-theme-id="centrum-blue"] body,
html[data-theme-id="centrum-blue"] #outlet {
  background-color: var(--app-bg);
}

html[data-theme-id="centrum-blue"] vaadin-button[theme~="primary"] {
  border-color: #55c9ff;
  background: linear-gradient(180deg, #177cac, #0d5279);
  color: #f3fbff;
}