/* Homepage website public shells (root and 404): never load on the vault. */
:root {
  --bg: var(--td-bg);
  --bg-raised: var(--td-raised);
  --panel: var(--td-panel);
  --panel-soft: var(--td-soft);
  --text: var(--td-text);
  --muted: var(--td-muted);
  --blue: var(--td-blue);
  --blue-bright: var(--td-bright);
  --cyan: var(--td-cyan);
  --green: var(--td-green);
  --yellow: var(--td-yellow);
  --line: var(--td-line);
  --radius: var(--td-radius);
  --font-sans: var(--td-font-sans);
  --font-mono: var(--td-font-mono);
}
.hero h1 { font-weight: 800; }
.button-primary { color: var(--bg); }
.hub-panel, .contact-panel, .latest-card { border-radius: var(--radius); }
@media (prefers-contrast: more) {
  :root { --muted: #c3ccda; --line: rgba(255,255,255,.25); }
}
.brand {
  align-items: center;
  padding: 16px;
}
/* Cropped viewport, untouched supplied paths. 168 × 30.74px artwork;
   16px on each side exceeds half its height (15.37px). */
.brand img { width: 168px; height: auto; max-width: none; }
.nav-shell { gap: 16px; }
.route-core { background: var(--bg); box-shadow: none; }
.route-core img { width: 64px; height: 64px; }
@media (max-width: 680px) {
  /* 140 × 25.62px artwork, with at least 12.81px clearspace. */
  .brand { padding: 13px; }
  .brand img { width: 140px; }
}

/* Native reduced-motion source without changing logo layout. */
.wordmark-picture { display: contents; }