/* Palette drawn from finish materials: limewash walls, blackened-steel windows,
   graphite, mortar joints, moss. */
:root {
  --limewash: #efeee9;
  --paper: #f8f7f3;
  --steel: #1f2120;
  --graphite: #5e615d;
  --mortar: #d9d7d0;
  --moss: #3f4c3a;
  --on-moss: #f8f7f3;
  --viewer: #1b1c1b;
  --danger: #8a2f24;
  --serif: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --limewash: #161716;
    --paper: #1e1f1e;
    --steel: #ecebe6;
    --graphite: #a3a69f;
    --mortar: #343633;
    --moss: #b2c2a6;
    --on-moss: #161716;
    --viewer: #0e0f0e;
    --danger: #e3907f;
    color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--limewash);
  color: var(--steel);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
img { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--moss); outline-offset: 3px; border-radius: 3px; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid var(--moss);
  border-radius: 999px;
  background: var(--moss);
  color: var(--on-moss);
  font: 500 15px/1 var(--sans);
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}
.button:hover { filter: brightness(1.1); }
.button.quiet { background: transparent; color: var(--steel); border-color: var(--mortar); }
.button.quiet:hover { filter: none; border-color: var(--graphite); }
.button[disabled] { opacity: 0.45; cursor: default; filter: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
