/* The District Studio — tokens from the brandbook: #352e2e (espresso), #b7ae98 (sand), #f2f0ee (bone).
   Type: Arial bold (logo/display), Space Mono (details), Canva Sans → system grotesk stand-in, EB Garamond italic accent. */
@font-face { font-family: "Space Mono"; src: url("../fonts/SpaceMono-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Space Mono"; src: url("../fonts/SpaceMono-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "DT Garamond"; src: url("../fonts/EBGaramond-Italic.woff2") format("woff2"); font-style: italic; font-weight: 400; font-display: swap; }
.dt-root {
  color-scheme: light dark;
  --dt-espresso: #352e2e; --dt-sand: #b7ae98; --dt-bone: #f2f0ee; --dt-paper: #faf9f7;
  --dt-ink: #352e2e; --dt-muted: rgba(53,46,46,.72); --dt-line: rgba(53,46,46,.14); --dt-bg: var(--dt-bone);
  --dt-surface: #faf9f7; --dt-surface-alt: #e7e2d8;
  --dt-sans: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --dt-logo: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --dt-mono-f: "Space Mono", ui-monospace, Menlo, monospace;
  --dt-serif-f: "DT Garamond", "EB Garamond", Georgia, serif;
  --dt-ease: cubic-bezier(.22,1,.36,1);
  background: var(--dt-bg); color: var(--dt-ink); font-family: var(--dt-sans);
  min-height: 100vh; overflow-x: clip; line-height: 1.6; -webkit-font-smoothing: antialiased; font-size: 1rem;
  transition: background-color .3s var(--dt-ease), color .3s var(--dt-ease);
}
:root[data-theme="dark"],
.dt-root[data-theme="dark"] {
  color-scheme: dark;
  --dt-bg: #151312;
  --dt-ink: #f2ede7;
  --dt-muted: rgba(242,237,231,.72);
  --dt-line: rgba(242,237,231,.13);
  --dt-surface: #1e1b19;
  --dt-surface-alt: #191716;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]),
  .dt-root:not([data-theme="light"]) {
    color-scheme: dark;
    --dt-bg: #151312;
    --dt-ink: #f2ede7;
    --dt-muted: rgba(242,237,231,.72);
    --dt-line: rgba(242,237,231,.13);
    --dt-surface: #1e1b19;
    --dt-surface-alt: #191716;
  }
}
.dt-root *, .dt-root *::before, .dt-root *::after { box-sizing: border-box; }
.dt-root img { max-width: 100%; height: auto; display: block; }
.dt-root a { color: inherit; }
.dt-root :focus-visible { outline: 2px solid var(--dt-sand); outline-offset: 3px; }
.dt-wrap { width: min(100% - 2.5rem, 84rem); margin-inline: auto; }
.dt-skip { position: absolute; left: -999px; top: 0; z-index: 100; background: var(--dt-espresso); color: var(--dt-bone); padding: .75rem 1rem; }
.dt-skip:focus { left: 1rem; top: 1rem; }
.dt-mono { font-family: var(--dt-mono-f); }
.dt-serif { font-family: var(--dt-serif-f); font-style: italic; font-weight: 400; letter-spacing: 0; }
.dt-pending { background: #efe3c2; color: #5a4310; padding: 0 .4em; border-radius: .25rem; font: 700 .72rem/1.6 var(--dt-mono-f); letter-spacing: .04em; white-space: nowrap; vertical-align: middle; font-style: normal; }
.dt-dark { --dt-ink: var(--dt-bone); --dt-muted: rgba(242,240,238,.72); --dt-line: rgba(242,240,238,.16); background: var(--dt-espresso); color: var(--dt-ink); }
.dt-sand { background: #e7e2d8; }

