html {
    min-width: 0;
    background: var(--color-background);
    scroll-behavior: smooth;
    scrollbar-color: var(--color-border) var(--color-background);
    scrollbar-width: thin;
}

body {
    background: var(--color-background);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: var(--font-weight-regular);
    line-height: var(--type-body-leading);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body::-webkit-scrollbar {
    width: var(--space-2);
}

body::-webkit-scrollbar-track {
    background: var(--color-background);
}

body::-webkit-scrollbar-thumb {
    background: var(--color-border);
    border: 2px solid var(--color-background);
    border-radius: var(--radius-pill);
}

h1,
h2,
h3 {
    color: var(--color-text);
    font-family: var(--font-display);
    letter-spacing: var(--tracking-tight);
    line-height: var(--leading-tight);
    text-wrap: balance;
}

h1,
h2 {
    font-weight: var(--font-weight-extrabold);
}

h3 {
    font-weight: var(--font-weight-bold);
}

h1 {
    max-width: 30ch;
    font-size: var(--type-h1-size);
}

h2 {
    max-width: 32ch;
    font-size: var(--type-h2-size);
}

h3 {
    max-width: 28ch;
    font-size: var(--type-h3-size);
}

h4,
h5,
h6 {
    color: var(--color-text);
    font-family: var(--font-display);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--tracking-tight);
    line-height: var(--leading-snug);
}

h4 { font-size: var(--type-h4-size); }

p,
li,
dd {
    max-width: 72ch;
}

a {
    color: inherit;
    text-decoration-color: var(--color-cyan);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.22em;
}

a:hover {
    text-decoration-color: var(--color-mint);
}

button,
a,
input,
select,
textarea,
summary {
    transition-duration: var(--duration-fast);
    transition-property: color, background-color, border-color, box-shadow, opacity, transform;
    transition-timing-function: var(--ease-standard);
}

:focus:not(:focus-visible) {
    outline: none;
}

:focus-visible {
    outline: var(--focus-ring-width) solid var(--focus-ring-color);
    outline-offset: var(--focus-ring-offset);
}

::selection {
    background: var(--selection-background);
    color: var(--selection-text);
}

hr {
    height: 1px;
    margin-block: var(--space-8);
    border: 0;
    background: var(--color-border);
}

code,
kbd,
samp,
pre,
.measurement {
    font-variant-numeric: tabular-nums lining-nums;
}

main:focus {
    outline: none;
}

@media (max-width: 42rem) {
    h1, h2 { max-width: none; }
}
.tool-methodology-link { margin-block: var(--space-6); color: var(--color-text-secondary); font-size: var(--text-sm); line-height: 1.6; }
.tool-methodology-link a { color: var(--color-cyan); text-underline-offset: .2em; }
.tool-methodology-link a:hover { color: var(--color-mint); }
