/* ═══ NAV ═══ */
        nav {
            position: fixed; top: 0; left: 0; right: 0; z-index: 100;
            height: 72px;
            display: flex; align-items: center; justify-content: center;
            background: rgba(250,251,255,0.8);
            backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
            border-bottom: 1px solid var(--border);
            transition: all 0.3s;
        }
        .nav-inner {
            max-width: 1240px; width: 100%; padding: 0 24px;
            display: flex; align-items: center; justify-content: space-between;
            gap: 12px;
        }
        .nav-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
        .nav-logo img { width: 32px; height: 32px; border-radius: 8px; }
        .nav-logo span { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; color: var(--text); letter-spacing: -0.02em; }
        .nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
        .nav-links a { color: var(--text-secondary); text-decoration: none; font-size: 0.88rem; font-weight: 500; transition: color 0.2s; }
        .nav-links a:hover { color: var(--text); }
        .nav-right { display: flex; align-items: center; gap: 12px; }
        .nav-cta {
            background: var(--text); color: white; padding: 9px 22px;
            border-radius: 100px; font-size: 0.84rem; font-weight: 600;
            text-decoration: none; transition: all 0.2s;
        }
        .nav-cta:hover { background: var(--blue-700); }
        .hamburger { display: none; cursor: pointer; flex-direction: column; gap: 5px; background: none; border: none; padding: 10px; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; }
        .hamburger span { display: block; width: 22px; height: 2px; background: var(--text); border-radius: 2px; transition: all 0.3s; }
        .nav-user { display: flex; align-items: center; gap: 10px; cursor: pointer; }
        .nav-user img { width: 38px; height: 38px; border-radius: 50%; border: 2px solid var(--blue-200); object-fit: cover; }
        .nav-credits-badge {
            background: transparent;
            color: var(--blue-600); font-size: 0.84rem; font-weight: 700;
            padding: 9px 22px; border-radius: 100px;
            border: 1.5px solid var(--border);
            display: flex; align-items: center; gap: 5px;
            transition: all 0.2s; white-space: nowrap; flex-shrink: 0;
        }
        .nav-credits-badge .star { font-size: 0.65rem; color: var(--blue-500); }

        /* Profile dropdown */
        .nav-profile-wrap { position: relative; }
        .nav-profile-dropdown {
            display: none; position: absolute; top: calc(100% + 8px); right: 0;
            background: var(--white); border: 1px solid var(--border);
            border-radius: var(--radius); padding: 16px 20px;
            min-width: 240px; box-shadow: var(--shadow-lg); z-index: 200;
        }
        .nav-profile-dropdown.open { display: block; }
        .nav-profile-email {
            font-size: 0.82rem; color: var(--text-secondary);
            word-break: break-all; margin-bottom: 12px; line-height: 1.5;
        }
        .nav-profile-name {
            font-size: 0.92rem; font-weight: 600; color: var(--text);
            margin-bottom: 2px;
        }
        .nav-profile-divider { height: 1px; background: var(--border); margin: 12px 0; }
        .nav-profile-item {
            display: flex; align-items: center; gap: 8px; width: 100%; padding: 4px 0;
            color: var(--text); text-decoration: none; font-size: 0.88rem; font-weight: 500;
            transition: color 0.2s; background: none; border: none; cursor: pointer; text-align: left;
        }
        .nav-profile-item:hover { color: var(--blue-600); }
        .nav-profile-signout {
            font-size: 0.82rem; color: #EF4444; cursor: pointer;
            font-weight: 500; background: none; border: none;
            font-family: var(--font-body); padding: 0;
        }
        .nav-profile-signout:hover { text-decoration: underline; }