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

:root {
    --bg: #1a3828;
    --text: #e8f5e9;
    --muted: #81c995;
    --accent: #4ade80;
    --border: #2d5a3d;
    --font-mono: 'IBM Plex Mono', monospace;
    --font-sans: 'IBM Plex Sans', sans-serif;
}

html { font-size: 16px; -webkit-font-smoothing: antialiased; }
body { font-family: var(--font-sans); background: var(--bg); color: var(--text); line-height: 1.7; }

.page { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: 3rem 2.5rem; max-width: 560px; margin: 0 auto; position: relative; }

h1 { font-size: 2.5rem; font-weight: 500; color: var(--text); margin-bottom: 0.75rem; letter-spacing: -0.02em; }
.sub { color: var(--muted); font-size: 0.9rem; font-weight: 300; margin-bottom: 2rem; font-family: var(--font-mono); font-size: 0.8rem; }
.content { color: var(--muted); font-size: 0.9rem; }
.content p { margin-bottom: 0.75rem; }
.content em { color: var(--accent); font-style: normal; }

footer { margin-top: 5rem; padding-top: 1rem; border-top: 1px solid var(--border); font-size: 0.75rem; color: var(--muted); font-family: var(--font-mono); }

.badge { display: inline-block; font-size: 0.7rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--border); border-radius: 20px; padding: 0.2rem 0.75rem; margin-bottom: 1rem; font-family: var(--font-mono); }
.note { color: var(--muted); font-size: 0.82rem; margin-bottom: 1.75rem; font-family: var(--font-mono); }
.back-link { display: inline-block; font-size: 0.8rem; color: var(--muted); text-decoration: none; border-bottom: 1px solid var(--border); padding-bottom: 1px; transition: color 0.2s, border-color 0.2s; font-family: var(--font-mono); }
.back-link:hover { color: var(--text); border-color: var(--muted); }
