* { box-sizing: border-box; }
html { scroll-padding-top: var(--s28); }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: var(--t-body); line-height: var(--lh-text); }
::selection { background: var(--selection); color: var(--ink); }
h1, h2, h3, p, figure, dl, dd { margin: 0; }
h1, h2, h3 { text-wrap: balance; }
h1 { font-size: var(--t-display); font-weight: var(--w-display); line-height: var(--lh-display); letter-spacing: var(--track-display); }
h2 { font-size: var(--t-h2); font-weight: var(--w-medium); line-height: var(--lh-head); letter-spacing: var(--track-head); }
h3 { font-size: var(--t-h3); font-weight: var(--w-medium); line-height: var(--lh-ui); letter-spacing: var(--track-head); }
a { color: inherit; text-underline-offset: var(--s1); }
button, input, textarea { font: inherit; }
button, summary { cursor: pointer; }
button { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: not-allowed; opacity: .5; }
svg { display: block; fill: currentColor; }
img { display: block; width: 100%; height: auto; }
[hidden] { display: none !important; }
:focus-visible { outline: var(--focus) solid var(--clay); outline-offset: var(--s1); }
.plain { list-style: none; padding: 0; margin: 0; }
.wrap { width: min(var(--page), calc(100% - var(--gutter) * 2)); margin-inline: auto; }
.section { padding-block: var(--section); }
.section-head { display: grid; gap: var(--s5); margin-bottom: var(--s12); max-width: var(--measure); }
.lead { color: var(--ink-2); font-size: var(--t-lead); line-height: var(--lh-text); text-wrap: pretty; }
.muted, .caption, .legend { color: var(--ink-2); }
.caption { margin-top: var(--s8); font-size: var(--t-small); }
.legend { font-size: var(--t-legend); line-height: var(--lh-ui); }
.mono, code, .num { font-variant-numeric: tabular-nums; }
.mono, code { font-family: var(--font-mono); font-size: var(--t-code); overflow-wrap: anywhere; }
.eyebrow { display: inline-flex; padding: var(--s2) var(--s4); background: var(--sheet-2); border-radius: var(--r-full);
  color: var(--ink-2); font-size: var(--t-micro); font-weight: var(--w-medium); letter-spacing: var(--track-legend); text-transform: uppercase; }
.bezel { padding: var(--bezel); background: var(--sheet-2); border-radius: var(--r-card); box-shadow: var(--inner), var(--shadow); }
.core { overflow: hidden; border-radius: var(--r-inner); background: var(--sheet); box-shadow: var(--inner); }
.icon { width: var(--icon); height: var(--icon); flex: none; }
.key { display: inline-flex; align-items: center; justify-content: center; gap: var(--s3); min-height: var(--s12); padding: var(--s3) var(--s5);
  border: 0; border-radius: var(--r-key); background: var(--sheet-2); color: var(--ink); text-decoration: none;
  font-size: var(--t-ui); font-weight: var(--w-medium); line-height: var(--lh-ui); white-space: nowrap;
  transition: transform var(--t-key) var(--ease-key); }
.key-ink { background: var(--ink); color: var(--on-ink); }
.key:has(.key-trail) { padding: var(--s2) var(--s2) var(--s2) var(--s6); }
.key-trail { display: grid; place-items: center; width: var(--s10); height: var(--s10); border-radius: var(--r-full);
  background: color-mix(in srgb, currentColor 12%, transparent); transition: transform var(--t-key) var(--ease-key); }
.key:hover .key-trail { transform: translate(var(--hover-shift), calc(-1 * var(--hover-shift))); }
.key:active, .theme-toggle:active { transform: scale(var(--press)); }
.key-sm { min-height: var(--s10); font-size: var(--t-small); padding: var(--s2) var(--s4); }
.text-link { display: inline-flex; align-items: center; gap: var(--s3); font-size: var(--t-ui); font-weight: var(--w-medium);
  text-decoration: none; min-height: var(--s12); }
.text-link .icon { transition: transform var(--t-key) var(--ease-key); }
.text-link:hover .icon { transform: translateX(var(--s1)); }
.cta-row { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s6); }
.visually-hidden { position: absolute; width: var(--hair); height: var(--hair); padding: 0; margin: 0; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip { position: fixed; top: var(--s4); left: var(--s4); z-index: var(--skip-layer); transform: translateY(-200%); }
.skip:focus { transform: none; }
.v { display: none; }.v[data-v='default'] { display: block; }
[data-m='review'] .v, [data-m='proof'] .v { display: none; }
[data-m='review'] .v[data-v='review'], [data-m='proof'] .v[data-v='proof'] { display: block; }
.row { display: block; }.display .row:last-child { color: var(--ink-2); }
summary { list-style: none; } summary::-webkit-details-marker { display: none; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
  [data-reveal].reveal-ready { opacity: 0; transform: translateY(var(--travel));
    transition: opacity var(--t-reveal) var(--ease-out), transform var(--t-reveal) var(--ease-out); }
  [data-reveal].is-visible { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}