/* Element defaults. Kept short on purpose: the system is mostly type and hairlines. */
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-primary);font:var(--type-body);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{margin:0;font-family:var(--serif);font-weight:var(--fw-medium);letter-spacing:var(--tracking-display)}
h1{font-size:var(--fs-display);font-weight:var(--fw-regular);line-height:var(--lh-display)}
h2{font-size:var(--fs-section);line-height:var(--lh-section)}
h3{font-size:var(--fs-lead);line-height:1.35}
h4{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-secondary)}
p{margin:0 0 var(--space-paragraph)}
a{color:var(--link-text);text-decoration:underline;text-decoration-color:var(--link-underline);text-decoration-thickness:1px;text-underline-offset:0.15em;transition:var(--transition-color)}
a:hover{color:var(--link-hover)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:var(--focus-width) solid var(--focus-ring);outline-offset:var(--focus-offset)}
hr{border:0;border-top:var(--hairline) solid var(--border-hairline);margin:var(--s-6) 0}
small{font:var(--type-small);color:var(--text-secondary)}
code,kbd,samp{font:var(--type-mono)}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums lining-nums}
::selection{background:var(--eosin);color:var(--paper)}
[data-theme="inverse"]{background:var(--surface-inverse);color:var(--text-inverse)}
[data-theme="inverse"] a{color:var(--text-inverse);text-decoration-color:var(--eosin-tint)}
[data-theme="inverse"] a:hover{color:var(--eosin-tint)}
[data-theme="inverse"] hr{border-top-color:var(--border-hairline-inverse)}
@media (max-width:720px){h1{font-size:var(--fs-display-mobile)}}
@media (prefers-reduced-motion:reduce){*{transition-duration:0.01ms!important;animation-duration:0.01ms!important}}