/* الصفحة الرئيسية على الشاشات التي لا يغطّيها home.mobile.css: الجوال بالعرض، والشاشات الكبيرة جدًّا (تلفاز وشاشة 4K).
   الجوال بالطول والآيباد والحاسب لا يتغيّرون: كلُّ قاعدةٍ هنا تحت شرطٍ لا يقع عليهم.

   1) الجوال بالعرض (ارتفاعٌ أقلّ من 520 بكسل): كانت الطرفية وسجلّ المشهد وسطر الكتابة والرادار تتراكب، والروابط
      القانونية فوق شارة «SEALED EVIDENCE». هنا تصغر القطع بنسبة واحدة ويأخذ كلٌّ ركنه:
        - أعلى اليسار: الطرفية الصغيرة تحت الهيدر.   - أسفل اليسار: سجلّ المشهد (أحدث أربعة أسطر).
        - أسفل اليمين: الرادار وشارته.               - أسفل الوسط: سطر الكتابة، وتحته «أنت داخل عين الفحص».
        - الروابط القانونية في قائمة الطرفية ([2] و[3]) كما على الجوال بالطول.
   2) الشاشات الكبيرة جدًّا (عرضٌ من 2200 بكسل وارتفاعٌ من 1200): القطع مرسومةٌ بالبكسل فتصغر على التلفاز حتى لا
      تُقرأ؛ فتُكبَّر كلُّها بنسبةٍ واحدة (zoom) ويبقى المشهد والدرون كما هما. */

@media (orientation: landscape) and (max-height: 520px) {
  .qs-refined-header { zoom: 0.78; }
  .qs-live-badge { zoom: 0.8; }
  #root .absolute.top-0.left-0.p-4.pointer-events-none,
  #root .absolute.top-0.right-0.p-4.pointer-events-none { zoom: 0.72; }

  .qs-info-teaser {
    zoom: 0.72;
    top: 96px;
    left: 16px;
  }

  #root .absolute.bottom-0.left-0.p-4.pointer-events-none {
    zoom: 0.75;
    padding: 10px;
  }
  #root .absolute.bottom-0.left-0.p-4.pointer-events-none .font-mono > div:nth-child(n + 5) {
    display: none;
  }

  #root .absolute.bottom-0.right-0.p-4.pointer-events-none {
    zoom: 0.7;
    padding: 12px;
  }

  #terminalSide.terminal-side {
    bottom: 46px;
    bottom: calc(46px + 100vh - 100dvh);
    max-width: min(460px, calc(100vw - 360px));
    padding: 6px 12px;
  }
  #terminalSide .terminal-line {
    font-size: 12px;
    white-space: normal;
    gap: 6px;
  }
  #terminalSide .terminal-cursor {
    width: 6px;
    height: 14px;
  }
}

/* أقصر الجوالات بالعرض (أضيق من 700 بكسل، مثل iPhone SE): سطر الكتابة بخطّ 11 ليبقى في سطرين على الأكثر. */
@media (orientation: landscape) and (max-height: 520px) and (max-width: 699px) {
  #terminalSide .terminal-line {
    font-size: 11px;
  }

  #root .absolute.bottom-\[12px\].pointer-events-none {
    zoom: 0.72;
    bottom: 10px;
    bottom: calc(10px + 100vh - 100dvh);
  }

  .qs-legal-links { display: none; }
}

@media (min-width: 2200px) and (min-height: 1200px) {
  .qs-refined-header,
  .qs-live-badge,
  .qs-info-teaser,
  .qs-legal-links,
  #terminalSide.terminal-side,
  #root .absolute.top-0.left-0.p-4.pointer-events-none,
  #root .absolute.top-0.right-0.p-4.pointer-events-none,
  #root .absolute.bottom-0.left-0.p-4.pointer-events-none,
  #root .absolute.bottom-0.right-0.p-4.pointer-events-none,
  #root .absolute.bottom-\[12px\].pointer-events-none,
  #root .absolute.top-\[46\%\].pointer-events-none {
    zoom: 1.4;
  }
}

@media (min-width: 3200px) and (min-height: 1800px) {
  .qs-refined-header,
  .qs-live-badge,
  .qs-info-teaser,
  .qs-legal-links,
  #terminalSide.terminal-side,
  #root .absolute.top-0.left-0.p-4.pointer-events-none,
  #root .absolute.top-0.right-0.p-4.pointer-events-none,
  #root .absolute.bottom-0.left-0.p-4.pointer-events-none,
  #root .absolute.bottom-0.right-0.p-4.pointer-events-none,
  #root .absolute.bottom-\[12px\].pointer-events-none,
  #root .absolute.top-\[46\%\].pointer-events-none {
    zoom: 2;
  }
}
