@import url("assets/editorial-instrument/tokens.css");

* { box-sizing: border-box; }
body, h1, h2, p, figure { margin: 0; }
html { background: var(--ds-color-surface-canvas); color: var(--ds-color-text-primary); scroll-padding-top: var(--ds-space-section); }
body { font-family: var(--ds-font-body); font-size: var(--ds-font-size-body); font-weight: var(--ds-font-weight-body); letter-spacing: var(--ds-font-tracking-body); line-height: calc(var(--ds-line-height-body) * 1.5); }
a { color: var(--ds-color-text-interactive); text-underline-offset: .2em; }
h1, h2 { font-family: var(--ds-font-heading); font-weight: var(--ds-font-weight-emphasis); letter-spacing: var(--ds-font-tracking-label); text-transform: uppercase; }
h1 { font-size: var(--ds-font-size-display); line-height: 1.2; }
main { max-width: calc(var(--ds-measure-reading) + var(--ds-space-page-inline) * 2); padding: calc(var(--ds-space-section) * 2) var(--ds-space-page-inline); margin: auto; }
.publication { width: 100%; }
.opening-painting { margin-bottom: var(--ds-space-flow); }
.opening-painting img { display: block; width: 100%; height: auto; }
.opening-painting figcaption { font-size: var(--ds-font-size-annotation); color: var(--ds-color-text-secondary); margin-top: var(--ds-space-inline); }
.opening-painting a { color: inherit; text-decoration: none; }
.opening-painting a:hover { text-decoration: underline; }
.publication > header { margin-bottom: var(--ds-space-flow); }
#worldeater { container-type: inline-size; }
#worldeater h1 { font-size: 12cqi; line-height: 1.15; white-space: nowrap; }
#worldeater h1 span { display: inline-block; }
.description { font-size: var(--ds-font-size-heading); line-height: 1.5; }
.byline { font-weight: 500; color: var(--ds-color-text-secondary); margin-top: var(--ds-space-inline); }
.signup-embed { display: block; width: 100%; max-width: 480px; height: 150px; margin-top: var(--ds-space-flow); border: 0; background: transparent; }
.recent-editions { margin-top: calc(var(--ds-space-section) * 1.5); border-top: var(--ds-border-width-structural) solid var(--ds-color-border-structural); padding-top: var(--ds-space-flow); }
.recent-editions h2 { font-family: var(--ds-font-label); font-size: var(--ds-font-size-label); line-height: var(--ds-line-height-label); }
.recent-editions p { margin-top: var(--ds-space-flow); color: var(--ds-color-text-secondary); }
:focus-visible { outline: var(--ds-border-width-focus) solid var(--ds-color-border-focus); outline-offset: var(--ds-border-width-control); }
.skip-link { position: fixed; top: -100px; left: var(--ds-space-flow); padding: var(--ds-space-inline); background: var(--ds-color-surface-inverse); color: var(--ds-color-text-inverse); z-index: 10; }
.skip-link:focus { top: var(--ds-space-inline); }
.error-page p + p { margin-top: var(--ds-space-flow); }
@media (max-width: 600px) {
  main { padding: var(--ds-space-section) var(--ds-space-flow); }
  h1 { font-size: min(var(--ds-font-size-display), 8vw); }
}
