
@font-face { font-family:Heebo; font-style:normal; font-weight:400;
  font-display:swap; src:url(/fonts/heebo-hebrew-400.woff2) format("woff2");
  unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family:Heebo; font-style:normal; font-weight:400;
  font-display:swap; src:url(/fonts/heebo-latin-400.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:Heebo; font-style:normal; font-weight:500;
  font-display:swap; src:url(/fonts/heebo-hebrew-500.woff2) format("woff2");
  unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family:Heebo; font-style:normal; font-weight:500;
  font-display:swap; src:url(/fonts/heebo-latin-500.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:Heebo; font-style:normal; font-weight:700;
  font-display:swap; src:url(/fonts/heebo-hebrew-700.woff2) format("woff2");
  unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family:Heebo; font-style:normal; font-weight:700;
  font-display:swap; src:url(/fonts/heebo-latin-700.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:Heebo; font-style:normal; font-weight:800;
  font-display:swap; src:url(/fonts/heebo-hebrew-800.woff2) format("woff2");
  unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family:Heebo; font-style:normal; font-weight:800;
  font-display:swap; src:url(/fonts/heebo-latin-800.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --paper:#FAF8F5;  --card:#FFFFFF;  --ink:#0A0A0A;   --muted:#6E675C;
  --line:#E7E1D6;   --accent:#8A6A18; --on-accent:#FFFFFF;
  --gold:#C9A84C;   --navy:#0A0A0A;  --tint:#F6EFDC;
  --warn:#8C3E22;   --warnbg:#F7E8E1;
}

/* מצב כהה. ⚠ כאן --accent בהיר, ולכן הטקסט שעליו חייב להיות כהה,
   וזה בדיוק מה שהטוקן --on-accent קיים בשבילו. */
@media (prefers-color-scheme: dark) {
  :root {
    --paper:#12110F; --card:#1C1A16; --ink:#F3EFE7;  --muted:#A0978A;
    --line:#2E2A23;  --accent:#E0C577; --on-accent:#1A1408;
    --gold:#C9A84C;  --navy:#000000;  --tint:#2A2418;
    --warn:#E0A184;  --warnbg:#2E1C15;
  }
}



* { box-sizing:border-box; }
body { direction:rtl; margin:0; background:var(--paper); color:var(--ink);
  font-family:Heebo,"Segoe UI",Arial,sans-serif; line-height:1.6; }
a { color:var(--accent); }
.wrap { max-width:980px; margin:0 auto; padding:0 1.4rem; }
.wrap.wide { max-width:1180px; }
.top { background:var(--navy); color:#fff; padding:.7rem 0; }
.top .wrap { display:flex; align-items:center; justify-content:space-between; }
.top a { color:#fff; text-decoration:none; }
.top .brand { font-weight:600; letter-spacing:.02em; }
.top nav a { margin-inline-start:1.1rem; font-size:.9rem; color:#C3BAAC; }
.top nav a:hover { color:#fff; }
main { padding-bottom:5rem; }
.head { padding:2.6rem 0 1.2rem; }
.head.narrow { max-width:34rem; }
.eyebrow { color:var(--accent); font-size:.78rem; letter-spacing:.09em;
  text-transform:uppercase; margin:0 0 .4rem; }
h1 { font-size:2.1rem; font-weight:600; margin:0 0 .5rem; letter-spacing:-.01em;
  text-wrap:balance; }
.sub { color:var(--muted); margin:0; max-width:60ch; }
.bar { height:6px; background:var(--line); border-radius:99px; margin-top:1.1rem;
  max-width:26rem; overflow:hidden; }
.bar i { display:block; height:100%; background:var(--accent); }

/* מודול מתקפל. פתוח רק זה שבו התלמיד נמצא — 49 שיעורים ועוד 32 בחנים
   פתוחים בבת אחת הם מסך שאי אפשר לקרוא. */
.mod { background:var(--card); border:1px solid var(--line); border-radius:16px;
  margin-bottom:.7rem; overflow:hidden; }
.mod > summary { display:flex; gap:.8rem; align-items:center; cursor:pointer;
  padding:.95rem 1.1rem; list-style:none; font-weight:600; }
.mod > summary::-webkit-details-marker { display:none; }
.mod > summary::after { content:'⌄'; color:var(--muted); transition:transform .15s; }
.mod[open] > summary::after { transform:rotate(180deg); }
.mod[open] > summary { border-bottom:1px solid var(--line); }
.mod .idx { font-size:.72rem; color:var(--accent); border:1px solid var(--accent);
  border-radius:99px; padding:.1rem .6rem; font-weight:500; white-space:nowrap; }
.mod .mtitle { flex:1; }
.mod .mprog { font-size:.8rem; color:var(--muted); font-weight:400;
  white-space:nowrap; font-variant-numeric:tabular-nums; }
.mod .mbar { width:4.5rem; height:5px; background:var(--line); border-radius:99px;
  overflow:hidden; flex:none; }
.mod .mbar i { display:block; height:100%; background:var(--accent); }
.mod.empty { display:flex; gap:.8rem; align-items:center; padding:.95rem 1.1rem;
  color:var(--muted); }
.mod.empty .mtitle { flex:1; }
.blurb { color:var(--muted); font-size:.86rem; margin:.9rem 1.1rem 0; }
.soon { color:var(--muted); font-size:.8rem; }
.list { display:grid; gap:.4rem; padding:.8rem 1.1rem 1.1rem; }

/* שורה אחת לשיעור, והבוחן שלו כתווית בקצה. */
.item { display:flex; gap:.4rem; align-items:stretch; }
.item .main { flex:1; display:flex; gap:.9rem; align-items:center; min-width:0;
  background:var(--paper); border:1px solid var(--line); border-radius:11px;
  padding:.65rem .9rem; text-decoration:none; color:var(--ink); }
.item .main:hover { border-color:var(--accent); }
.item.done .main { border-inline-start:3px solid var(--accent); }
.item .num { color:var(--muted); font-size:.82rem; min-width:1.4rem; flex:none;
  font-variant-numeric:tabular-nums; }
.item.done .num { color:var(--accent); }
.item .name { flex:1; font-weight:500; font-size:.95rem; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.item .meta { color:var(--muted); font-size:.76rem; white-space:nowrap; flex:none; }
.item .qchip { display:flex; align-items:center; padding:0 .9rem; flex:none;
  background:var(--tint); border:1px solid transparent; border-radius:11px;
  color:var(--accent); font-size:.8rem; text-decoration:none; white-space:nowrap; }
.item .qchip:hover { border-color:var(--accent); }
.pill { font-size:.7rem; border-radius:99px; padding:.1rem .55rem; white-space:nowrap; }
.pill.rec { background:var(--warnbg); color:var(--warn); }
.pill.ok { background:var(--tint); color:var(--accent); }

/* כתוביות. ⚠ הרוחב והמיקום נקבעים ב-VTT עצמו (size / align) ולא כאן,
   כי הדפדפן מתעלם מ-width ב-::cue. כאן רק גודל, צבע ורקע. */
::cue { font-size:.95rem; line-height:1.5; background:rgba(0,0,0,.82);
  color:#fff; }

/* עורך הכתוביות — מסך הניהול בלבד. */
#ccbox { margin:.6rem 0 0; padding:.7rem .8rem; background:var(--card);
  border:1px solid var(--accent); border-radius:12px; }
#cctext { width:100%; font:inherit; font-size:.95rem; padding:.5rem .6rem;
  border:1px solid var(--line); border-radius:8px; background:var(--paper);
  color:var(--ink); resize:vertical; }
#ccbox .ccbtns { display:flex; gap:.5rem; align-items:center; margin-top:.5rem; }
#ccbox button { font:inherit; font-size:.82rem; padding:.3rem .9rem; cursor:pointer;
  border-radius:99px; border:1px solid var(--line); background:var(--paper);
  color:var(--ink); }
#ccsave { background:var(--accent) !important; color:var(--on-accent) !important;
  border-color:var(--accent) !important; }
#ccmsg { font-size:.8rem; color:var(--muted); }

/* טופס דיווח טעות — נפתח מתחת לנגן, לכל תלמיד. */
#repbox { margin:.6rem 0 0; padding:.8rem .9rem; background:var(--card);
  border:1px solid var(--line); border-radius:12px; }
.rephead { margin:0 0 .5rem; font-size:.86rem; color:var(--muted); }
.repkind { display:flex; gap:1rem; margin-bottom:.55rem; flex-wrap:wrap; }
.repkind label { display:flex; align-items:center; gap:.35rem; font-size:.86rem;
  cursor:pointer; }
#reptext { width:100%; font:inherit; font-size:.95rem; padding:.5rem .6rem;
  border:1px solid var(--line); border-radius:8px; background:var(--paper);
  color:var(--ink); resize:vertical; }
#repbox .ccbtns { display:flex; gap:.5rem; align-items:center; margin-top:.5rem; }
#repbox button { font:inherit; font-size:.82rem; padding:.3rem .9rem; cursor:pointer;
  border-radius:99px; border:1px solid var(--line); background:var(--paper);
  color:var(--ink); }
#repsend { background:var(--accent) !important; color:var(--on-accent) !important;
  border-color:var(--accent) !important; }
#repmsg { font-size:.8rem; color:var(--muted); }

/* שיעור שמנגן הקלטה מהמחזור הקודם. */
/* שיעור שמאחד כמה הקלטות מהקורס המקורי. */
.clips { margin:1.4rem 0; }
.clipnote { margin:0 0 .9rem; padding:.55rem .8rem; font-size:.86rem;
  line-height:1.6; color:var(--muted); background:var(--card);
  border:1px solid var(--line); border-inline-start:3px solid var(--gold);
  border-radius:10px; }
.clip { margin-bottom:1.4rem; }
.cliphead { display:flex; align-items:baseline; gap:.6rem; margin:0 0 .45rem;
  font-size:.95rem; }
.cliphead span { font-size:.82rem; color:var(--muted); }
.clip .video { margin:0; }

.legacynote { margin:1.4rem 0 -.4rem; padding:.55rem .8rem; font-size:.86rem;
  line-height:1.6; color:var(--muted); background:var(--card);
  border:1px solid var(--line); border-inline-start:3px solid var(--gold);
  border-radius:10px; }

/* מסך דיווחי הטעויות בפאנל. */
.reps { display:grid; gap:.7rem; margin-top:1rem; }
.rep { padding:.8rem .9rem; border:1px solid var(--line); border-radius:12px;
  background:var(--card); }
.rtop { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
  font-size:.82rem; color:var(--muted); }
.rles { font-size:.95rem; font-weight:600; color:var(--accent);
  text-decoration:none; }
.rles:hover { text-decoration:underline; }
.rat { font-variant-numeric:tabular-nums; padding:.1rem .45rem;
  border:1px solid var(--line); border-radius:99px; }
.rkind { padding:.1rem .5rem; border-radius:99px; font-size:.76rem; }
.k-subs { background:#EDE6D3; color:#5A4A1E; }
.k-content { background:#E2E8EA; color:#274049; }
.rwhen { margin-inline-start:auto; }
.rnote { margin:.5rem 0 0; font-size:.95rem; }
.rcue { margin:.35rem 0 0; font-size:.85rem; color:var(--muted);
  border-inline-start:3px solid var(--line); padding-inline-start:.6rem; }
.racts, .rstat { margin-top:.6rem; display:flex; gap:.5rem; align-items:center;
  font-size:.82rem; color:var(--muted); }
.rdo { font:inherit; font-size:.82rem; padding:.28rem .85rem; cursor:pointer;
  border-radius:99px; border:1px solid var(--accent); background:var(--accent);
  color:var(--on-accent); }
.rdo.ghost { background:var(--paper); color:var(--ink); border-color:var(--line); }
.rdo[disabled] { opacity:.5; cursor:default; }
.adminnav { margin-top:1.4rem; font-size:.9rem; }

/* סימון "עברתי על הכתוביות" ברשימת ההקלטות. */
/* צירוף מסמך לבארי. */
.bclip { display:flex; align-items:center; justify-content:center; width:2.4rem;
  height:2.4rem; flex:0 0 auto; cursor:pointer; border-radius:99px;
  border:1px solid var(--line); background:var(--paper); font-size:1.05rem;
  line-height:1; user-select:none; }
.bclip:hover { border-color:var(--accent); }
.bfilerow { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap;
  margin:0; padding:0 1.2rem .9rem; font-size:.82rem; color:var(--muted); }
.bfilerow span { font-weight:600; color:var(--ink); }
.bfilerow button { font:inherit; font-size:.78rem; padding:.15rem .6rem; cursor:pointer;
  border-radius:99px; border:1px solid var(--line); background:var(--paper);
  color:var(--ink); }
.bfilerow em { font-style:normal; opacity:.85; }

/* מצגת שהתלמיד מתקדם בה בעצמו — בשיעור שאין לו הקלטה. */
.deck { margin:1.4rem 0; }
.deckimg { border-radius:16px; overflow:hidden; background:var(--navy);
  aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; }
.deckimg img { width:100%; height:100%; object-fit:contain; display:block; }
.deckbar { display:flex; align-items:center; justify-content:center; gap:1rem;
  margin-top:.8rem; }
.deckbar button { font:inherit; font-size:.9rem; padding:.4rem 1.1rem; cursor:pointer;
  border-radius:99px; border:1px solid var(--line); background:var(--paper);
  color:var(--ink); }
.deckbar button:hover:not([disabled]) { border-color:var(--accent); color:var(--accent); }
.deckbar button[disabled] { opacity:.35; cursor:default; }
#dkpos { font-size:.9rem; color:var(--muted); font-variant-numeric:tabular-nums;
  min-width:5rem; text-align:center; }
.deckhint { margin:.5rem 0 0; text-align:center; font-size:.8rem; color:var(--muted); }

/* תוצאות בחנים. */
.qtable { margin-top:1rem; border:1px solid var(--line); border-radius:14px;
  overflow:hidden; background:var(--card); }
.qrow { display:grid; grid-template-columns:minmax(0,1fr) repeat(4,auto);
  gap:.9rem; align-items:center; padding:.8rem 1rem;
  border-bottom:1px solid var(--line); font-size:.88rem; }
.qrow:last-child { border-bottom:0; }
/* ⚠ בוחן שנופלים בו מסומן. זו כל התועלת של המסך. */
.qrow.low { background:var(--tint); }
.qrow .nm { display:flex; flex-direction:column; min-width:0; font-size:.95rem; }
.qrow .nm .em { font-size:.75rem; color:var(--muted); }
.qrow .n { color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.qrow .n b { color:var(--ink); font-size:1rem; }
@media (max-width: 640px) {
  .qrow { grid-template-columns:minmax(0,1fr) auto; gap:.3rem .8rem; }
  .qrow .nm { grid-column:1 / -1; }
}

.vlegacy { font-size:.8rem; color:var(--muted); padding:.15rem .6rem;
  border:1px dashed var(--line); border-radius:99px; white-space:nowrap; }

.vrev { margin-inline-start:.5rem; font-size:.72rem; padding:.05rem .45rem;
  border-radius:99px; background:#E6EFE6; color:#2F5D34; white-space:nowrap; }

.video { margin:1.4rem 0; border-radius:16px; overflow:hidden; background:var(--navy);
  aspect-ratio:16/9; }
.video iframe { width:100%; height:100%; border:0; display:block; }
.video.pending { display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:.6rem; text-align:center; padding:2rem; color:#9E9689; }
.video.pending b { color:#D9BC63; font-weight:500; font-size:1.05rem; }
.video.pending span { font-size:.86rem; max-width:44ch; }

/* מסלול ההאזנה. שני כפתורים ונגן — בלי דרמה, כי זו העדפת תצוגה. */
.mediaswitch { display:flex; gap:.4rem; margin:1.4rem 0 -.6rem; justify-content:flex-end; }
.mediaswitch button { font:inherit; font-size:.84rem; padding:.34rem .8rem; cursor:pointer;
  border-radius:999px; border:1px solid #37322A; background:transparent; color:#9E9689;
  transition:background .15s, color .15s, border-color .15s; }
.mediaswitch button:hover { color:#EFE9DE; border-color:#4C463B; }
.mediaswitch button.on { background:#27231C; color:#D9BC63; border-color:#4C463B; }
.audio { margin:1.4rem 0; padding:1.6rem; border-radius:16px; background:var(--navy);
  display:flex; flex-direction:column; gap:.9rem; align-items:center; }
.audio audio { width:100%; max-width:34rem; }
.audio p { margin:0; font-size:.84rem; color:#9E9689; text-align:center; max-width:44ch; }

.doneform { margin:0 0 1rem; }
.doneform button { font:inherit; font-size:.9rem; cursor:pointer; border-radius:10px;
  padding:.5rem 1.2rem; border:1px solid var(--accent); }
.doneform .done { background:var(--accent); color:var(--on-accent); }
.doneform .undo { background:transparent; color:var(--accent); }

.slide { margin:1.9rem 0 0; }
.slide figcaption { display:flex; gap:.7rem; align-items:baseline; margin-bottom:.5rem; }
.slide .n { color:var(--accent); font-weight:600; min-width:1.4rem;
  font-variant-numeric:tabular-nums; }
.slide b { font-size:.97rem; }
.slide .kind { font-size:.7rem; color:var(--muted); border:1px solid var(--line);
  border-radius:99px; padding:.06rem .55rem; }
.slide.inter .kind { background:var(--tint); color:var(--accent); border-color:transparent; }
.slide img { width:100%; display:block; border-radius:10px; border:1px solid var(--line); }
.slide.inter img { border-color:var(--accent); }


.pager { display:flex; justify-content:space-between; gap:1rem; margin-top:2.5rem;
  padding-top:1.3rem; border-top:1px solid var(--line); font-size:.92rem; }

.card { background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:1.4rem; max-width:26rem; display:grid; gap:.9rem; }
.card label { display:grid; gap:.35rem; font-size:.88rem; color:var(--muted); }
.card input { font:inherit; padding:.6rem .8rem; border-radius:10px;
  border:1px solid var(--line); background:var(--paper); color:var(--ink); }
.card input.code { letter-spacing:.5em; text-align:center; font-size:1.2rem; }
.card button { font:inherit; background:var(--accent); color:var(--on-accent); border:0;
  border-radius:10px; padding:.6rem 1.2rem; cursor:pointer; }
.barri { margin:2.5rem 0 1rem; border:1px solid var(--line); border-radius:14px;
  background:var(--card); overflow:hidden; }
.barri header { display:flex; gap:.9rem; align-items:flex-start;
  padding:1.1rem 1.2rem; background:var(--tint); }
.barri header .b { font-size:1.6rem; line-height:1; }
.barri header b { display:block; font-size:1rem; }
.barri header p { margin:.2rem 0 0; font-size:.9rem; color:var(--muted); }
.chat { padding:1rem 1.2rem; display:flex; flex-direction:column; gap:.6rem;
  max-height:22rem; overflow-y:auto; }
/* ⚠ flex:0 0 auto הוא חובה, לא קישוט. הבועות הן פריטי פלקס בתוך מכל
   עם max-height, וברירת המחדל היא flex-shrink:1 — כלומר הן מתכווצות
   לגובה המכל במקום לגלול, והטקסט נחתך באמצע השורה.
   ⚠ הכללים מכוונים תחת .chat כי יש בלוק .msg שני לתצוגת השיחות
   בניהול (.convo), והוא מאוחר יותר בקובץ ולכן היה גובר כאן. */
.chat .msg { flex:0 0 auto; max-width:85%; padding:.6rem .9rem; border-radius:16px;
  font-size:.94rem; line-height:1.55; white-space:pre-wrap; }
.chat .msg.bot { background:var(--paper); align-self:flex-start; border:1px solid var(--line); }
.chat .msg.me { background:var(--accent); color:var(--on-accent); align-self:flex-end; }
.chat .msg.pending { opacity:.55; }
#bform { display:flex; gap:.5rem; padding:0 1.2rem 1rem; }
#bform input { flex:1; font:inherit; padding:.6rem .9rem; border-radius:11px;
  border:1px solid var(--line); background:var(--paper); color:var(--ink); }
#bform button { font:inherit; background:var(--accent); color:var(--on-accent); border:0;
  border-radius:11px; padding:.6rem 1.2rem; cursor:pointer; }
.quota { margin:0; padding:0 1.2rem 1rem; font-size:.8rem; color:var(--muted); }
.files { margin:2rem 0 1rem; }
.files h2 { font-size:1rem; color:var(--muted); font-weight:600; margin:0 0 .7rem; }
.file { display:flex; gap:.9rem; align-items:center; text-decoration:none; color:var(--ink);
  background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:.9rem 1.1rem; margin-bottom:.5rem; max-width:32rem; }
.file:hover { border-color:var(--accent); }
.file .ico { font-size:1.3rem; color:var(--accent); line-height:1; }
.file b { display:block; font-size:.98rem; }
.file .fmeta { display:block; font-size:.82rem; color:var(--muted); margin-top:.15rem; }
.note { background:var(--warnbg); color:var(--warn); border-radius:10px;
  padding:.7rem 1rem; max-width:26rem; font-size:.9rem; }
.note.err { background:#FBE9E9; color:#8A1F1F; }
.btn { display:inline-block; background:var(--accent); color:var(--on-accent); text-decoration:none;
  border-radius:10px; padding:.55rem 1.1rem; font-size:.95rem; }
.small { font-size:.85rem; color:var(--muted); }
.quizzes { display:grid; gap:.4rem; margin:.35rem 0 .55rem; padding-inline-start:2.2rem; }
.quizzes.orphans { padding-inline-start:0; margin-top:.8rem; }
.qlink { display:flex; gap:.7rem; align-items:center; text-decoration:none; color:var(--ink);
  background:var(--tint); border-radius:11px; padding:.55rem .95rem; font-size:.92rem; }
.qlink .qi { font-size:.7rem; color:var(--accent); border:1px solid var(--accent);
  border-radius:99px; padding:.05rem .5rem; }
.qlink .meta { margin-inline-start:auto; color:var(--muted); font-size:.78rem; }
.qlink:hover { outline:1px solid var(--accent); }

.q { border:1px solid var(--line); background:var(--card); border-radius:14px;
  padding:1.1rem 1.2rem; margin:0 0 .9rem; }
.q legend { font-weight:500; padding:0 .3rem; display:flex; gap:.6rem; }
.q legend .n { color:var(--accent); font-variant-numeric:tabular-nums; }
.opt { display:flex; gap:.6rem; align-items:flex-start; padding:.4rem .3rem;
  border-radius:7px; cursor:pointer; }
.opt:hover { background:var(--tint); }
.opt input { margin-top:.35rem; accent-color:var(--accent); }
.submit { font:inherit; background:var(--accent); color:var(--on-accent); border:0; border-radius:10px;
  padding:.65rem 1.6rem; cursor:pointer; margin-top:.5rem; }

.score { display:flex; gap:1rem; align-items:baseline; margin-top:1rem;
  background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:1rem 1.3rem; max-width:26rem; }
.score b { font-size:2rem; font-weight:600; }
.score.pass b { color:var(--accent); }
.score.fail b { color:var(--warn); }
.score span { color:var(--muted); font-size:.88rem; }
.res { border-inline-start:3px solid var(--line); padding:.6rem 1rem; margin:.7rem 0;
  background:var(--card); border-radius:0 11px 11px 0; }
.res.ok { border-color:var(--accent); }
.res.bad { border-color:var(--warn); }
.res .qp { margin:0 0 .35rem; font-weight:500; display:flex; gap:.6rem; }
.res .qp .n { color:var(--muted); }
.res .ans, .res .cor, .res .exp { margin:.15rem 0; font-size:.9rem; }
.res .ans { color:var(--muted); }
.res .cor { color:var(--accent); }
.res .exp { color:var(--muted); background:var(--paper); border-radius:7px;
  padding:.5rem .7rem; margin-top:.4rem; }
.again { margin-top:2rem; }

.foot { border-top:1px solid var(--line); padding:1.3rem 0; color:var(--muted);
  font-size:.85rem; }

/* ═══════════════════════════════════════════ נייד
   ⚠ עד 17/08/2026 לא הייתה כאן ולו נקודת שבירה אחת — ה-@media
   היחיד בקובץ היה למצב כהה. זה לא נראה בדסקטופ, ולכן לא התגלה.
   ⚠ ובפועל שורות השיעורים נחתכו מחוץ למסך: itemLeft היה -176,
   כלומר התלמיד ראה חצי שיעור.

   ⚠ הסיבה השורשית, וזו הראשונה שמתוקנת: ".list" הוא גריד בלי
   הגדרת עמודות, ולכן העמודה נמתחת ל-max-content של השורה
   הרחבה ביותר במקום לרוחב המכולה. minmax(0,1fr) כולא אותה.
   אותה תקלה חוזרת בכל גריד בקובץ, ולכן היא מטופלת בשורש. */
.list, .chks, .chans { grid-template-columns:minmax(0,1fr); }

@media (max-width: 640px) {
  /* ⚠ --gut הוא הריפוד של .wrap, והוא מה שהרכיבים שיוצאים לרוחב
     מלא מבטלים. עד כה הם ביטלו 1rem קבוע, וברוחב קטן מ-420px
     הריפוד יורד ל-.85rem — כלומר הם חרגו ב-2.4px לכל צד ויצרו
     גלילה אופקית זעירה. נמדד: scrollWidth 392 מול viewport 390. */
  :root { --gut:1rem; }
  .wrap { padding:0 var(--gut); }

  /* התפריט — שש לשוניות לא נכנסות בשורה אחת */
  .top .wrap { flex-wrap:wrap; gap:.4rem .9rem; }
  nav { display:flex; flex-wrap:wrap; gap:.5rem .9rem; font-size:.9rem; }

  /* ⚠ שורת שיעור: השם מקבל את כל הרוחב, והבוחן יורד לשורה משלו.
     עדיף מלכווץ הכול עד שאי אפשר ללחוץ. */
  .item { flex-wrap:wrap; }
  .item .main { flex:1 1 100%; }
  .item .qchip { flex:1 1 100%; justify-content:center; padding:.5rem; }
  .item .meta { display:none; }           /* "18 שקופיות" — לא קריטי בנייד */

  .mod .mhead { flex-wrap:wrap; gap:.4rem .8rem; }
  .mod .mbar { width:100%; order:9; }

  /* בארי — הצ׳אט צריך יותר גובה ופחות שוליים */
  .chat { padding:.9rem; max-height:60vh; }
  .chat .msg { max-width:92%; }
  #bform { padding:0 .9rem .9rem; flex-wrap:wrap; }
  #bform input { flex:1 1 100%; }
  #bform button { flex:1 1 100%; }
  .barri header { padding:.9rem; }

  /* ⚠ כפתורים בגודל אצבע. פחות מ-44px זה החטאה. */
  .submit, .done, .undo, .go, #bform button { min-height:44px; }

  .files .file { padding:.8rem .9rem; }
  .slide { flex-direction:column; gap:.4rem; }
  .video { border-radius:0; margin-inline:calc(-1 * var(--gut)); }   /* לרוחב מלא */

  /* טבלאות תוכן — גלילה בתוך עצמן, לא בעמוד */
  .head h1 { font-size:1.5rem; }
  table { display:block; overflow-x:auto; }
}

/* ═══ נייד — הרכיבים שנוספו ב-28/08/2026.
   ⚠ כולם נבנו ונבדקו בדסקטופ בלבד, וברוחב טלפון שורת הכפתורים
   של הנגן היא חמישה פריטים בשורה אחת: היא גולשת מהמסך, ובעברית
   דווקא הכפתור הראשון הוא זה שנעלם. */
@media (max-width: 640px) {
  /* שורת הכפתורים: נשברת לשורות, וכל כפתור בגודל אצבע */
  .mediaswitch { flex-wrap:wrap; justify-content:flex-start; gap:.4rem; }
  .mediaswitch button { min-height:38px; }

  /* עורך הכתוביות וטופס הדיווח */
  #ccbox, #repbox { margin-inline:0; padding:.7rem; }
  #ccbox .ccbtns, #repbox .ccbtns { flex-wrap:wrap; }
  #ccbox button, #repbox button { min-height:38px; }
  .repkind { gap:.5rem; }
  .repkind label { flex:1 1 100%; }

  /* נגן השקופיות — לרוחב מלא, כמו הווידאו */
  .deckimg { border-radius:0; margin-inline:calc(-1 * var(--gut)); }
  .deckbar { gap:.5rem; }
  .deckbar button { flex:1 1 0; min-height:44px; padding:.4rem .5rem; }
  #dkpos { min-width:auto; flex:0 0 auto; }

  /* כמה הקלטות בשיעור אחד */
  .cliphead { flex-wrap:wrap; gap:.15rem .6rem; }

  /* בארי — האטב נשאר בשורת הכתיבה ולא תופס שורה שלמה */
  #bform { flex-wrap:wrap; }
  .bclip { flex:0 0 auto; order:1; }
  #bform input { flex:1 1 auto; order:2; width:auto; }
  #bform button { flex:1 1 100%; order:3; }
  .bfilerow { padding:0 .9rem .9rem; }

  /* מסך הדיווחים בפאנל */
  .rtop { gap:.35rem .5rem; }
  .rwhen { margin-inline-start:0; flex:1 1 100%; }
  .racts, .rstat { flex-wrap:wrap; }
  .rdo { min-height:38px; }
}

@media (max-width: 420px) {
  :root { --gut:.85rem; }
  body { font-size:15.5px; }
}

.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));
  gap:.7rem; margin:1.5rem 0; }
.card2 { background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:1rem 1.1rem; }
.card2 b { display:block; font-size:1.5rem; font-variant-numeric:tabular-nums; }
.card2 span { display:block; font-size:.85rem; color:var(--muted); margin-top:.15rem; }
.card2 i { display:block; font-size:.75rem; color:var(--muted); opacity:.75; font-style:normal; }
/* כותרות שתי הרשימות — גישה מלאה, ובלי. */
.ssec { font-size:1.05rem; margin:1.9rem 0 .15rem; display:flex; align-items:center; gap:.55rem; }
.scount { font-size:.78rem; font-weight:600; color:var(--muted); background:var(--paper);
  border:1px solid var(--line); border-radius:999px; padding:.08rem .55rem;
  font-variant-numeric:tabular-nums; }
.ssub { font-size:.83rem; color:var(--muted); margin:0 0 .7rem; }
/* ═══ נייד. ⚠ טבלת התלמידים היא שש עמודות בגריד קבוע, וברוחב
   של טלפון היא נשברת לגמרי. בנייד היא הופכת לכרטיס לכל תלמיד:
   שם ומייל למעלה, והמספרים מתחתיו כשורה אחת עם תוויות. */
@media (max-width: 720px) {
  .shead { display:none; }
  .srow { grid-template-columns:1fr auto; gap:.35rem .7rem; padding:.9rem 1rem;
    align-items:start; }
  .srow .nm { grid-column:1; }
  .srow .st { grid-column:2; justify-self:end; }
  .srow .pr { grid-column:1 / -1; display:flex; align-items:center; gap:.6rem; }
  .srow .n { grid-column:auto; font-size:.8rem; color:var(--muted); }
  .srow .n::after { content:""; }
  .cards { grid-template-columns:repeat(2,1fr); }
  .card2 b { font-size:1.25rem; }
  .acts { display:flex; flex-direction:column; gap:.6rem; }
  .acts button { width:100%; min-height:44px; }
  .chan { padding:.85rem; }
  .details input, .details textarea, .details button { min-height:44px; }
}

/* האזור האישי — מה נשאר לתעודה */
.chks { list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.chk { display:flex; align-items:center; gap:.9rem; background:var(--card);
  border:1px solid var(--line); border-radius:14px; padding:.85rem 1rem; }
.chk .mark { width:1.5rem; height:1.5rem; flex:none; border-radius:50%;
  border:1.5px solid var(--line); display:grid; place-items:center;
  font-size:.85rem; color:#fff; }
.chk.on .mark { background:var(--accent); border-color:var(--accent); }
.chk b { display:block; }
.chk .fh { display:block; font-size:.8rem; color:var(--muted); }
.chk .go { margin-inline-start:auto; white-space:nowrap; font-size:.87rem; }
.pbar.big { display:block; height:.5rem; margin:.5rem 0 .3rem; }
.okcard { border-color:var(--accent); }
/* בחירת ערוץ הכניסה */
.chans { display:grid; gap:.6rem; }
.chan { display:flex; align-items:center; gap:.9rem; text-align:right; width:100%;
  background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:.9rem 1rem; cursor:pointer; color:var(--ink); font:inherit; }
.chan:hover { border-color:var(--accent); background:var(--paper); }
.chan .ci { font-size:1.5rem; line-height:1; }
.chan b { display:block; }
.chan .fh { display:block; font-size:.8rem; color:var(--muted); }

/* ⚠ הכפתורים האלה יושבים בתוך form.card, ולכן הכלל הכללי
   '.card button' צבע אותם בזהב עם טקסט לבן — בלי שאיש התכוון.
   שורת ההסבר נשארה בצבע הטקסט המשני, אפור כהה על זהב, ולא
   הייתה קריאה בכלל. נמדד בטלפון של יוליה, 28/08/2026.
   כאן ההכרעה מפורשת: הכפתור נשאר כרטיס בהיר, כמו שתוכנן. */
.chans .chan { background:var(--card); color:var(--ink);
  border:1px solid var(--line); }
.chans .chan .fh { color:var(--muted); }
.chans .chan:hover { background:var(--paper); border-color:var(--accent); }
.stable { background:var(--card); border:1px solid var(--line); border-radius:16px;
  overflow:hidden; }
.shead, .srow { display:grid; grid-template-columns:2.2fr .8fr 1.4fr .8fr .8fr .7fr;
  gap:.8rem; align-items:center; padding:.75rem 1.1rem; }
.shead { background:var(--paper); font-size:.78rem; color:var(--muted); font-weight:600; }
.srow { border-top:1px solid var(--line); text-decoration:none; color:var(--ink); font-size:.9rem; }
.srow:hover { background:var(--paper); }
.srow .nm { display:flex; flex-direction:column; min-width:0; }
.srow .em { font-size:.76rem; color:var(--muted); overflow:hidden; text-overflow:ellipsis; }
.srow .st { font-size:.76rem; color:var(--muted); }
.srow .st.ok { color:var(--accent); }
.srow .pr { display:flex; gap:.5rem; align-items:center; }
.pbar { flex:1; height:5px; background:var(--line); border-radius:99px; overflow:hidden; }
.pbar i { display:block; height:100%; background:var(--accent); }
.srow .pn, .srow .n { font-size:.78rem; color:var(--muted);
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.srow .money { color:var(--ink); }
.adminnav { margin:1rem 0; font-size:.88rem; }
.ablock { margin:1.8rem 0; }
.ablock h2 { font-size:1rem; margin:0 0 .7rem; }
.prof { background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:1rem 1.1rem; white-space:pre-wrap; font:inherit; font-size:.9rem;
  line-height:1.6; margin:0 0 .6rem; }
.inline { display:inline; }
.inline button { font:inherit; font-size:.82rem; background:var(--paper);
  border:1px solid var(--line); border-radius:10px; padding:.4rem .9rem; cursor:pointer;
  color:var(--ink); }
.inline button.danger { color:#8A1F1F; }
.inline button:hover { border-color:var(--accent); }
.usage { margin:0 0 .6rem; font-size:.9rem; }
.qrow { display:flex; gap:.9rem; align-items:center; background:var(--card);
  border:1px solid var(--line); border-radius:11px; padding:.6rem .9rem;
  margin-bottom:.35rem; font-size:.9rem; }
.qrow > span:first-child { flex:1; }
.qrow.pass { border-inline-start:3px solid var(--accent); }
.qrow.fail { border-inline-start:3px solid #C4703A; }
.chips { display:flex; flex-wrap:wrap; gap:.35rem; }
.chip { background:var(--tint); border-radius:99px; padding:.25rem .8rem; font-size:.8rem; }
.achat { display:grid; gap:.5rem; }
.am { background:var(--card); border:1px solid var(--line); border-radius:10px;
  padding:.6rem .9rem; }
.am.user { background:var(--tint); border-color:transparent; }
.am .who { font-size:.72rem; color:var(--accent); font-weight:600; }
.am .ctx { font-size:.72rem; color:var(--muted); margin-inline-start:.5rem; }
.am p { margin:.25rem 0 0; font-size:.9rem; line-height:1.55; white-space:pre-wrap; }

/* ⚠ .stable מוגדר לשש עמודות, לפי טבלת התלמידים. כל טבלה אחרת
   חייבת להצהיר על מספר העמודות שלה, אחרת התוכן נופל תחת כותרת
   של עמודה אחרת ונראה כאילו הנתונים התערבבו. */
.stable.t2 .shead, .stable.t2 .srow { grid-template-columns:1fr auto; }
.stable.t3 .shead, .stable.t3 .srow { grid-template-columns:minmax(0,1fr) auto auto; }
.stable.t4 .shead, .stable.t4 .srow { grid-template-columns:minmax(0,1fr) auto auto auto; }
.stable.pages .shead, .stable.pages .srow {
  grid-template-columns:minmax(0,2fr) auto auto auto auto; }

/* ── שאר מסכי הפאנל, כרטיסי כניסה מהדף הראשי */
.desks { display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
  gap:.7rem; margin:1.6rem 0 .4rem; }
.desk { display:block; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:.95rem 1.1rem; color:var(--ink); text-decoration:none; }
.desk:hover { border-color:var(--accent); }
.desk b { display:block; font-size:1rem; }
.desk span { display:block; font-size:.82rem; color:var(--muted); margin-top:.2rem; }

/* ── לידים */
.tabs { display:flex; flex-wrap:wrap; gap:.4rem; margin:1.4rem 0 .9rem; }
.tab { padding:.4rem .8rem; border:1px solid var(--line); border-radius:999px;
  font-size:.85rem; color:var(--muted); text-decoration:none; background:var(--card); }
.tab i { font-style:normal; opacity:.7; font-variant-numeric:tabular-nums; }
.tab.on { border-color:var(--accent); color:var(--accent); }

.leads { display:grid; gap:.5rem; }
.lead { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto auto;
  gap:.6rem 1rem; align-items:center; background:var(--card);
  border:1px solid var(--line); border-radius:14px; padding:.8rem 1rem; }
.lead .who b { display:block; }
.lead .who span { font-size:.85rem; color:var(--muted); }
.lead .who a { color:var(--muted); text-decoration:none; }
.lead .who a:hover { color:var(--accent); }
.lead .from .pg { font-size:.85rem; }
.lead .from i { display:block; font-size:.75rem; color:var(--muted); font-style:normal; }
.lead .from i.old { color:var(--gold); }
.lead .when { font-size:.82rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.setst { display:flex; gap:.25rem; flex-wrap:wrap; }
.setst button { font:inherit; font-size:.75rem; padding:.3rem .55rem; cursor:pointer;
  border:1px solid var(--line); border-radius:999px; background:transparent;
  color:var(--muted); }
.setst button:hover { border-color:var(--accent); color:var(--accent); }
.setst button.on { background:var(--accent); border-color:var(--accent); color:var(--on-accent); }

/* ── כרטיס הליד ויומן הטיפול */
.lead .who b a { color:var(--ink); text-decoration:none; }
.lead .who b a:hover { color:var(--accent); text-decoration:underline; }
.lead .who .nb { display:block; font-size:.72rem; font-style:normal; color:var(--gold); }

.leadwa { margin:0 0 1.1rem; }
.leadwa a { font-size:.88rem; color:var(--accent); text-decoration:none; }
.leadwa a:hover { text-decoration:underline; }

.leadmeta { display:flex; flex-wrap:wrap; gap:.6rem; margin:0 0 .6rem; }
.leadmeta span { border:1px solid var(--line); border-radius:12px; padding:.45rem .75rem;
  background:var(--card); font-size:.85rem; }
.leadmeta i { display:block; font-style:normal; font-size:.7rem; color:var(--muted); }

.log { list-style:none; margin:.9rem 0 1.6rem; padding:0; display:grid; gap:.6rem; }
.log li { border:1px solid var(--line); border-radius:14px; padding:.75rem .95rem;
  background:var(--card); border-inline-start:3px solid var(--accent); }
.log .lhead { display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem; }
.log .lhead b { font-size:.9rem; }
.log .lhead span { font-size:.8rem; color:var(--muted); }
.log .lhead time { margin-inline-start:auto; font-size:.75rem; color:var(--muted);
  font-variant-numeric:tabular-nums; }
.log p { margin:.4rem 0 0; line-height:1.65; }

.notef { display:grid; gap:.7rem; border:1px solid var(--line); border-radius:16px;
  padding:1rem; background:var(--paper); max-width:44rem; }
.notef label { display:grid; gap:.3rem; font-size:.85rem; color:var(--muted); }
.notef .nrow { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
.notef select, .notef input, .notef textarea { font:inherit; padding:.55rem .7rem;
  border-radius:11px; border:1px solid var(--line); background:var(--card);
  color:var(--ink); width:100%; }
.notef textarea { resize:vertical; line-height:1.6; }
.notef .save { justify-self:start; font:inherit; padding:.55rem 1.3rem; cursor:pointer;
  border-radius:11px; border:1px solid var(--accent); background:var(--accent);
  color:var(--on-accent); font-weight:600; }
@media (max-width:640px) { .notef .nrow { grid-template-columns:1fr; } }

/* ── שיחות בארי */
.qbar { display:flex; gap:.5rem; margin:1.3rem 0; align-items:center; }
.qbar input { flex:1 1 18rem; font:inherit; padding:.55rem .8rem; border-radius:11px;
  border:1px solid var(--line); background:var(--card); color:var(--ink); }
.qbar button { font:inherit; padding:.55rem 1.1rem; border-radius:11px; cursor:pointer;
  border:1px solid var(--accent); background:var(--accent); color:var(--on-accent); }
.qbar .clear { font-size:.85rem; color:var(--muted); }

.convo { display:grid; gap:.7rem; margin:1.4rem 0; }
.convo .msg { border:1px solid var(--line); border-radius:16px; padding:.8rem 1rem;
  background:var(--card); max-width:min(46rem,100%); }
.convo .msg.them { background:var(--paper); margin-inline-start:auto; }
.convo .msg.barri { border-inline-start:3px solid var(--accent); }
.convo .msg .rl { font-size:.72rem; color:var(--muted); letter-spacing:.03em; }
.convo .msg p { margin:.3rem 0 0; line-height:1.6; }
.convo .msg time { display:block; font-size:.72rem; color:var(--muted); margin-top:.4rem; }

/* ── הסבר החיבור בדף הנחיתה */
.note { background:var(--tint); border-radius:16px; padding:1rem 1.2rem;
  margin:1.8rem 0; font-size:.9rem; }
.note b { display:block; margin-bottom:.3rem; }
.note p { margin:0; line-height:1.7; }
.note code { background:var(--card); border-radius:6px; padding:.1rem .4rem;
  font-size:.85em; word-break:break-all; }

@media (max-width: 720px) {
  .lead { grid-template-columns:minmax(0,1fr); }
  .lead .when { font-size:.78rem; }
  .setst button { min-height:36px; }
}

/* ══════════════════════════════════════════════════ זהות
   ⚠ הבלוק הזה יושב בסוף בכוונה. כשהוא היה בראש הקובץ, כללים
   מאוחרים יותר עם אותה ספציפיות ניצחו אותו והכותרות נשארו 600.
   באתר הן 800, וזה מה שנותן לו את המראה שלו. */
h1, h2, h3 { font-weight:800; letter-spacing:-.015em; }
.brand { font-weight:800; letter-spacing:-.01em; }

/* האתר לא משתמש בצללים בכלל, רק בקווי שיער. */
.card, .card2, .desk, .lead, .stable, .mod { box-shadow:none; }


/* ── מסך ההקלטות */
.vtable .shead, .vtable .vrow {
  display:grid; grid-template-columns:minmax(0,1fr) 11rem 11rem 9rem;
  gap:.6rem 1rem; align-items:center; padding:.7rem 1.1rem;
  border-bottom:1px solid var(--line); }
.vtable .vrow:last-child { border-bottom:0; }
.vrow .nm { display:flex; flex-direction:column; min-width:0; }
.vrow .nm .em { font-size:.75rem; color:var(--muted); }
.vup { display:inline-block; cursor:pointer; font-size:.8rem; padding:.35rem .8rem;
  border:1px dashed var(--line); border-radius:999px; color:var(--muted); }
.vup:hover { border-color:var(--accent); color:var(--accent); border-style:solid; }
.vok { font-size:.8rem; color:var(--accent); display:inline-flex; gap:.5rem;
  align-items:center; font-variant-numeric:tabular-nums; }
.vdel { font:inherit; font-size:.72rem; background:none; border:0; cursor:pointer;
  color:var(--muted); text-decoration:underline; padding:0; }
.vdel:hover { color:var(--warn); }
.vdl { font-size:.72rem; color:var(--muted); text-decoration:underline;
  white-space:nowrap; }
.vdl:hover { color:var(--accent); }
/* מודול מתקפל. summary הוא הכותרת, והחץ מסתובב כשפותחים. */
.vmod > summary { cursor:pointer; list-style:none; user-select:none; }
.vmod > summary::-webkit-details-marker { display:none; }
.vmod > summary::before { content:'▸'; color:var(--muted); font-size:.85rem;
  transition:transform .15s; display:inline-block; }
.vmod[open] > summary::before { transform:rotate(-90deg); }
.vmod > summary:hover { background:var(--line); }
.vgrp { display:flex; align-items:baseline; gap:.7rem; padding:.85rem 1.1rem .6rem;
  background:var(--tint); border-bottom:1px solid var(--line);
  border-top:1px solid var(--line); }
.vgrp:first-child { border-top:0; }
.vgrp .gk { font-weight:700; font-size:.9rem; }
.vgrp .gt { color:var(--muted); font-size:.85rem; flex:1; min-width:0; }
.vgrp .gc { font-size:.8rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.vgrp.full .gc { color:var(--accent); font-weight:700; }
.vbar { position:relative; display:block; height:1.15rem; }
.vbar i { display:block; height:4px; width:0; background:var(--gold);
  border-radius:999px; transition:width .2s; }
.vbar b { display:block; font-size:.7rem; color:var(--muted); font-weight:400; }
.vbar.busy b { color:var(--gold); }
.vbar.ok i { background:var(--accent); }
.vbar.ok b { color:var(--accent); }
.vbar.err i { background:var(--warn); }
.vbar.err b { color:var(--warn); }
.vrow.drag { background:var(--tint); }
/* ⚠ height:100% ו-contain, ולא height:auto.
   המכל הוא aspect-ratio 16/9, ו-height:auto נתן לסרטון לקבוע את
   הגובה בעצמו — כלומר הקלטה שאינה בדיוק 16:9 (וכאלה הן ההקלטות
   מהקורס המקורי) נחתכה או יצרה שטח שחור ארוך מתחת לנגן. */
.video video { display:block; width:100%; height:100%; object-fit:contain;
  background:#000; }

@media (max-width: 720px) {
  .vtable .shead { display:none; }
  .vtable .vrow { grid-template-columns:minmax(0,1fr) auto; }
  .vrow .vbar { grid-column:1 / -1; }
}
.vok .slow { color:var(--warn); font-weight:400; font-size:.72rem; }


/* צ׳יפים לפתיחת שיחה בכלים של בארי */
.starters { display:flex; flex-wrap:wrap; gap:.4rem; padding:0 .9rem .9rem; }
.starter { font:inherit; font-size:.82rem; padding:.35rem .8rem; cursor:pointer;
  border:1px solid var(--line); border-radius:999px; background:var(--card);
  color:var(--muted); }
.starter:hover { border-color:var(--accent); color:var(--accent); }
.quota { font-size:.82rem; color:var(--muted); margin-top:.6rem; }


/* ציון הבוחן בשורת השיעור */
.qchip.scored { font-variant-numeric:tabular-nums; }
.qchip.scored.pass { border-color:var(--accent); color:var(--accent); }
.qchip.scored.fail { border-color:var(--warn); color:var(--warn); }


/* ── קופונים */
.newcoup { display:flex; flex-wrap:wrap; gap:.7rem 1rem; align-items:flex-end;
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:1.1rem 1.2rem; margin:.9rem 0 1.6rem; }
.newcoup label { display:flex; flex-direction:column; gap:.25rem; font-size:.8rem;
  color:var(--muted); flex:1 1 8rem; }
.newcoup input, .newcoup select { font:inherit; font-size:.92rem; padding:.45rem .6rem;
  border:1px solid var(--line); border-radius:10px; background:var(--paper);
  color:var(--ink); }
.newcoup button { font:inherit; padding:.55rem 1.3rem; border-radius:10px; cursor:pointer;
  border:1px solid var(--accent); background:var(--accent); color:var(--on-accent); }

.coups { display:grid; gap:.5rem; }
.coup { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto auto auto;
  gap:.5rem 1rem; align-items:center; background:var(--card);
  border:1px solid var(--line); border-radius:14px; padding:.8rem 1rem; }
.coup .cc b { font-size:1.05rem; letter-spacing:.04em; }
.cst { font-size:.72rem; margin-inline-start:.5rem; padding:.1rem .5rem;
  border-radius:999px; }
.cst.on { background:var(--tint); color:var(--accent); }
.cst.off { background:var(--paper); color:var(--muted); }
.coup .cv { font-size:.92rem; }
.coup .cv i { display:block; font-size:.75rem; color:var(--muted); font-style:normal; }
.coup .cu, .coup .cx { font-size:.8rem; color:var(--muted);
  font-variant-numeric:tabular-nums; }
.setst button.danger { color:var(--warn); }

@media (max-width: 720px) {
  .coup { grid-template-columns:minmax(0,1fr); }
  .newcoup label { flex:1 1 100%; }
}

