:root {
  --lp-bg: #060d19;
  --lp-bg-soft: #091425;
  --lp-panel: #0d1a2d;
  --lp-panel-2: #101f35;
  --lp-panel-3: #142743;
  --lp-line: #203653;
  --lp-line-strong: #31537d;
  --lp-text: #eef5ff;
  --lp-text-soft: #b5c5db;
  --lp-muted: #7388a5;
  --lp-blue: #2f7df4;
  --lp-blue-strong: #4b91ff;
  --lp-blue-soft: rgba(47, 125, 244, .14);
  --lp-cyan: #31c7d8;
  --lp-green: #35d07f;
  --lp-yellow: #f6bb43;
  --lp-red: #f25d68;
  --lp-shadow: 0 20px 70px rgba(0, 0, 0, .32);
}

body.lp-dark {
  color-scheme: dark;
  color: var(--lp-text);
  background: var(--lp-bg);
  --lp-white: var(--lp-panel);
  --lp-slate-50: var(--lp-bg);
  --lp-slate-100: var(--lp-panel-2);
  --lp-slate-200: var(--lp-line);
  --lp-slate-300: var(--lp-line-strong);
  --lp-slate-500: var(--lp-muted);
  --lp-slate-600: var(--lp-text-soft);
  --lp-slate-700: #d3deed;
  --lp-slate-900: var(--lp-text);
  --lp-slate-950: #fff;
  --lp-blue-50: var(--lp-blue-soft);
  --lp-blue-100: rgba(47, 125, 244, .22);
  --lp-blue-500: var(--lp-blue-strong);
  --lp-blue-600: var(--lp-blue);
  --lp-blue-700: #91bbff;
  --lp-green-50: rgba(53, 208, 127, .12);
  --lp-green-600: var(--lp-green);
  --lp-yellow-50: rgba(246, 187, 67, .12);
  --lp-yellow-600: var(--lp-yellow);
  --lp-red-50: rgba(242, 93, 104, .12);
  --lp-red-600: var(--lp-red);
  --lp-focus: 0 0 0 3px rgba(75, 145, 255, .24);
}

/* Public pages retain their long-form layouts but inherit the same production
   workspace palette and top-level actions. */
body.lp-dark.lp-marketing {
  --bg: var(--lp-bg);
  --surface: var(--lp-panel);
  --surface2: var(--lp-panel-2);
  --line: var(--lp-line);
  --fg: var(--lp-text);
  --muted: var(--lp-text-soft);
  --dim: var(--lp-muted);
  --brand: var(--lp-blue);
  --brand2: var(--lp-blue-strong);
  --grn: var(--lp-green);
  --amber: var(--lp-yellow);
  --red: var(--lp-red);
  background: var(--lp-bg);
  color: var(--lp-text);
}
.lp-dark.lp-marketing > header {
  border-bottom-color: var(--lp-line);
  background: rgba(6, 13, 25, .94);
  box-shadow: none;
}
.lp-dark.lp-marketing .btn-ghost,
.lp-dark.lp-marketing .cta.ghost {
  border-color: var(--lp-line-strong);
  color: var(--lp-text);
  background: var(--lp-panel-2);
}
.lp-dark.lp-marketing .badge {
  border-color: rgba(47, 125, 244, .35);
  color: #b9d4ff;
  background: rgba(47, 125, 244, .12);
}
.lp-public-actions { display: flex; align-items: center; gap: 8px; }
.lp-public-actions .btn { padding: 8px 14px; font-size: 13px; }

.lp-dark .lp-card { border-color: var(--lp-line); background: var(--lp-panel); }
.lp-dark .lp-btn { border-color: var(--lp-line-strong); color: var(--lp-text); background: var(--lp-panel-2); }
.lp-dark .lp-btn:hover { border-color: #4773a8; background: var(--lp-panel-3); }
.lp-dark .lp-btn.primary { border-color: var(--lp-blue); background: var(--lp-blue); }
.lp-dark .lp-btn.primary:hover { background: var(--lp-blue-strong); }
.lp-dark .lp-field,
.lp-dark .lp-select,
.lp-dark .lp-textarea { border-color: var(--lp-line-strong); color: var(--lp-text); background: #081426; }
.lp-dark .lp-table th { color: var(--lp-text-soft); background: #0a1628; border-color: var(--lp-line); }
.lp-dark .lp-table td { border-color: var(--lp-line); }
.lp-dark .lp-table tbody tr:hover { background: rgba(47, 125, 244, .06); }
.lp-dark .lp-dialog-backdrop { background: rgba(1, 5, 12, .76); }
.lp-dark .lp-dialog { border-color: var(--lp-line-strong); background: var(--lp-panel); box-shadow: var(--lp-shadow); }
.lp-dark .lp-dialog-head,
.lp-dark .lp-dialog-foot { border-color: var(--lp-line); }
.lp-dark .lp-app-brand > span { color: var(--lp-blue-strong); }
.lp-dark .lp-app-brand > small { border-left-color: var(--lp-line); color: var(--lp-muted); }
.lp-dark .lp-app-brand::before { border-color: var(--lp-green); }
.lp-dark .lp-account-trigger { border-color: var(--lp-line-strong); color: var(--lp-text); background: #081426; }
.lp-dark .lp-account-trigger small { color: var(--lp-muted); }

.lp-platform-topbar {
  height: 64px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0 24px;
  border-bottom: 1px solid var(--lp-line);
  background: rgba(6, 13, 25, .94);
  backdrop-filter: blur(18px);
}
.lp-platform-brand { display: flex; align-items: center; gap: 10px; color: var(--lp-blue-strong); font-size: 17px; font-weight: 850; letter-spacing: .08em; }
.lp-platform-brand::before { content: ""; width: 10px; height: 10px; border: 2px solid var(--lp-green); border-radius: 50%; box-shadow: 0 0 12px rgba(53, 208, 127, .65); }
.lp-platform-brand small { display: block; color: var(--lp-muted); font-size: 8px; letter-spacing: .22em; }
.lp-platform-nav { display: flex; align-self: stretch; gap: 2px; }
.lp-platform-nav a { min-width: 92px; display: grid; place-items: center; padding: 0 13px; border-bottom: 2px solid transparent; color: var(--lp-muted); font-size: 13px; font-weight: 650; }
.lp-platform-nav a:hover,
.lp-platform-nav a.active { color: var(--lp-text); background: rgba(47, 125, 244, .08); border-bottom-color: var(--lp-blue); }
.lp-platform-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }

.lp-status-dot { width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: var(--lp-muted); }
.lp-status-dot.ok { background: var(--lp-green); box-shadow: 0 0 12px rgba(53, 208, 127, .65); }
.lp-status-dot.warn { background: var(--lp-yellow); }
.lp-status-dot.bad { background: var(--lp-red); }

@media (max-width: 760px) {
  .lp-platform-topbar { height: 56px; padding: 0 14px; }
  .lp-platform-brand small { display: none; }
  .lp-platform-nav { margin-left: auto; overflow-x: auto; }
  .lp-platform-nav a { min-width: auto; padding: 0 10px; font-size: 12px; white-space: nowrap; }
  .lp-platform-actions { display: none; }
	.lp-public-actions .btn-ghost { display: none; }
}