```javascript
// script.js

(() => {
    'use strict';

    let currentAccounts = [];
    let currentView = 'nonfollowers';

    const grid = document.getElementById('accounts-grid');
    const emptyState = document.getElementById('empty-state');
    const searchInput = document.getElementById('search-input');

    function escapeHTML(str = '') {
        return str
            .replace(/&/g, '&')
            .replace(/</g, '&lt;')
            .replace(/>/g, '&gt;')
            .replace(/"/g, '&quot;')
            .replace(/'/g, '&#039;');
    }

    function setText(id, value) {
        const el = document.getElementById(id);
        if (el) el.textContent = value;
    }

    function renderAccounts(accounts) {
        if (!accounts || accounts.length === 0) {
            grid.innerHTML = '';
            emptyState.classList.remove('hidden');
            return;
        }

        emptyState.classList.add('hidden');

        grid.innerHTML = accounts.map(a => {
            const username = escapeHTML(a.username || 'unknown');
            const initial = username.charAt(0).toUpperCase() || '?';

            return `
                <div class="card bg-zinc-900 border border-zinc-800 rounded-3xl p-6 hover:border-pink-400">
                    <div class="flex items-start gap-4">
                        <div class="w-14 h-14 bg-gradient-to-br from-pink-400 to-purple-500 rounded-2xl flex items-center justify-center text-4xl font-black">
                            ${initial}
                        </div>
                        <div class="flex-1 min-w-0">
                            <h4 class="font-bold text-xl tracking-tight">@${username}</h4>
                            ${currentView === 'nonfollowers'
                                ? `<p class="text-pink-400 text-sm mt-1">Doesn't follow you back</p>`
                                : ''
                            }
                            <div class="mt-6 grid grid-cols-2 gap-3">
                                https://www.instagram.com/${username}/
                                   👤 Open
                                </a>
                                https://www.instagram.com/direct/new/?username=${username}
                                   ✉️ Message
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            `;
        }).join('');
    }

    async function fetchData(action) {
        const res = await fetch(`core.php?action=${action}`);
        const data = await res.json();

        if (!data.success) {
            renderAccounts([]);
            return;
        }

        currentAccounts = data.accounts || [];
        renderAccounts(currentAccounts);

        if (data.stats) {
            setText('stat-non', data.stats.non || 0);
            setText('stat-mutual', data.stats.mutual || 0);
            setText('stat-following', data.stats.following || 0);
            setText('stat-followers', data.stats.followers || 0);
        }
    }

    async function loadView(view) {
        currentView = view;

        document.querySelectorAll('.nav-link')
            .forEach(el => el.classList.remove('text-pink-400'));

        const active = document.getElementById(`nav-${view}`);
        if (active) active.classList.add('text-pink-400');

        let action = 'get_nonfollowers';
        let title = "Accounts I follow who don't follow me back";
        let subtitle = 'Manual only • No automation';

        if (view === 'mutuals') {
            action = 'get_mutuals';
            title = 'Mutual follows ❤️';
        } else if (view === 'following') {
            action = 'get_following';
            title = 'Following';
        } else if (view === 'followers') {
            action = 'get_followers';
            title = 'Followers';
        }

        setText('view-title', title);
        setText('view-subtitle', subtitle);

        await fetchData(action);
    }

    function filterAccounts() {
        const term = searchInput.value.toLowerCase();
        if (!term) {
            renderAccounts(currentAccounts);
            return;
        }

        renderAccounts(
            currentAccounts.filter(a =>
                (a.username || '').toLowerCase().includes(term)
            )
        );
    }

    const modal = document.getElementById('import-modal');

    function openModal() {
        modal.classList.remove('hidden');
        document.body.classList.add('modal-open');
    }

    function closeModal() {
        modal.classList.add('hidden');
        document.body.classList.remove('modal-open');
    }

    async function importFromRemoteZip() {
        const status = document.getElementById('import-status');
        status.classList.remove('hidden');
        status.textContent = 'Importing remote ZIP…';

        const res = await fetch('import.php?remote=1');
        const result = await res.json();

        status.innerHTML = result.success
            ? `<span class="text-green-400">${result.message}</span>`
            : `<span class="text-red-400">${result.error || 'Import failed'}</span>`;

        if (result.success) {
            setTimeout(() => {
                closeModal();
                loadView(currentView);
            }, 1200);
        }
    }

    document.addEventListener('DOMContentLoaded', () => {
        document.getElementById('nav-nonfollowers').addEventListener('click', () => loadView('nonfollowers'));
        document.getElementById('nav-mutuals').addEventListener('click', () => loadView('mutuals'));
        document.getElementById('nav-following').addEventListener('click', () => loadView('following'));
        document.getElementById('nav-followers').addEventListener('click', () => loadView('followers'));

        document.getElementById('open-import').addEventListener('click', openModal);
        document.getElementById('close-import').addEventListener('click', closeModal);

        document.getElementById('import-server-btn').addEventListener('click', importFromRemoteZip);

        searchInput.addEventListener('input', filterAccounts);

        document.getElementById('open-assets').addEventListener('click', () => {
            window.open('assets/', '_blank', 'noopener,noreferrer');
        });

        document.addEventListener('keydown', e => {
            if (e.key === 'Escape' && !modal.classList.contains('hidden')) {
                closeModal();
            }
        });

        loadView('nonfollowers');
    });

})();
```