/* «درب الطالب» — قاعة الحصّة.
   ملفّ مستقلّ ولا يُعدَّل app.css. والرموز مأخوذة منه كما هي — هويةٌ واحدة،
   مسطّحة: صفر تدرّج، صفر ظلّ ملوّن، حدّ 1px.

   لماذا قواعد أصلاً؟ لأن «ادخل القاعة» ليس زرّاً كبقيّة الأزرار: هو الفعل
   الوحيد في الصفحة وقتَ الحصّة، ويُضغط على جوالٍ وبعجلة. فيُعطى مساحته. */

/* `.btn.room-enter` لا `.room-enter` وحدها: صفحة الطالب تلفّ نفسها بـ.stu
   و`.stu .btn` تفرض 56px — والتخصيص لا الترتيب هو ما يحسم. */
.btn.room-enter{min-height:60px;font-size:18px;padding-inline:var(--sp-8);width:100%}
@media (min-width:640px){ .btn.room-enter{width:auto;min-width:260px} }

.room-gap{margin-top:var(--sp-4)}

/* زرٌّ معطّل وسببٌ تحته — لا يمين ولا يسار، فالسبب سطرٌ قائمٌ بذاته */
.room-closed{display:flex;flex-direction:column;gap:var(--sp-3);align-items:flex-start}
.room-why{color:var(--ink-2);font-size:15px;margin:0}

/* ── قائمة التسجيلات ──────────────────────────────────────────────────── */
.room-recs{display:flex;flex-direction:column;gap:var(--sp-3);margin:0;padding:0;list-style:none}
.room-rec{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;
  border:1px solid var(--line);border-radius:var(--r);padding:var(--sp-4);background:var(--canvas)}
.room-rec-meta{display:flex;gap:var(--sp-8);flex:1;flex-wrap:wrap}

/* ── مسرح القاعة داخل المنصّة ──────────────────────────────────────────
   🔑 الارتفاع بالحساب لا بنسبةٍ من الأب: الأب `main > .shell` بلا ارتفاعٍ
      محدّد، و`height:100%` داخل أبٍ تلقائيّ الارتفاع تساوي صفراً — فيظهر
      إطارٌ بلا محتوى ويُظنّ العطب في القاعة.
   🔑 و`dvh` قبل `vh`: شريط متصفّح الجوّال يقضم من `vh` فتُقصّ القاعة تحته. */
.room-stage{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:#000;height:calc(100vh - 260px);min-height:420px}
@supports (height:100dvh){ .room-stage{height:calc(100dvh - 260px)} }
.room-frame{display:block;width:100%;height:100%;border:0}

.room-stage-head{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;
  margin-bottom:var(--sp-4)}
.room-stage-title{margin:8px 0 0}

/* على الجوّال: الترويسة أضيق والقاعة تأخذ ما بقي */
@media (max-width:640px){
  .room-stage{height:calc(100vh - 300px);min-height:360px}
  @supports (height:100dvh){ .room-stage{height:calc(100dvh - 300px)} }
}

/* صفحة ما بعد الخروج — تُعرض داخل الإطار لحظةً قبل الخروج منه */
.room-left{text-align:center}

/* مسلك التبويب — حين لا تُضمَّن القاعة (راجع LessonRoom::embedRoom) */
.room-launch{text-align:center}
.room-launch-lead{margin:0 0 var(--sp-5);color:var(--ink-2)}
.room-launch .room-enter{margin-inline:auto}