body {
        font-family: system-ui, Arial, sans-serif;
        background: #f8f9fa;
        margin: 0;
        padding: 0 1.5em 2em 1.5em;
        max-width: 700px;
        margin-left: auto;
        margin-right: auto;
    }
    h1 {
        font-size: 2em;
        color: #22223b;
        margin-top: 1.2em;
    }
    h2, h3 {
        color: #3a3a3a;
        margin-top: 1.2em;
    }
    nav {
        margin: 2em 0;
        padding: 1em 0;
        border-top: 1px solid #e2e2e2;
    }
    nav ul {
        list-style: none;
        padding: 0;
    }
    nav ul li {
        display: inline-block;
        margin-right: 1em;
    }
    nav a {
        text-decoration: none;
        color: #3d5afe;
        font-weight: 500;
        transition: color 0.2s;
    }
    nav a:hover {
        color: #1a237e;
    }
    ul {
        padding-left: 1.3em;
    }
    code {
        background: #ececec;
        padding: 2px 6px;
        border-radius: 4px;
        font-size: 0.98em;
    }
    a[target="_blank"]:after {
        content: " ↗";
        font-size: 0.9em;
        color: #aaa;
    }
    p, ul, ol {
        line-height: 1.6;
    }