index.html

<!doctype html>
<html lang="ar" dir="rtl">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>التحقق من هلوسة القرآن والحديث وتصحيحها</title>
<meta name="description" content="التحقق من هلوسة القرآن والحديث وتصحيحها، يعمل بالكامل داخل المتصفح.">
<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
<link rel="preload" as="script" href="worker.js">
<link rel="preload" as="fetch" href="index/quran.idx.gz" crossorigin>
<link rel="prefetch" as="fetch" href="index/hadith.idx.gz" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@500;600&display=swap">
<link rel="stylesheet" href="styles.css">
</head>
<body class="icv-page">
<div class="page">

<div class="icv"><div class="hero">
  <svg class="mark" viewBox="0 0 64 64" fill="none" stroke="#E2C06E" stroke-width="1.8" aria-hidden="true"><rect x="14" y="14" width="36" height="36"/><rect x="14" y="14" width="36" height="36" transform="rotate(45 32 32)"/><circle cx="32" cy="32" r="7" fill="#E2C06E" stroke="none"/></svg>
  <h1>التحقق من هلوسة القرآن والحديث وتصحيحها</h1>
  <p class="tagline">تحقّق من آيات القرآن والأحاديث النبوية بالدليل</p>
  <p class="sub">يكتشف النظام الاقتباسات داخل أي نص، ويسترجع نصوصها من المصادر، ويقارنها كلمةً بكلمة، ثم يعرض الدليل.
     وإذا لم تكفِ الأدلة فلن يختلق تصحيحًا، بل يحيل الحالة إلى المراجعة البشرية.</p>
  <div class="flow"><span>كشف</span><i>‹</i><span>استرجاع</span><i>‹</i><span>محاذاة</span><i>‹</i><span>دليل</span><i>‹</i><span>قرار</span></div>
</div></div>

<div id="boot" class="panel boot" role="status">
  <div class="steps"><span class="step on" data-step="1">1 · Python runtime</span><span class="step" data-step="2">2 · Quran index</span><span class="step" data-step="3">3 · Hadith books</span></div>
  <div id="bootbar" class="progress indeterminate"><i></i></div>
</div>
<div class="tabs"><button class="tab active" data-tab="direct">تحقّق مباشر</button><button class="tab" data-tab="ask">اسأل ثم تحقّق</button></div>
<section id="tab-direct" class="form glass">
  <label for="text">النص المراد التحقق منه</label>
  <textarea id="text" placeholder="الصق هنا أي نص يتضمن آيات أو أحاديث، سواء كانت بين علامات تنصيص أو بدونها، ومع أي صياغة تمهيدية أو بدونها…"></textarea>
  <div class="engine-row">
    <label for="engine" class="en" style="margin:0">Detection model</label>
    <select id="engine" class="en">
      <option value="standard" data-hint="Rule-based detector with corpus matching. Runs fully in your browser.">Standard · Rules + Corpus</option>
      <option value="camelbert" data-hint="Fine-tuned CAMeLBERT-MSA token classifier (Hugging Face). Runs as a simulation until a model ID is set in config.js.">CAMeLBERT-MSA · Fine-tuned</option>
    </select>
    <span id="engine-hint" class="hint en"></span>
  </div>
  <div class="btns"><button id="verify" class="btn-main" disabled>تحقّق من النص</button><button id="example" class="btn-alt" disabled>جرّب مثالًا</button></div>
</section>
<section id="tab-ask" class="form glass" hidden>
  <div class="icv"><div class="notice">اكتب سؤالًا، وسيجيب ChatGPT، ثم يفحص النظام كل آية وحديث ورد في إجابته ويعرض الأخطاء والتصحيحات.</div></div>
  <label for="prompt">سؤالك</label>
  <textarea id="prompt" class="short" placeholder="اكتب سؤالك، مثل: اشرح لي فضل الصبر في القرآن والسنة مع ذكر الأدلة."></textarea>
  <div class="btns"><button id="ask" class="btn-main" disabled>اسأل ثم تحقّق</button></div>
</section>
<div id="status" role="status" aria-live="polite"></div>
<div id="results" class="results"></div>
<div id="export" class="export" hidden><button id="export-json" type="button">Export JSON (1A · 1B · 1C)</button><button id="export-tsv" type="button">Export TSV</button></div>
<div class="icv"><div class="disclaimer">أداة مساعدة للتدقيق النصي وليست فتوى ولا بديلًا عن المراجعة المتخصصة.
النتائج مبنية على مراجع القرآن الكريم والكتب الستة المضمّنة فقط.</div></div>
</div>
<div id="toast" role="status" aria-live="polite"></div>
<script src="config.js"></script>
<script src="cache.js"></script>
<script src="camelbert.js"></script>
<script src="app.js"></script>
</body>
</html>