:root {
  --slate: #213f33;
  --slate-dark: #12261c;
  --chalk: #f7f7f5;
  --chalk-dim: #c9d3ce;
  --chalk-yellow: #fae68c;
  --wood: #6b4224;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background: radial-gradient(ellipse at 50% 30%, var(--slate), var(--slate-dark)) fixed;
  border: 14px solid var(--wood);
  color: var(--chalk);
  font: 17px/1.6 "Chalkboard SE", "Comic Neue", "Segoe Print", system-ui, sans-serif;
}

main {
  max-width: 720px;
  margin: 0 auto;
  padding: 48px 16px 64px;
}

header { text-align: center; margin-bottom: 32px; }
header img { width: 112px; height: 112px; border-radius: 26px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4); }

h1 { font-size: 2.2em; margin: 16px 0 4px; }
h2 { color: var(--chalk-yellow); font-size: 1.3em; margin-top: 2em; }
p, li { color: var(--chalk-dim); }
strong { color: var(--chalk); }
a { color: var(--chalk-yellow); }

.subtitle { color: var(--chalk-yellow); margin: 0; }

nav { text-align: center; margin-top: 48px; font-size: 0.95em; }
nav a { margin: 0 10px; }

footer { text-align: center; margin-top: 24px; font-size: 0.85em; color: var(--chalk-dim); }