
:root {
    --bg-ground:#FAF5EA;
    --bg-surface:#F2E8D3;
    --bg-surface-dark:#2B1D0E;
    --bg-surface-deep:#1A1208;
    --bg-surface-elevated:#FFF;
    --bg-surface-sunken:#E8DCC2;
    --ink-primary:#120E08;
    --ink-secondary:#1C150C;
    --ink-muted:#241A0E;
    --ink-dim:#2E2214;
    --border-ledger:rgba(28, 22, 14, 0.22);
    --border-ledger-strong:rgba(28, 22, 14, 0.45);
    --border-ledger-faint:rgba(28, 22, 14, 0.12);
    --border-solid:#1C160E;
    --border-contrast:#E8F0EA;
    --accent-signal:#0F2417;
    --accent-signal-hover:#173824;
    --accent-signal-active:#09170E;
    --accent-contrast:#FFF;
    --accent-contrast-dim:#FFF;
    --accent-highlight:#FFF8D4;
    --status-error-ink:#6B1111;
    --status-error-bg:#E4B4B4;
    --status-error-border:#8F2222;
    --status-success-ink:#0F2417;
    --status-success-bg:#BFD8C7;
    --status-success-border:#1C482C;

    --bawi-4e3:'Space Grotesk', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bawi-bc2:'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bawi-737:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

    --text-2xs:clamp(0.6875rem, 0.66rem + 0.1vw, 0.75rem);
    --text-xs:clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
    --text-sm:clamp(0.8125rem, 0.78rem + 0.2vw, 0.875rem);
    --text-base:clamp(0.9375rem, 0.9rem + 0.25vw, 1.0625rem);
    --text-md:clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
    --text-lg:clamp(1.25rem, 1.15rem + 0.6vw, 1.5rem);
    --text-xl:clamp(1.5rem, 1.35rem + 0.9vw, 1.875rem);
    --text-2xl:clamp(1.875rem, 1.65rem + 1.3vw, 2.375rem);
    --text-3xl:clamp(2.25rem, 1.95rem + 1.8vw, 3rem);
    --text-display:clamp(2.5rem, 2.1rem + 2.5vw, 4.25rem);

    --line-tight:1.15;
    --line-snug:1.3;
    --line-base:1.58;
    --line-loose:1.72;

    --tracking-tight:-0.03em;
    --tracking-snug:-0.015em;
    --tracking-normal:0em;
    --tracking-wide:0.06em;
    --tracking-widest:0.12em;

    --space-3xs:0.125rem;
    --space-2xs:0.25rem;
    --space-xs:0.5rem;
    --space-sm:0.75rem;
    --space-md:1rem;
    --space-lg:1.5rem;
    --space-xl:2rem;
    --space-2xl:3rem;
    --space-3xl:4.5rem;
    --space-4xl:6rem;
    --space-5xl:8rem;

    --max-reading:66ch;
    --max-editorial:54rem;
    --max-width:76rem;
    --max-wide:88rem;

    --ledger-rule-size:1.625rem;
    --ledger-line-color:rgba(28, 22, 14, 0.14);

    --dur-fast:140ms;
    --dur-base:180ms;
    --dur-mid:240ms;
    --dur-slow:360ms;

    --ease-sharp:cubic-bezier(0.16, 1, 0.3, 1);
    --ease-standard:cubic-bezier(0.2, 0, 0, 1);
    --ease-out:cubic-bezier(0, 0, 0.2, 1);
    --ease-in:cubic-bezier(0.4, 0, 1, 1);

    --radius-zero:0px;
}

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

html {
    -webkit-text-size-adjust:100%;
    tab-size:4;
    scroll-behavior:smooth;
    background-color:#FAF5EA;
    color:var(--ink-primary);
}

body {
    min-height:100vh;
    background-color:var(--bg-ground);
    color:var(--ink-primary);
    font-family:var(--bawi-bc2);
    font-size:var(--text-base);

    font-weight:400;
    line-height:var(--line-base);
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
    position:relative;
}

input,
button,
textarea,
select {
    font:inherit;
    color:inherit;
}

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

table {
    border-collapse:collapse;
    border-spacing:0;
    width:100%;
}

a {
    color:inherit;
    text-decoration-skip-ink:auto;
}

ul,
ol {

    list-style:none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family:var(--bawi-4e3);
    font-weight:700;
    line-height:var(--line-tight);
    color:var(--ink-primary);
    letter-spacing:var(--tracking-tight);
    text-wrap:balance;
    overflow-wrap:break-word;
}

h1 {
    font-size:var(--text-display);

}

h2 {
    font-size:var(--text-3xl);
    font-weight:600;
}

h3 {
    font-size:var(--text-2xl);
    font-weight:600;
}

h4 {
    font-size:var(--text-xl);
    font-weight:600;
}

h5 {
    font-size:var(--text-lg);
    font-weight:600;
}

h6 {
    font-size:var(--text-md);
    font-weight:600;
}

p {
    max-width:var(--max-reading);
    text-wrap:pretty;
    overflow-wrap:break-word;
}

p + p {
    margin-top:1.15em;
}

strong,
b {
    font-weight:700;
    color:var(--ink-primary);
}

small {
    font-size:var(--text-sm);
    line-height:var(--line-snug);
}

code,
kbd,
samp,
pre {
    font-family:var(--bawi-737);
    font-size:var(--text-sm);
    letter-spacing:var(--tracking-mono);
}

address {
    font-style:normal;
}

.skip-link {
    position:absolute;
    top:-100px;
    left:var(--space-md);
    z-index:9999;
    padding:var(--space-sm) var(--space-lg);
    background-color:var(--accent-signal);
    color:var(--accent-contrast);
    font-family:var(--bawi-737);
    font-size:var(--text-sm);
    font-weight:600;
    text-decoration:none;
    border:2px solid var(--accent-contrast);
    transition:top var(--dur-fast) var(--ease-sharp);
}

.skip-link:focus-visible {
    top:var(--space-md);
    outline:2px solid var(--ink-primary);
    outline-offset:3px;
}

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

.container {
    width:100%;
    max-width:var(--max-width);
    margin-left:auto;
    margin-right:auto;
    padding-left:clamp(var(--space-md), 4vw, var(--space-2xl));
    padding-right:clamp(var(--space-md), 4vw, var(--space-2xl));
}

.container-editorial {
    width:100%;
    max-width:var(--max-editorial);
    margin-left:auto;
    margin-right:auto;
    padding-left:clamp(var(--space-md), 4vw, var(--space-2xl));
    padding-right:clamp(var(--space-md), 4vw, var(--space-2xl));
}

.container-wide {
    width:100%;
    max-width:var(--max-wide);
    margin-left:auto;
    margin-right:auto;
    padding-left:clamp(var(--space-md), 3vw, var(--space-2xl));
    padding-right:clamp(var(--space-md), 3vw, var(--space-2xl));
}

.ledger-lines {
    background-color:var(--bg-ground);
}

.ledger-grid {
    position:relative;
}

.ledger-grid::before {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background-image:
        linear-gradient(to right, var(--border-ledger-faint) 1px, transparent 1px),
        linear-gradient(to bottom, var(--border-ledger-faint) 1px, transparent 1px);
    background-size:var(--ledger-rule-size) var(--ledger-rule-size);
    z-index:0;
}

.ledger-divider {
    display:block;
    width:100%;
    height:1px;
    background-color:var(--border-solid);
    border:none;
    margin:var(--space-2xl) 0;
}

.ledger-divider--faint {
    background-color:var(--border-ledger);
}

.ledger-divider--strong {
    height:2px;
    background-color:var(--border-solid);
}

.spec-mono {
    font-family:var(--bawi-737);
    font-size:var(--text-xs);
    letter-spacing:var(--tracking-mono);
    text-transform:uppercase;
}

.spec-badge {
    display:inline-flex;
    align-items:center;
    gap:var(--space-2xs);
    font-family:var(--bawi-737);
    font-size:var(--text-2xs);
    font-weight:600;
    letter-spacing:var(--tracking-wide);
    text-transform:uppercase;
    padding:0.2rem 0.55rem;
    background-color:#120E08;
    color:#FFF;
    border:1px solid var(--border-solid);
    white-space:nowrap;
    min-width:max-content;
}

.icon {
    display:inline-block;
    width:1.15em;
    height:1.15em;
    vertical-align:-0.15em;
    fill:currentColor;
    flex-shrink:0;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after {
        animation-duration:0.001ms !important;
        animation-iteration-count:1 !important;
        transition-duration:0.001ms !important;
    }
}
