:root{ --bg:#fff7ec; --card:#ffffff; --ink:#2a1f14; --muted:#6a5a44; --accent:#e23b2e; --line:#f0dcc0; --link:#2b53d6; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --bg:#1b1410; --card:#261c16; --ink:#f4ead8; --muted:#c7b59a; --line:#3d2e22; --link:#8fb0ff; } }
:root[data-theme="dark"]{ --bg:#1b1410; --card:#261c16; --ink:#f4ead8; --muted:#c7b59a; --line:#3d2e22; --link:#8fb0ff; }
*{ box-sizing:border-box; }
html,body{ margin:0; background:var(--bg); color:var(--ink); }
body{ font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif; padding:24px 16px 48px; }
main{ max-width:760px; margin:0 auto; background:var(--card); border:2px solid var(--line); border-radius:18px; padding:24px 22px 28px; }
header{ display:flex; align-items:center; gap:12px; margin-bottom:6px; }
header .logo{ font:900 28px/1 system-ui,sans-serif; color:var(--accent); letter-spacing:.5px; }
h1{ font-size:26px; line-height:1.2; margin:6px 0 4px; }
.meta{ color:var(--muted); font-size:14px; margin:0 0 18px; }
h2{ font-size:19px; margin:26px 0 8px; padding-top:14px; border-top:1px solid var(--line); }
h3{ font-size:16px; margin:16px 0 6px; }
p,li{ margin:6px 0; }
ul{ padding-left:22px; }
a{ color:var(--link); }
.box{ background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin:12px 0; }
table{ width:100%; border-collapse:collapse; font-size:14px; margin:10px 0; }
th,td{ text-align:left; vertical-align:top; padding:8px; border-bottom:1px solid var(--line); }
th{ color:var(--muted); font-weight:700; }
footer{ max-width:760px; margin:18px auto 0; color:var(--muted); font-size:13px; text-align:center; }
@media (max-width:520px){ body{ padding:12px 12px 32px; } main{ padding:18px 14px 22px; } h1{ font-size:22px; } table{ font-size:13px; } th,td{ padding:6px 4px; } }