/* ==========================================================
ALPHASTRIKE OS
Design Engine

File        : 03_typography.css
Version     : 1.0.0
Created     : 12 August 2026
Maintainer  : ALPHASTRIKE
Description : Base typographic cascade, mapped to the locked
              --alpha-font-* tokens. Component files still own
              their own scoped type treatments; this file only
              sets sane defaults for raw HTML elements.
Copyright (c) 2026 ALPHASTRIKE
    All Rights Reserved.
============================================================*/

body {
    font-family: var(--alpha-font-body);
    font-weight: var(--alpha-font-weight-regular);
    font-size: var(--alpha-font-size-body);
    line-height: var(--alpha-line-height-body);
    color: var(--alpha-text-primary);
    background: var(--alpha-surface-page);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--alpha-font-display);
    font-weight: var(--alpha-font-weight-bold);
    line-height: var(--alpha-line-height-heading);
    color: var(--alpha-text-primary);
    text-transform: uppercase;
}

h1 {
    font-size: var(--alpha-font-size-chapter-title);
    line-height: var(--alpha-line-height-tight);
}

h2 {
    font-size: var(--alpha-font-size-h1);
}

h3 {
    font-size: var(--alpha-font-size-h2);
}

h4 {
    font-size: var(--alpha-font-size-h3);
}

h5 {
    font-size: var(--alpha-font-size-h4);
}

h6 {
    font-size: var(--alpha-font-size-label);
    text-transform: uppercase;
    letter-spacing: var(--alpha-letter-spacing-label);
}

p {
    color: var(--alpha-text-secondary);
}

small,
caption {
    font-size: var(--alpha-font-size-caption);
    line-height: var(--alpha-line-height-compact);
    color: var(--alpha-text-muted);
}

code,
pre,
kbd,
samp {
    font-family: var(--alpha-font-mono);
    font-size: var(--alpha-font-size-data);
}

code,
pre,
kbd,
samp,
[data-data],
[data-mono] {
    font-variant-numeric: tabular-nums;
}

[data-mono] {
    font-family: var(--alpha-font-mono);
    font-size: var(--alpha-font-size-data);
}

a {
    color: var(--alpha-interactive-default);
    transition: color var(--alpha-motion-duration-fast) var(--alpha-motion-ease-standard);
}

a:hover {
    color: var(--alpha-interactive-hover);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: var(--alpha-border-medium) solid var(--alpha-interactive-focus);
    outline-offset: 2px;
}

::selection {
    background: var(--alpha-color-brand-yellow);
    color: var(--alpha-color-brand-black);
}
