:root {
            --mint: #78ea78;
            --electric: #00d4ff;
            --lavender: #b8a9ff;
            --coral: #ff7b7b;
            --bg: #000000;
            --bg-1: #0a0a0a;
            --text: #f5f5f5;
            --muted: #888;
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { scroll-behavior: smooth; }

        body {
            font-family: 'Outfit', sans-serif;
            background: var(--bg);
            color: var(--text);
            line-height: 1.6;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        /* Mobile nav */
        .mobile-nav-toggle.active .hamburger-line:nth-child(1) { transform: translateY(8px) rotate(45deg); }
        .mobile-nav-toggle.active .hamburger-line:nth-child(2) { opacity: 0; }
        .mobile-nav-toggle.active .hamburger-line:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
        .mobile-nav-dropdown.active { display: block !important; }

        [id] { scroll-margin-top: 100px; }

        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: var(--bg); }
        ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }

        .nav-link {
            color: rgba(255,255,255,0.7);
            text-decoration: none;
            font-size: 14px;
            font-weight: 500;
            padding: 8px 16px;
            transition: color 0.2s ease;
        }
        .nav-link:hover { color: var(--mint); }

        /* Category pill */
        .category-pill {
            display: inline-block;
            padding: 4px 12px;
            border-radius: 9999px;
            font-size: 12px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }

        /* Post content typography */
        .post-body {
            font-size: 18px;
            line-height: 1.8;
            color: rgba(255,255,255,0.85);
        }

        .post-body p {
            margin-bottom: 1.5em;
        }

        .post-body h2 {
            font-size: 1.75em;
            font-weight: 300;
            color: #fff;
            margin-top: 2.5em;
            margin-bottom: 0.75em;
            letter-spacing: -0.02em;
        }

        .post-body h3 {
            font-size: 1.35em;
            font-weight: 500;
            color: #fff;
            margin-top: 2em;
            margin-bottom: 0.5em;
        }

        .post-body h4 {
            font-size: 1.1em;
            font-weight: 600;
            color: #fff;
            margin-top: 1.5em;
            margin-bottom: 0.5em;
        }

        .post-body a {
            color: var(--mint);
            text-decoration: none;
            transition: color 0.2s ease;
        }
        .post-body a:hover {
            color: var(--electric);
        }

        .post-body ul, .post-body ol {
            margin-bottom: 1.5em;
            padding-left: 1.5em;
        }
        .post-body ul { list-style-type: disc; }
        .post-body ol { list-style-type: decimal; }
        .post-body li {
            margin-bottom: 0.5em;
            color: rgba(255,255,255,0.8);
        }

        .post-body blockquote {
            border-left: 3px solid var(--mint);
            padding: 1em 1.5em;
            margin: 2em 0;
            background: rgba(120,234,120,0.03);
            border-radius: 0 12px 12px 0;
            font-style: italic;
            color: rgba(255,255,255,0.7);
        }

        .post-body img {
            max-width: 100%;
            height: auto;
            border-radius: 16px;
            margin: 2em 0;
        }

        .post-body code {
            background: rgba(255,255,255,0.08);
            padding: 2px 8px;
            border-radius: 6px;
            font-size: 0.9em;
            color: var(--mint);
        }

        .post-body pre {
            background: var(--bg-1);
            border: 1px solid rgba(255,255,255,0.1);
            padding: 1.5em;
            border-radius: 16px;
            overflow-x: auto;
            margin: 2em 0;
        }

        .post-body pre code {
            background: transparent;
            padding: 0;
            color: rgba(255,255,255,0.8);
        }

        .post-body figure {
            margin: 2em 0;
        }

        .post-body figcaption {
            text-align: center;
            font-size: 0.875em;
            color: rgba(255,255,255,0.4);
            margin-top: 0.75em;
        }

        .post-body hr {
            border: none;
            border-top: 1px solid rgba(255,255,255,0.1);
            margin: 3em 0;
        }

        .post-body table {
            width: 100%;
            border-collapse: collapse;
            margin: 2em 0;
        }
        .post-body th, .post-body td {
            padding: 12px 16px;
            border: 1px solid rgba(255,255,255,0.1);
            text-align: left;
        }
        .post-body th {
            background: rgba(255,255,255,0.05);
            font-weight: 600;
            color: #fff;
        }

        /* Post navigation */
        .post-nav-link {
            display: block;
            padding: 1.25em 1.5em;
            border-radius: 16px;
            background: var(--bg-1);
            border: 1px solid rgba(255,255,255,0.1);
            text-decoration: none;
            transition: all 0.3s ease;
        }
        .post-nav-link:hover {
            border-color: rgba(255,255,255,0.2);
            transform: translateY(-2px);
        }

        /* Share link */
        .share-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,0.1);
            color: rgba(255,255,255,0.5);
            text-decoration: none;
            transition: all 0.2s ease;
        }
        .share-btn:hover {
            color: var(--mint);
            border-color: rgba(120,234,120,0.3);
            background: rgba(120,234,120,0.05);
        }