/* Match the watch-face palette in labs.css without changing shared legal pages. */
:root {
  color-scheme: dark;
  --bg: #050b14;
  --ink: #f3f8fc;
  --muted: #95a9ba;
  --card: #0d1929;
  --line: rgba(135, 181, 216, 0.2);
  --brand: #72cfff;
  --brand-2: #36d8c0;
  --accent: #36d8c0;
  --panel-bright: #112239;
  --shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

body {
  background:
    radial-gradient(circle at 72% 8%, rgba(20, 117, 189, 0.15), transparent 28rem),
    radial-gradient(circle at 8% 32%, rgba(25, 205, 178, 0.06), transparent 24rem),
    var(--bg);
}

.site-header {
  border-bottom-color: var(--line);
  background: rgba(5, 11, 20, 0.84);
  backdrop-filter: blur(18px);
}

.skip:focus,
.menu-toggle,
.btn-ghost,
.addon-menu,
.addon-trigger,
.addon-panel,
.download-actions a,
.download-item,
.community-frame {
  background: var(--card);
}

.site-nav a:hover,
.site-nav a:focus-visible,
.addon-trigger:hover,
.download-actions a:hover {
  background: var(--panel-bright);
}

.addon-trigger:hover { border-color: var(--brand); }

.btn-primary,
.addon-trigger.active,
.site-nav a.active,
.site-nav a.active:hover,
.site-nav a.active:focus-visible {
  color: #00111e;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
}

.site-nav .watch-site-link {
  color: var(--brand);
  border: 1px solid rgba(114, 207, 255, 0.55);
  white-space: nowrap;
}

.chip-row span { background: #091322; }
.hero-copy .eyebrow,
.section-card .eyebrow { color: var(--brand); }

.community-frame-wrap {
  border-color: var(--line);
  background: var(--card);
  box-shadow: var(--shadow);
}

.site-footer { background: #030810; }
.section[id] { scroll-margin-top: 90px; }
.logo:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

@media (max-width: 980px) {
  .menu-toggle { display: inline-flex; }
  .site-nav {
    position: absolute;
    left: 18px;
    right: 18px;
    top: 70px;
    display: none;
    flex-direction: column;
    background: #091322;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow);
    padding: 10px;
  }
  .site-nav.open { display: flex; }
}