:root {
  --color-background: #1d1e23;
  --color-text: #f6f5f1;
  --color-subtle-text: #b9bbc0;
  --color-line: rgba(246, 245, 241, .24);
  --line: var(--color-line);
}
html { color-scheme: dark; }
body { background: var(--color-background); color: var(--color-text); }
.grain { opacity: .09; }
:focus-visible { outline-color: var(--lime); }
.brand-mark { width: 64px; height: auto; padding: 0; background: transparent; border-radius: 0; }
.nav-cta { border-color: var(--paper); }
.nav-cta:hover, .case-next a:hover { background: var(--lime); border-color: var(--lime); color: var(--ink); }
.nav nav a::after { background: var(--lime); }
.hero h1 em, .intro h2 em, .contact h2 em, .ds-hero h1 em { color: var(--lime); }
.hero-orbit { border-color: var(--line); }
.hero-orbit i { background: var(--paper); }
.visual-note, .case-caption { color: var(--color-subtle-text); }
.value-list article { border-color: var(--paper); }
.contact { background: var(--color-background); border-top: 1px solid var(--line); }
.contact .email { color: var(--paper); border-color: var(--line); transition: color .2s ease, border-color .2s ease; }
.contact .email:hover, .contact .email:focus-visible { color: var(--lime); border-color: var(--lime); }
footer { border-top: 1px solid var(--line); }
.case-facts > div { border-color: var(--paper); }
.case-facts h2 em { color: var(--lime); }
.live-link { border-color: var(--paper); }
.live-link:hover { color: var(--lime); border-color: var(--lime); }
.case-next { background: #292a30; color: var(--paper); }
.case-next a { border-color: var(--paper); }
.ds-hero-bottom, .ds-index, .ds-section { border-color: var(--paper); }
.ds-nav-name, .ds-index p, .swatch-meta > span, .type-sample small,
.type-row small, .logo-source, .ds-field-hint { color: var(--color-subtle-text); }
.logo-vector-brand { border: 1px solid var(--line); }
.logo-vector-light { color: var(--ink); }
.ds-layout-example { background: #292a30; }
.ds-layout-example i { background: rgba(246, 245, 241, .16); }
.ds-button-outline { color: var(--paper); border-color: var(--paper); }
.ds-button-outline:hover { background: var(--paper); color: var(--ink); }
.ds-tag-accent { color: var(--ink); border-color: var(--ink); }
.ds-field { color: var(--paper); border-color: var(--paper); }
.ds-field::placeholder { color: var(--color-subtle-text); }
.ds-use > .ds-lead code { background: #292a30; color: var(--lime); }
.ds-use pre { background: #101115; border: 1px solid var(--line); }
.ds-end { background: #292a30; }
.copy-status { background: #101115; border: 1px solid var(--line); }
