/* The ordinary routes share the experience's type, palette and navigation. */
@font-face { font-family: Text; src: url('/assets/experience/fonts/text.woff2') format('woff2'); font-weight: 400 600; font-display: swap; }
@font-face { font-family: Display; src: url('/assets/experience/fonts/display.woff2') format('woff2'); font-weight: 300 700; font-stretch: 75% 100%; font-display: swap; }
@font-face { font-family: Mono; src: url('/assets/experience/fonts/mono.woff2') format('woff2'); font-weight: 400 500; font-display: swap; }
:root { --paper: #e6edeb; --ink: #10221f; --muted: #506561; --line: #c8d7cf; --mono: Mono, ui-monospace, monospace; }
body { font-family: Text, system-ui, sans-serif; }
h1, h2, h3 { font-family: Display, Text, sans-serif; font-weight: 500; }
button, input, select, textarea { font-family: Text, system-ui, sans-serif; }
.site-header { width: 100%; max-width: none; min-height: 84px; padding: 20px clamp(16px, 5.5vw, 88px); }
.site-header .brand { gap: 12px; font: 500 15px/1.15 Text, system-ui, sans-serif; letter-spacing: .22em; }
.site-header .brand img { width: 44px; height: 44px; }
.site-header .brand small { font: 400 10px/1.3 Text, system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.site-header nav { gap: 26px; font-size: 15px; }
.site-header nav a { min-height: 44px; }
.site-footer { font-family: Text, system-ui, sans-serif; }
.site-footer .brand { font-family: Text, system-ui, sans-serif; }
@media (max-width: 600px) {
  .site-header { padding: 16px; gap: 12px; }
  .site-header nav { gap: 12px; font-size: 13px; flex-wrap: wrap; }
  .site-header nav a { white-space: normal; }
}