/* Atoms and molecules. Values belong in tokens.css; layout belongs in styles.css. */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--space-8); }
body { margin: 0; background: var(--background); color: var(--text-primary); font: var(--font-body); letter-spacing: var(--tracking-body); -webkit-font-smoothing: antialiased; font-optical-sizing: auto; }
p { margin: 0 0 var(--space-6); }
h1, h2, h3 { margin: 0; }
h1, .type-display { font: var(--font-hero); letter-spacing: var(--tracking-display); }
h2, .type-headline { font: var(--font-headline); letter-spacing: var(--tracking-headline); }
h3, .type-title { font: var(--font-title); letter-spacing: var(--tracking-title); }
.type-subhead, .large-copy { font: var(--font-subhead); letter-spacing: var(--tracking-subhead); }
.type-lead { font: var(--font-lead); letter-spacing: var(--tracking-lead); }
.type-body { font: var(--font-body); letter-spacing: var(--tracking-body); }
.type-small { font: var(--font-small); letter-spacing: var(--tracking-small); }
.type-caption { font: var(--font-caption); letter-spacing: var(--tracking-caption); }
.type-label, .eyebrow { font: var(--font-label); letter-spacing: var(--tracking-small); }
strong { font-weight: var(--weight-semibold); }
code { font-family: var(--font-code); overflow-wrap: anywhere; }
a { color: var(--link); text-underline-offset: var(--space-1); text-decoration-thickness: var(--border-width); }
a:hover { text-decoration: underline; }
:where(a, button, summary, [tabindex]):focus-visible { outline: var(--focus-width) solid var(--focus); outline-offset: var(--focus-offset); }
img { display: block; max-width: 100%; height: auto; }
button, summary { -webkit-tap-highlight-color: var(--transparent); }
.link, .nav-link { display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--control-min); max-width: 100%; text-decoration: none; overflow-wrap: anywhere; }
.link { color: var(--link); }
.nav-link { color: inherit; }
.link:hover, .nav-link:hover { text-decoration: underline; }
.button {
  --button-background: var(--action); --button-text: var(--on-action); --button-border: var(--transparent);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); max-width: 100%; min-height: var(--control-min);
  padding: var(--control-padding-block) var(--control-padding-inline); border: var(--border-width) solid var(--button-border); border-radius: var(--radius-pill);
  background: var(--button-background); color: var(--button-text); font: var(--font-button); letter-spacing: var(--tracking-body);
  text-align: center; text-decoration: none; cursor: pointer; box-shadow: var(--shadow-flat);
  transition: background-color var(--motion-fast) var(--ease-control), color var(--motion-fast) var(--ease-control), border-color var(--motion-fast) var(--ease-control);
}
.button--primary { --button-background: var(--action); --button-text: var(--on-action); }
.button--secondary { --button-background: var(--transparent); --button-text: var(--link); --button-border: var(--link); }
.button--neutral { --button-background: var(--surface-inverse); --button-text: var(--text-inverse); }
.button:where(:not(:disabled):not([aria-disabled="true"])):hover { background: var(--action-hover); color: var(--on-action); border-color: var(--transparent); text-decoration: none; }
.button:where(:not(:disabled):not([aria-disabled="true"])):active { background: var(--action-active); color: var(--on-action); }
.button--neutral:where(:not(:disabled):not([aria-disabled="true"])):hover { background: var(--action-neutral-hover); color: var(--on-action); }
.button--neutral:where(:not(:disabled):not([aria-disabled="true"])):active { background: var(--action-neutral-active); color: var(--on-action); }
.button--compact { min-height: var(--control-compact); padding: var(--control-compact-padding-block) var(--control-compact-padding-inline); font: var(--font-button-compact); letter-spacing: var(--tracking-small); }
.button--large { min-height: var(--control-large); padding: var(--control-large-padding-block) var(--control-large-padding-inline); }
.button--block { width: 100%; border-radius: var(--radius-control); }
.button--compact.button--block { border-radius: var(--radius-small); }
.button--large.button--block { border-radius: var(--radius-control-large); }
.button:disabled, .button[aria-disabled="true"] { opacity: var(--opacity-disabled); cursor: not-allowed; }
.button[aria-busy="true"] { cursor: progress; }
.card { padding: var(--card-padding); border-radius: var(--radius-card); background: var(--surface); color: var(--text-primary); box-shadow: var(--shadow-flat); }
.card--muted { background: var(--surface-muted); }
.card--compact { padding: var(--card-padding-compact); }
.theme-inverse { background: var(--surface-inverse); color: var(--text-inverse); --link: var(--link-inverse); --text-secondary: var(--text-inverse-secondary); --focus: var(--focus-inverse); }
.theme-inverse .button--primary, .theme-inverse .button--secondary { --link: var(--link-inverse); }
.theme-inverse .button--neutral { --button-background: var(--action-neutral-inverse); --button-text: var(--text-primary); }
.theme-inverse .button--neutral:where(:not(:disabled):not([aria-disabled="true"])):hover { background: var(--action-neutral-inverse-hover); color: var(--text-primary); }
.theme-inverse .button--neutral:where(:not(:disabled):not([aria-disabled="true"])):active { background: var(--action-neutral-inverse-active); color: var(--text-primary); }
/* Original monochrome geometry: one registry, 24-unit grid, uniform 1.75-unit strokes. */
:root {
  --icon-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v16m-6-6 6 6 6-6'/%3E%3C/svg%3E");
  --icon-external: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M6 6h12v12'/%3E%3C/svg%3E");
  --icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 5 7 7-7 7'/%3E%3C/svg%3E");
  --icon-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round'%3E%3Cpath d='M5 12h14M12 5v14'/%3E%3C/svg%3E");
  --icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
}
.icon { display: inline-block; flex: none; width: var(--icon-size); height: var(--icon-size); background: currentColor; -webkit-mask: var(--icon-image) center / contain no-repeat; mask: var(--icon-image) center / contain no-repeat; }
.icon--small { width: var(--icon-small); height: var(--icon-small); }
.icon--down { --icon-image: var(--icon-down); }
.icon--external { --icon-image: var(--icon-external); }
.icon--chevron { --icon-image: var(--icon-chevron); }
.icon--plus { --icon-image: var(--icon-plus); }
.icon--minus { --icon-image: var(--icon-minus); }
.icon-button, .disclosure__indicator { display: inline-flex; align-items: center; justify-content: center; flex: none; width: var(--control-icon); height: var(--control-icon); border: 0; border-radius: var(--radius-circle); background: var(--surface-control); color: var(--text-control); }
.icon-button { width: var(--control-min); height: var(--control-min); cursor: pointer; }
.icon-button:where(:not(:disabled)):hover, .disclosure__trigger:hover .disclosure__indicator { background: var(--border); }
.icon-button:where(:not(:disabled)):active { background: var(--text-secondary); color: var(--surface); }
.icon-button:disabled { opacity: var(--opacity-disabled); cursor: not-allowed; }
.disclosure { border-block: var(--border-width) solid var(--border); }
.disclosure__trigger { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); min-height: var(--disclosure-min); padding-block: var(--space-4); list-style: none; cursor: pointer; font: var(--font-body); font-weight: var(--weight-semibold); letter-spacing: var(--tracking-body); }
.disclosure__trigger::-webkit-details-marker { display: none; }
.disclosure[open] > .disclosure__trigger .icon--plus { --icon-image: var(--icon-minus); }
.details-body { padding-block: var(--space-1) var(--space-6); }
.details-body > :last-child { margin-bottom: 0; }
.exhibit { margin: var(--space-7) 0; padding: var(--space-4); border-radius: var(--radius-media); background: var(--surface-muted); }
.exhibit a { display: block; }
.exhibit img { width: 100%; object-fit: contain; }
.exhibit figcaption { margin-top: var(--space-3); color: var(--text-secondary); font: var(--font-caption); letter-spacing: var(--tracking-caption); }
.skip { position: absolute; inset-block-start: var(--space-2); inset-inline-start: var(--space-2); padding: var(--space-3) var(--space-5); background: var(--surface); transform: translateY(-200%); z-index: 1; }
.skip:focus { transform: none; }
@media (pointer: coarse) { .button--compact { min-height: var(--control-min); } }