:root { color: #1d2e23; background: #f4f7f2; font: 16px/1.6 Inter, ui-sans-serif, system-ui, sans-serif; }
body { margin: 0; }
main { width: min(760px, calc(100% - 32px)); margin: 0 auto; padding: 36px 0 64px; }
header { display: flex; align-items: center; gap: 16px; margin-bottom: 32px; border-radius: 18px; padding: 18px; color: #fff; background: #143c2b; }
header img { width: 64px; height: 64px; }
h1, h2, h3, p { margin-top: 0; }
header h1 { margin-bottom: 2px; }
header p { margin: 0; color: #d6e7da; }
section { border: 1px solid #dce6dc; border-radius: 18px; padding: clamp(20px, 5vw, 38px); background: #fff; }
h2, h3 { color: #143c2b; }
h3 { margin-top: 28px; }
code { overflow-wrap: anywhere; border-radius: 4px; padding: 2px 4px; background: #edf3ed; }
hr { margin: 34px 0; border: 0; border-top: 1px solid #d4ded5; }
@media (max-width: 520px) { :root { font-size: 14px; } main { padding-top: 16px; } header { border-radius: 12px; } section { border-radius: 12px; } }