/* Art of Truth Beta — Base reset + default typography */

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    color-scheme: dark;
    /* Base raised from 16px → 17.5px; scales all rem-based sizes by ~9%.
       px-sized UI labels bumped individually in components/pages.css. */
    font-size: 17.5px;
    -webkit-text-size-adjust: 100%;
}

body {
    /* Layered background: two layers over --ink-0.
       1. Radial vignette from top-center — accent-tinted halo at alpha
          0.05 so it reads as atmosphere, not colour.
       2. Inline SVG feTurbulence noise (fractalNoise, baseFreq 0.9,
          2 octaves, stitched, alpha 0.05) — paper-like grain at 200×200
          tiles so the repeat isn't visible.
       Both layers use `background-attachment: fixed` so texture stays
       consistent as the viewport scrolls. */
    background-color: var(--ink-0);
    background-image:
        radial-gradient(ellipse 110% 55% at 50% -10%,
            rgba(166, 28, 28, 0.05), transparent 62%),
        url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-repeat: no-repeat, repeat;
    background-attachment: fixed, fixed;
    color: var(--paper-0);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.7;
    min-height: 100vh;
}

/* Default link styles */
a {
    color: inherit;
    text-decoration: none;
}
a:hover {
    color: var(--accent);
}
:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 500;
    line-height: 1.15;
    color: var(--paper-0);
}

/* Paragraphs */
p {
    margin-bottom: 1.25em;
}
p:last-child {
    margin-bottom: 0;
}

/* Semantic block elements */
blockquote {
    border-left: 3px solid var(--accent);
    padding-left: 1.25rem;
    margin-left: 0;
    font-style: italic;
    color: var(--paper-1);
}

figure {
    margin: 0;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

hr {
    border: none;
    border-top: 1px solid var(--rule-weak);
    margin: 2rem 0;
}

/* Code */
code, pre, kbd, samp {
    font-family: var(--font-mono);
    font-size: 0.875em;
}

/* Lists */
ul, ol {
    padding-left: 1.5em;
}
li {
    margin-bottom: 0.25em;
}

/* Button reset */
button {
    font-family: var(--font-ui);
    cursor: pointer;
    border: none;
    background: none;
    color: inherit;
}

/* Screen reader only */
.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;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}