*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #f8f5ee; --bg2: #f0ece2;
  --surface: #ffffff; --surface2: #f4f0e6;
  --border: #ddd6c8; --border2: #c8c0b0;
  --text: #18140e; --muted: #8a7e6e; --muted2: #5a4e40;
  --accent: #e05c08; --accent-dim: rgba(224,92,8,0.1);
}
[data-theme="dark"] {
  --bg: #111009; --bg2: #18150f;
  --surface: #1c1810; --surface2: #242018;
  --border: #2e2820; --border2: #3a3228;
  --text: #f4f0e4; --muted: #7a6e5e; --muted2: #a09080;
}
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text); font-family: 'Golos Text', sans-serif; font-size: 16px; line-height: 1.7; }
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 200; height: 72px; background: var(--bg); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 52px; justify-content: space-between; }
.nav-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.nav-logo-icon { width: 34px; height: 34px; background: #e05c08; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nav-logo-text { font-family: 'Unbounded', sans-serif; font-size: 15px; font-weight: 400; letter-spacing: 0.14em; color: var(--text); }
.nav-back { font-size: 13px; color: var(--muted2); text-decoration: none; transition: color 0.2s; font-family: 'Golos Text', sans-serif; }
.nav-back:hover { color: var(--text); }
.page-wrap { max-width: 760px; margin: 0 auto; padding: 120px 52px 80px; }
h1 { font-family: 'Unbounded', sans-serif; font-size: clamp(24px, 3vw, 36px); font-weight: 300; line-height: 1.2; letter-spacing: -0.01em; margin-bottom: 12px; }
.date { font-size: 13px; color: var(--muted); margin-bottom: 52px; }
h2 { font-family: 'Unbounded', sans-serif; font-size: 16px; font-weight: 400; margin-top: 40px; margin-bottom: 14px; }
p { color: var(--muted2); margin-bottom: 14px; }
ul { color: var(--muted2); padding-left: 20px; margin-bottom: 14px; }
ul li { margin-bottom: 6px; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
footer { border-top: 1px solid var(--border); padding: 32px 52px; display: flex; justify-content: space-between; align-items: center; }
.footer-links { display: flex; gap: 32px; }
.footer-links a { font-size: 13px; color: var(--muted); text-decoration: none; transition: color 0.2s; }
.footer-links a:hover { color: var(--text); }
.footer-copy { font-size: 12px; color: var(--muted); }