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

body {
    font-family: var(--font-family-base);
    color: var(--color-text-primary);
    background: var(--color-bg-primary);
    line-height: var(--line-height-base);
}

body > header { border-bottom: 1px solid var(--color-border-light); padding: var(--space-4) var(--space-8); }
body > header a { color: var(--color-text-primary); text-decoration: none; font-weight: 600; font-size: var(--font-size-sm); }
body > footer { border-top: 1px solid var(--color-border-light); padding: var(--space-6) var(--space-8); text-align: center; font-size: var(--font-size-sm); color: var(--color-text-muted); }

main { max-width: var(--max-width); margin: 0 auto; padding: var(--space-12) var(--space-6); }

h1 { font-size: var(--font-size-h1); font-weight: 700; line-height: var(--line-height-h1); margin-bottom: var(--space-4); color: var(--color-h1); }
h1 span { display: block; font-size: 0.45em; font-weight: 300; color: var(--color-text-muted); margin-top: 0.3em; }
h2 { font-size: var(--font-size-h2); font-weight: 600; margin: var(--space-8) 0 var(--space-3); color: var(--color-h2); }
h3 { font-size: var(--font-size-h3); font-weight: 600; margin: var(--space-6) 0 var(--space-2); color: var(--color-h3); }
h4, h5, h6 { font-size: 1rem; font-weight: 600; margin: var(--space-4) 0 var(--space-2); }
p { margin-bottom: var(--space-4); }
ol, ul { margin: 0 0 var(--space-4) var(--space-6); }
li { margin-bottom: var(--space-1); }
strong { font-weight: 700; }
a { color: var(--color-primary); }
a:hover { color: var(--color-primary-hover); }

table { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
th, td { text-align: left; padding: var(--space-2); border-bottom: 1px solid var(--color-border-light); }
th { cursor: pointer; user-select: none; font-size: 0.75rem; color: var(--color-text-muted); }
input[type="search"] { width: 100%; padding: var(--space-2); margin-bottom: var(--space-3); border: 1px solid var(--color-border-light); border-radius: var(--radius-md); font-size: var(--font-size-sm); }
.count { font-weight: 300; color: var(--color-text-muted); font-size: 0.6em; }

.author { display: flex; gap: var(--space-8); align-items: flex-start; margin-bottom: var(--space-8); }
.author img { width: 200px; border-radius: 50%; flex-shrink: 0; }