/* Shared public-site colors and navigation. Loaded after page-specific styles. */
:root {
  --site-text: #fff;
  --site-muted: rgba(255,255,255,.78);
  --site-border: rgba(255,255,255,.14);
  --site-green: #22c55e;
}
body {
  color: var(--site-text);
  background: radial-gradient(circle at top, rgba(59,130,246,.18), transparent 32%),
    linear-gradient(180deg, #041448 0%, #02103a 100%);
}
.ct-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px 24px;
  margin: 0 0 28px;
  padding: 12px 0 18px;
  border-bottom: 1px solid var(--site-border);
  text-align: left;
}
.ct-nav .ct-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--site-text);
  font-size: 17px;
  font-weight: 700;
  text-decoration: none;
}
.ct-brand img { width: 34px; height: 34px; object-fit: contain; }
.ct-links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.ct-nav .ct-links a { color: var(--site-muted); font-size: 14px; line-height: 1.5; text-decoration: none; }
.ct-nav .ct-links a:first-child { color: #8bf0b3; font-weight: 700; }
.ct-nav a:hover { text-decoration: underline; }
.ct-nav a:focus-visible { outline: 3px solid #93c5fd; outline-offset: 5px; border-radius: 3px; }
.ct-billing {
  --text: #fff;
  --muted: rgba(255,255,255,.78);
  --border: rgba(255,255,255,.14);
  --panel: rgba(255,255,255,.08);
  --panel-2: rgba(255,255,255,.04);
}
.ct-billing .card { background: var(--panel); border-radius: 18px; }
.ct-billing .card.featured { border-color: var(--site-green); }
.ct-billing .badge { background: rgba(255,255,255,.06); color: var(--site-muted); }
.ct-billing .badge.popular { background: rgba(34,197,94,.16); color: #8bf0b3; border-color: rgba(34,197,94,.5); }
.ct-billing .email-form { background: rgba(255,255,255,.04); }
.ct-billing .email-chip { background: rgba(255,255,255,.06); color: var(--site-text); }
.ct-billing .email-input { background: rgba(0,0,0,.18); }
.ct-billing .email-save-btn,
.ct-billing .btn-single,
.ct-billing .btn-user,
.ct-billing .btn-pro { background: var(--site-green); color: #041448; }
.ct-billing .email-save-btn:hover,
.ct-billing .btn-single:hover,
.ct-billing .btn-user:hover,
.ct-billing .btn-pro:hover { background: #4ade80; color: #041448; }
.ct-billing button:focus-visible,
.ct-billing a:focus-visible,
.ct-billing input:focus-visible { outline: 3px solid #93c5fd; outline-offset: 4px; }
@media (max-width: 640px) {
  .ct-nav { align-items: flex-start; flex-direction: column; gap: 12px; }
  .ct-links { gap: 10px 16px; }
}