:root {
  --navy: #2f3c66;
  --navy-dark: #232d4f;
  --navy-light: #eef1f8;
  --accent: #c8a24b;
  --green: #2e7d52;
  --red: #b3403a;
  --amber-bg: #fff7e0;
  --amber-border: #e8c979;
  --text: #26293a;
  --muted: #6b7186;
  --border: #e3e6ef;
  --card-shadow: 0 2px 10px rgba(47, 60, 102, 0.08);
  --radius: 14px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Heebo', sans-serif;
  background: #f7f8fc;
  color: var(--text);
  min-height: 100vh;
  line-height: 1.6;
}

.hidden { display: none !important; }

/* ---------- באנר תצוגת תלמיד ---------- */
#student-view-banner {
  background: var(--amber-bg);
  border-bottom: 2px solid var(--amber-border);
  color: #7a5c12;
  text-align: center;
  padding: 8px 16px;
  font-weight: 600;
  position: sticky;
  top: 0;
  z-index: 60;
}
#student-view-banner button {
  background: none; border: none; color: var(--navy);
  font: inherit; font-weight: 700; cursor: pointer; text-decoration: underline;
}

/* ---------- סרגל עליון ---------- */
#topbar {
  background: #fff;
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 50;
}
.topbar-inner {
  max-width: 1100px; margin: 0 auto; padding: 10px 20px;
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
}
.brand { font-family: 'Frank Ruhl Libre', serif; font-size: 1.35rem; font-weight: 700; color: var(--navy); }
#main-nav { display: flex; gap: 4px; flex: 1; }
#main-nav a {
  color: var(--muted); text-decoration: none; padding: 6px 14px;
  border-radius: 999px; font-weight: 500; font-size: 0.95rem;
}
#main-nav a.active, #main-nav a:hover { background: var(--navy-light); color: var(--navy); }
.user-area { display: flex; align-items: center; gap: 12px; font-size: 0.88rem; color: var(--muted); }
#user-name { font-weight: 600; color: var(--navy); }
.link-btn { background: none; border: none; color: var(--muted); cursor: pointer; font: inherit; text-decoration: underline; }

main { max-width: 1100px; margin: 0 auto; padding: 28px 20px 80px; }

/* ---------- כרטיסים ---------- */
.card {
  background: #fff; border-radius: var(--radius); box-shadow: var(--card-shadow);
  padding: 22px 24px; margin-bottom: 18px; border: 1px solid var(--border);
}
h1 { font-family: 'Frank Ruhl Libre', serif; color: var(--navy); font-size: 1.7rem; margin-bottom: 6px; }
h2 { font-family: 'Frank Ruhl Libre', serif; color: var(--navy); font-size: 1.25rem; margin-bottom: 10px; }
h3 { color: var(--navy); font-size: 1.05rem; margin-bottom: 6px; }
.subtitle { color: var(--muted); margin-bottom: 18px; }

/* ---------- כניסה ---------- */
.login-wrap { max-width: 420px; margin: 8vh auto 0; }
.login-logo { text-align: center; font-family: 'Frank Ruhl Libre', serif; font-size: 2.2rem; color: var(--navy); font-weight: 700; margin-bottom: 4px; }
.login-sub { text-align: center; color: var(--muted); margin-bottom: 24px; }
.tabs { display: flex; border-bottom: 2px solid var(--border); margin-bottom: 18px; }
.tabs button {
  flex: 1; background: none; border: none; padding: 10px; font: inherit; font-weight: 600;
  color: var(--muted); cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -2px;
}
.tabs button.active { color: var(--navy); border-bottom-color: var(--navy); }

label { display: block; font-weight: 600; margin: 14px 0 4px; font-size: 0.92rem; }
input[type=text], input[type=password], select, textarea {
  width: 100%; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 10px;
  font: inherit; background: #fff; color: var(--text);
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--navy); }
textarea { min-height: 160px; resize: vertical; line-height: 1.7; }

.btn {
  display: inline-block; background: var(--navy); color: #fff; border: none;
  padding: 10px 26px; border-radius: 999px; font: inherit; font-weight: 600;
  cursor: pointer; transition: background 0.15s;
}
.btn:hover { background: var(--navy-dark); }
.btn:disabled { opacity: 0.5; cursor: default; }
.btn.full { width: 100%; margin-top: 18px; }
.btn.green { background: var(--green); }
.btn.red { background: var(--red); }
.btn.ghost { background: #fff; color: var(--navy); border: 1.5px solid var(--navy); }
.btn.small { padding: 6px 16px; font-size: 0.88rem; }

.error-msg { color: var(--red); margin-top: 10px; font-size: 0.9rem; min-height: 1.2em; }

/* ---------- תגי סטטוס ---------- */
.tag {
  display: inline-block; padding: 3px 12px; border-radius: 999px;
  font-size: 0.78rem; font-weight: 600; white-space: nowrap;
}
.tag.gray { background: #eceef4; color: var(--muted); }
.tag.blue { background: var(--navy-light); color: var(--navy); }
.tag.amber { background: var(--amber-bg); color: #8a6410; }
.tag.green { background: #e2f2e9; color: var(--green); }
.tag.red { background: #f9e5e4; color: var(--red); }

/* ---------- כרטיס משימה ---------- */
.assignment-card { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.assignment-card .meta { color: var(--muted); font-size: 0.9rem; display: flex; gap: 16px; flex-wrap: wrap; margin-top: 4px; }

/* ---------- טקסט מקרא ---------- */
.bible-text {
  font-family: 'Frank Ruhl Libre', serif; font-size: 1.22rem; line-height: 2.1;
  background: #fdfcf7; border: 1px solid #efe9d8; border-radius: 10px; padding: 18px 22px;
}
.bible-text .vnum { color: var(--accent); font-size: 0.75rem; vertical-align: super; margin-inline-end: 3px; font-family: 'Heebo', sans-serif; }
details.bible-chapter { margin-bottom: 10px; }
details.bible-chapter summary {
  cursor: pointer; font-weight: 600; color: var(--navy); padding: 8px 4px;
  font-family: 'Frank Ruhl Libre', serif; font-size: 1.05rem;
}

/* ---------- טופס הגשה ---------- */
.section-block { border-inline-start: 4px solid var(--navy-light); padding-inline-start: 16px; margin: 22px 0; }
.section-block .background { color: var(--muted); font-size: 0.94rem; margin-bottom: 8px; }
.section-block ul { margin: 6px 18px 10px 0; font-size: 0.94rem; }
.scope-tag { font-size: 0.78rem; color: var(--accent); font-weight: 600; }
.radio-row { display: flex; gap: 14px; flex-wrap: wrap; margin: 8px 0; }
.radio-row label {
  display: flex; align-items: center; gap: 6px; margin: 0; font-weight: 500;
  border: 1.5px solid var(--border); padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.radio-row label:has(input:checked) { border-color: var(--navy); background: var(--navy-light); }
.char-count { font-size: 0.78rem; color: var(--muted); text-align: left; }

/* ---------- משוב ---------- */
.feedback-box {
  background: var(--navy-light); border-radius: 10px; padding: 16px 20px; margin-top: 10px;
}
.feedback-box.pending { background: var(--amber-bg); border: 1px dashed var(--amber-border); }
.pending-label { font-weight: 700; color: #8a6410; font-size: 0.85rem; margin-bottom: 6px; }
.score-big { font-size: 2.4rem; font-weight: 700; color: var(--navy); font-family: 'Frank Ruhl Libre', serif; }

table.rubric-table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 0.92rem; }
table.rubric-table th, table.rubric-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: right; vertical-align: top; }
table.rubric-table th { color: var(--muted); font-weight: 600; font-size: 0.82rem; }
table.rubric-table tr.group-row td { background: var(--navy-light); font-weight: 700; color: var(--navy); }
.score-input { width: 64px; padding: 5px 8px; border: 1.5px solid var(--border); border-radius: 8px; font: inherit; text-align: center; }
.reasoning { color: var(--muted); font-size: 0.86rem; }
.quote-snip { color: var(--navy); font-size: 0.85rem; font-style: italic; }

/* ---------- תור מורה ---------- */
.progress-wrap { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.progress-bar { flex: 1; height: 10px; background: #eceef4; border-radius: 999px; overflow: hidden; }
.progress-bar > div { height: 100%; background: var(--green); border-radius: 999px; transition: width 0.3s; }
.queue-item {
  display: flex; align-items: center; gap: 14px; padding: 14px 18px;
  background: #fff; border: 1px solid var(--border); border-radius: 12px; margin-bottom: 10px;
  cursor: pointer; transition: box-shadow 0.15s;
}
.queue-item:hover { box-shadow: var(--card-shadow); }
.queue-item .q-name { font-weight: 600; min-width: 140px; }
.queue-item .q-meta { color: var(--muted); font-size: 0.85rem; flex: 1; }
.filters { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.filters select { width: auto; }

.flag-box { background: #f9e5e4; border: 1px solid #eac2c0; border-radius: 10px; padding: 12px 16px; margin: 10px 0; color: var(--red); font-size: 0.92rem; }
.answer-box { background: #fafbfe; border: 1px solid var(--border); border-radius: 10px; padding: 14px 18px; margin: 8px 0 16px; white-space: pre-wrap; }
.decide-bar { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; align-items: center; }

.back-link { color: var(--muted); text-decoration: none; font-size: 0.9rem; display: inline-block; margin-bottom: 12px; }
.back-link:hover { color: var(--navy); }

/* ---------- תצוגת docx מקורי ---------- */
.docx-wrap {
  margin-top: 12px; border: 1px solid var(--border); border-radius: 10px;
  padding: 20px 26px; background: #fff; max-height: 560px; overflow-y: auto;
  direction: rtl;
}
.docx-wrap article, .docx-wrap section { width: auto !important; padding: 0 !important; min-height: 0 !important; }
.docx-wrap p { margin-bottom: 0.5em; }
.docx-wrap table { border-collapse: collapse; }
.docx-wrap table td { border: 1px solid #ccc; padding: 4px 8px; }

details.req-details { margin: 6px 0 10px; }
details.req-details summary { cursor: pointer; color: var(--muted); font-size: 0.88rem; }
details.req-details[open] summary { color: var(--navy); }

/* ---------- מסע הלמידה (תחנות) ---------- */
.journey { position: relative; padding-inline-start: 22px; }
.journey::before {
  content: ''; position: absolute; inset-inline-start: 41px; top: 20px; bottom: 20px;
  width: 3px; background: var(--navy-light); border-radius: 2px;
}
.station {
  display: flex; gap: 16px; align-items: flex-start; text-decoration: none; color: inherit;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--card-shadow); padding: 16px 18px; margin-bottom: 14px;
  position: relative; transition: box-shadow 0.15s, transform 0.15s;
}
.station:hover { box-shadow: 0 4px 16px rgba(47,60,102,0.14); transform: translateY(-1px); }
.station-dot {
  width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: #eceef4; color: var(--muted); font-weight: 700; font-size: 1.05rem;
  border: 3px solid #fff; z-index: 1;
}
.station-dot.active { background: var(--amber-bg); color: #8a6410; border-color: var(--amber-border); }
.station-dot.done { background: var(--green); color: #fff; }
.station-body { flex: 1; }
.station-desc { color: var(--muted); font-size: 0.9rem; margin: 4px 0; }
.kind-label { font-size: 0.78rem; color: var(--accent); font-weight: 600; }

/* ---------- שאלות עם תשובה צמודה ---------- */
.q-card { padding: 18px 20px; }
.q-head { display: flex; gap: 12px; align-items: flex-start; }
.q-num {
  flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%;
  background: var(--navy); color: #fff; font-weight: 700;
  display: flex; align-items: center; justify-content: center; font-size: 0.95rem;
}
.q-text { font-weight: 600; color: var(--navy); font-size: 1.02rem; }
.q-subs { margin: 8px 42px 8px 0; font-size: 0.95rem; }
.q-context-inline { color: var(--muted); font-size: 0.9rem; margin: 6px 0 6px 42px; }
details.q-context { margin: 8px 0 8px 42px; background: #fdfcf7; border: 1px solid #efe9d8; border-radius: 8px; padding: 8px 12px; }
details.q-context summary { cursor: pointer; color: var(--navy); font-weight: 600; font-size: 0.9rem; }
details.q-context p { margin: 8px 0; font-size: 0.92rem; line-height: 1.7; }
.q-card textarea { margin-top: 10px; min-height: 110px; }
.sub-label { font-weight: 600; margin: 12px 0 2px; font-size: 0.92rem; color: var(--text); }
.q-card .sub-answer { min-height: 64px; margin-top: 4px; }
.q-card input.q-field { margin-top: 4px; }

/* הוראות עבודה, קישורי עזר וצירוף קבצים — למידה עצמאית */
.q-instruction {
  background: var(--navy-light); border-inline-start: 4px solid var(--navy);
  border-radius: 8px; padding: 8px 14px; margin: 10px 0;
  font-size: 0.92rem; color: var(--navy); font-weight: 500;
}
.q-links { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0; }
.q-links .btn { text-decoration: none; }
.guide-strip {
  background: #eef7f1; border: 1px solid #cfe7d8; border-radius: var(--radius);
  padding: 12px 18px; margin-bottom: 16px; font-size: 0.95rem; line-height: 1.7;
}
.file-drop {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  border: 2px dashed var(--navy-light); border-radius: 12px;
  padding: 14px 18px; margin: 6px 0 10px; cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.file-drop:hover { border-color: var(--navy); background: #fafbfe; }
.file-drop input[type=file] { display: none; }
.file-drop-icon { font-size: 1.3rem; }
.file-drop-text { color: var(--navy); font-weight: 600; }
.file-drop .file-chosen { color: var(--green); font-weight: 600; font-size: 0.9rem; }
.file-drop.has-file { border-style: solid; border-color: var(--green); background: #f2faf5; }

/* ---------- מדריך למורה ---------- */
.guide-step h2 { font-size: 1.15rem; }
.try-box {
  background: var(--amber-bg); border: 1px solid var(--amber-border);
  border-radius: 10px; padding: 10px 16px; margin-top: 12px;
  font-size: 0.95rem; line-height: 1.7;
}

/* ---------- מרחב שיעור: פריסה זה-לצד-זה ---------- */
.lesson-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 18px; align-items: start; }
@media (max-width: 900px) { .lesson-grid { grid-template-columns: 1fr; } }
.sticky-card { position: sticky; top: 74px; }
.pane-label {
  font-weight: 700; color: var(--navy); font-size: 0.95rem;
  background: var(--navy-light); border-radius: 8px; padding: 7px 12px; margin-bottom: 12px;
}
.stage-nav {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; margin-top: 16px; flex-wrap: wrap;
}

/* ---------- מרחב שיעור: בחירת שיעור ושלבים ---------- */
.lesson-picker { display: flex; gap: 8px; flex-wrap: wrap; }
.lesson-pick {
  border: 1.5px solid var(--border); background: #fff; border-radius: 999px;
  padding: 8px 18px; font: inherit; font-size: 0.9rem; cursor: pointer;
}
.lesson-pick.active { background: var(--navy); color: #fff; border-color: var(--navy); font-weight: 600; }
.stage-chips { display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0 14px; }
.stage-btn {
  border: 1.5px solid var(--border); background: #fff; border-radius: 999px;
  padding: 5px 14px; font: inherit; font-size: 0.85rem; cursor: pointer; color: var(--muted);
}
.stage-btn.done { color: var(--green); border-color: #cfe7d8; }
.stage-btn.current { background: var(--accent); border-color: var(--accent); color: #2b2410; font-weight: 700; }
.stage-card { border: 1.5px solid var(--navy-light); border-radius: 12px; padding: 16px 20px; background: #fafbfe; }
.slide-preview {
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: 16px 20px; margin: 10px 0; line-height: 1.8;
}
.insight-row { padding: 8px 4px; border-bottom: 1px solid var(--border); line-height: 1.6; }
.insight-row:last-child { border-bottom: none; }

/* ---------- בוחן סגור ---------- */
.quiz-opts { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.quiz-opt {
  display: flex; align-items: flex-start; gap: 10px; font-weight: 400;
  border: 1.5px solid var(--border); border-radius: 10px; padding: 10px 14px;
  cursor: pointer; margin: 0;
}
.quiz-opt:has(input:checked) { border-color: var(--navy); background: var(--navy-light); }
.quiz-opt input { width: 18px; height: 18px; margin-top: 3px; }
.quiz-res { border-radius: 10px; padding: 10px 14px; margin-bottom: 8px; font-size: 0.95rem; }
.quiz-res.ok { background: #e2f2e9; color: var(--green); }
.quiz-res.bad { background: #f9e5e4; color: #7c2d28; }
.quiz-fix { display: block; margin-top: 6px; color: var(--navy); font-size: 0.9rem; line-height: 1.7; }

/* ---------- מצב מיקוד: ווידג'ט צף — הדף נשאר גלוי ---------- */
body.focus-dim { background: #1a2320; }
body.focus-dim #topbar { filter: brightness(0.55); }
body.focus-dim .card, body.focus-dim .guide-strip { box-shadow: 0 2px 16px rgba(0,0,0,0.45); }

.focus-widget {
  position: fixed; bottom: 18px; inset-inline-start: 18px; z-index: 100;
  display: flex; gap: 14px; align-items: center;
  background: radial-gradient(ellipse at 40% 30%, #16231d 0%, #0f1915 90%);
  color: #d9e2da; border: 1px solid #25352c; border-radius: 18px;
  padding: 14px 18px; box-shadow: 0 10px 34px rgba(0,0,0,0.5);
}
.fw-ring { position: relative; width: 86px; height: 86px; flex-shrink: 0; }
.fw-ring::before {
  content: ''; position: absolute; inset: -18px; border-radius: 50%;
  background: radial-gradient(circle, rgba(235,184,79,0.16) 0%, transparent 65%);
  animation: fo-breathe 5s ease-in-out infinite;
}
@keyframes fo-breathe { 0%,100% { opacity: 0.75; } 50% { opacity: 1; } }
.fw-clock {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: 'Frank Ruhl Libre', serif; font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums;
}
.fw-info { display: flex; flex-direction: column; gap: 2px; min-width: 110px; }
.fw-title { font-weight: 700; color: #ebb84f; font-size: 0.95rem; }
.fw-line { font-size: 0.82rem; color: #7e9086; }
.fw-line b { color: #d9e2da; font-weight: 600; }
.fw-end { margin-top: 6px; padding: 4px 12px !important; font-size: 0.8rem !important; }
.fo-quiet {
  background: none; border: 1px solid #25352c; color: #7e9086;
  border-radius: 10px; padding: 9px 20px; font: inherit; font-size: 0.9rem; cursor: pointer;
}
.fo-quiet:hover { color: #d9e2da; border-color: #7e9086; }
.fo-summary-modal {
  position: fixed; inset: 0; z-index: 120; background: rgba(15,25,21,0.75);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.fo-summary { max-width: 620px; width: 100%; }
.fo-banner {
  position: fixed; top: 16px; right: 50%; transform: translateX(50%);
  background: #16231d; border: 1px solid #ebb84f; color: #d9e2da;
  border-radius: 12px; padding: 12px 22px; font-size: 0.95rem;
  opacity: 0; pointer-events: none; transition: opacity 0.4s; z-index: 110; text-align: center; max-width: 90vw;
}
.fo-banner.show { opacity: 1; }
.fo-summary { background: #f8faf6; color: #1f2e27; border-radius: 16px; padding: 28px 30px; }
.fo-eyebrow { font-size: 0.8rem; color: #5c6e63; margin-bottom: 4px; }
.fo-summary h1 { font-family: 'Frank Ruhl Libre', serif; font-size: 2rem; color: #1f2e27; margin-bottom: 16px; }
.fo-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin-bottom: 18px; }
.fo-stat { background: #fff; border: 1px solid #c7d3c4; border-radius: 12px; padding: 14px; }
.fo-stat .n { font-family: 'Frank Ruhl Libre', serif; font-size: 1.7rem; font-weight: 700; }
.fo-stat .n.gold { color: #8f6114; }
.fo-stat .l { font-size: 0.8rem; color: #5c6e63; }
.fo-verdict { border-right: 3px solid #b07a22; background: #fff; border-radius: 0 10px 10px 0; padding: 12px 16px; line-height: 1.7; }

/* ---------- יומן מסע ואזור אישי ---------- */
.journal-fab {
  position: fixed; bottom: 20px; inset-inline-end: 20px; z-index: 90;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--navy); color: #fff; border: none; font-size: 1.5rem;
  cursor: pointer; box-shadow: 0 6px 20px rgba(47,60,102,0.4);
  transition: transform 0.15s;
}
.journal-fab:hover { transform: scale(1.1); }
.cards-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat-card { text-align: center; padding: 16px 10px; margin-bottom: 0; }
.stat-num { font-family: 'Frank Ruhl Libre', serif; font-size: 2rem; font-weight: 700; color: var(--navy); }
.stat-lbl { color: var(--muted); font-size: 0.82rem; }

.board-preview {
  position: relative; width: 100%; aspect-ratio: 16 / 9;
  overflow: hidden; border-radius: 12px; border: 1px solid var(--border);
  margin-top: 12px; background: #2f3c66;
}
#board-frame {
  width: 1280px; height: 720px; border: 0;
  position: absolute; top: 0; left: 0;
  transform-origin: top left;
  pointer-events: none; /* תצוגה בלבד — השליטה נשארת בטופס שמעל */
}

.board-task-row {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  border: 1.5px solid var(--border); border-radius: 10px; margin-bottom: 8px;
  cursor: pointer; font-weight: 400;
}
.board-task-row:has(input:checked) { border-color: var(--navy); background: var(--navy-light); }
.board-task-row input { width: 18px; height: 18px; }

/* סימון צבעים בטקסט */
.hl-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 10px 0; }
.hl-btn {
  border: 1.5px solid var(--border); background: #fff; border-radius: 999px;
  padding: 4px 12px; font: inherit; font-size: 0.85rem; cursor: pointer;
}
.hl-btn.active { border-color: var(--navy); background: var(--navy-light); font-weight: 700; }
.hl-toolbar.hl-nag { animation: nag 0.5s; }
@keyframes nag { 25% { transform: translateX(4px); } 75% { transform: translateX(-4px); } }
.hl-text { margin-bottom: 6px; }
.hl-w { cursor: pointer; border-radius: 4px; padding: 0 1px; }
.hl-w:hover { outline: 1.5px dashed var(--navy-light); }
.hl-yellow { background: #ffe87a; }
.hl-purple { background: #e0d1f7; }
.hl-green { background: #c4e8cd; }

/* טבלת מיון (עמודות) */
.col-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 10px; }
.col-box { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.col-head { background: var(--navy-light); color: var(--navy); font-weight: 600; font-size: 0.85rem; padding: 8px 10px; }
.col-box textarea { border: none; border-radius: 0; min-height: 120px; margin: 0; }

/* ---------- משוב מעצב ---------- */
.feedback-box.formative { background: #eef7f1; border: 1px solid #cfe7d8; }
.feedback-box.formative p { margin-bottom: 8px; }
.formative-label { font-weight: 700; color: var(--green); font-size: 0.85rem; margin-bottom: 8px; }

/* ---------- דשבורד ---------- */
.matrix-table th { font-size: 0.75rem; }
.crit-row { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.crit-name { flex: 0 0 260px; font-size: 0.88rem; }
.crit-bar { flex: 1; }
.crit-pct { flex: 0 0 110px; text-align: left; font-size: 0.85rem; color: var(--muted); white-space: nowrap; }
@media (max-width: 640px) { .crit-name { flex-basis: 140px; } }

/* ---------- ספריית דפי עבודה ---------- */
.file-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 6px;
  border-bottom: 1px solid var(--border); font-size: 0.92rem;
}
.file-row:last-child { border-bottom: none; }
.file-name { flex: 1; }
.file-actions { display: flex; gap: 12px; white-space: nowrap; }
.file-actions .link-btn { color: var(--navy); }

@media (max-width: 640px) {
  .topbar-inner { gap: 10px; }
  #main-nav { order: 3; width: 100%; overflow-x: auto; }
  main { padding: 16px 12px 60px; }
  .card { padding: 16px; }
}