.container,
.container-tool,
.container-prose {
    width: min(100% - (var(--page-gutter) * 2), var(--container-max));
    margin-inline: auto;
}

.container-tool,
.container-prose {
    max-width: var(--container-max);
}

.section {
    padding-block: var(--section-space);
}

.flow > * + * {
    margin-block-start: var(--flow-space, var(--space-4));
}

.stack {
    display: flex;
    flex-direction: column;
    gap: var(--stack-gap, var(--space-4));
}

.cluster {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--cluster-gap, var(--space-3));
}

.surface {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
}

.text-secondary {
    color: var(--color-text-secondary);
}

.text-balance {
    text-wrap: balance;
}

.tabular-nums {
    font-variant-numeric: tabular-nums lining-nums;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    z-index: 1000;
    inset-block-start: var(--space-4);
    inset-inline-start: var(--space-4);
    min-height: 2.75rem;
    padding: var(--space-2) var(--space-4);
    display: inline-flex;
    align-items: center;
    border-radius: var(--radius-md);
    background: var(--color-text);
    color: var(--color-background);
    font-weight: var(--font-weight-semibold);
    text-decoration: none;
    transform: translateY(calc(-100% - var(--space-8)));
}

.skip-link:focus-visible {
    transform: translateY(0);
}