<section id="webcheck" class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-12 sm:py-16">
    <div class="grid gap-8 lg:grid-cols-[minmax(0,2fr)_minmax(0,1.4fr)] items-start">
        <!-- Links: Test-Steuerung (Platzhalter) -->
        <div class="space-y-6">
            <div class="rounded-2xl border border-brand-border bg-brand-surface/80 p-6 sm:p-7 shadow-soft">
                <h2 class="font-heading text-xl sm:text-2xl font-semibold mb-2 text-white" data-i18n="fake_app_title">
                    Browser-Testoberfläche (Preview)
                </h2>
                <p class="text-sm text-brand-muted mb-4" data-i18n="fake_app_intro">
                    Hier entsteht die eigentliche FakeCheck-Web-App: Auswahl des Testordners, Konfiguration der Testmenge, Fortschrittsanzeige und Ergebnisübersicht. Aktuell zeigt der Button oben nur eine Demo-Ausgabe.
                </p>

                <ul class="space-y-2 text-xs text-brand-muted">
                    <li data-i18n="fake_app_point1">• Quick-Test mit kleiner Datenmenge.</li>
                    <li data-i18n="fake_app_point2">• Light-Benchmark: Schreib-/Lesegeschwindigkeit über begrenzte Zeit.</li>
                    <li data-i18n="fake_app_point3">• Write/Verify: Testdateien schreiben und direkt wieder verifizieren.</li>
                </ul>
            </div>
        </div>

        <!-- Rechts: Ergebnis / JSON-Report-Preview -->
        <div class="space-y-4">
            <div id="resultContainer" class="hidden rounded-2xl border border-brand-border bg-brand-surface/80 p-5 sm:p-6 shadow-soft">
                <h3 class="font-heading text-lg font-semibold mb-2 text-white" data-i18n="fake_result_title">
                    Demo-Ausgabe des Browser-Tests
                </h3>
                <p class="text-xs text-brand-muted mb-3" data-i18n="fake_result_hint">
                    Diese Ausgabe dient nur als Vorschau. Später wird hier der echte JSON-Report aus dem Browser-Test angezeigt.
                </p>
                <pre id="resultOutput"
                     class="text-[11px] whitespace-pre-wrap bg-black/40 text-brand-muted rounded-xl p-3 font-mono overflow-x-auto min-h-[140px]">
                </pre>
            </div>
        </div>
    </div>
</section>
