:root {
        color-scheme: dark;
        --color-accent: #D5A64A;
        --color-highlight: #F0BC58;
        --color-background: #10100f;
        --color-surface: #1b1a18;
        --color-text: #f5f2eb;
        --color-muted: #b4afa5;
        --font-display: "Arial Narrow", Impact, sans-serif;
      }
      html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; }
      body { background: var(--color-background); color: var(--color-text); }
      ::selection { background: var(--color-highlight); color: var(--color-background); }
      :focus-visible { outline: 3px solid var(--color-highlight); outline-offset: 4px; }
      .font-display { font-family: var(--font-display); }
      /* These theme utilities stay available even when the CDN cannot extend its config. */
      .bg-ink { background-color: var(--color-background); }
      .bg-panel { background-color: var(--color-surface); }
      .bg-brass { background-color: var(--color-accent); }
      .bg-brass\/15 { background-color: color-mix(in srgb, var(--color-accent) 15%, transparent); }
      .text-ink { color: var(--color-background); }
      .text-paper { color: var(--color-text); }
      .text-muted { color: var(--color-muted); }
      .text-brass { color: var(--color-accent); }
      .border-brass\/50 { border-color: color-mix(in srgb, var(--color-accent) 50%, transparent); }
      .decoration-brass\/40 { text-decoration-color: color-mix(in srgb, var(--color-accent) 40%, transparent); }
      .hover\:text-brass:hover { color: var(--color-accent); }
      .hover\:border-brass:hover { border-color: var(--color-accent); }
      .hover\:decoration-brass:hover { text-decoration-color: var(--color-accent); }
      .hero-shade { background: linear-gradient(90deg, rgba(10,10,9,.92) 0%, rgba(10,10,9,.72) 48%, rgba(10,10,9,.2) 100%), linear-gradient(0deg, rgba(10,10,9,.74), transparent 45%); }
      .js-enabled .reveal { opacity: 0; transform: translateY(1.2rem); transition: opacity .65s ease, transform .65s ease; }
      .js-enabled .reveal.is-visible { opacity: 1; transform: translateY(0); }
      dialog::backdrop { background: rgba(0,0,0,.9); backdrop-filter: blur(5px); }
      dialog[open] { animation: dialog-in .2s ease-out; }
      @keyframes dialog-in { from { opacity: 0; transform: scale(.98); } to { opacity: 1; transform: scale(1); } }
      @media (prefers-reduced-motion: reduce) {
        html { scroll-behavior: auto; }
        *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
        .js-enabled .reveal { opacity: 1; transform: none; }
      }
