/* ‎drivers — ערכת העיצוב. **מקור אחד לכל המערכת.**
 *
 * ⚠️ **אסור לכתוב צבע, מידה או פונט מחוץ לקובץ הזה.** ערך שנכתב ישירות
 *    בקומפוננטה הוא הערך שיישכח כשמשנים את הערכה, והוא זה שייראה שבור.
 *
 * ⚠️ **אין כאן ולא יהיה כאן דומיין חיצוני.** חוק ברזל 10. יש טסט שסורק
 *    את הקובץ, ואת התבניות, ואת מה שמשתמש מזין.
 *
 * ═══ "הדף מודפס, לא מואר" ═══════════════════════════════════════════
 *
 * אין ``box-shadow``, אין ``text-shadow``, אין ``filter: blur``, אין
 * ``backdrop-filter`` ואין ``glow`` בשום גיליון במערכת. יש טסט חוסם.
 * **עומק בא מקצה נייר ומקו.** צל הוא חיקוי של אור, ומסך שמחקה אור
 * נראה כמו במה — וזו מערכת שנהג פותח כדי לדעת כמה הוא הרוויח.
 *
 * ═══ הפונט — Heebo, וזו החלטה שנמדדה ═══════════════════════════════
 *
 * חוק ברזל 7 מציין ``Rubik`` לגוף. **הוא אינו בשימוש כאן**, מאותה סיבה
 * שהוא ירד מ-``tickets`` ב-12/08/2026 ובתיעוד מפורש:
 *
 * > ספרות ``Rubik`` **פרופורציונליות** (9 רוחבים שונים) ותלויות בפיצ'ר
 * > ``tnum``, שקיים רק בתת-הקבוצה הלטינית. פיצ'ר שנעדר **נכשל בשקט**,
 * > ומספרים מתחילים לרקוד בטבלה בלי שאיש ישים לב.
 *
 * ‎``Heebo`` רוחב-אחיד מלידה — כל ספרה 1151/2048 יחידות, נמדד ב-
 * ``fontTools``. **המערכת הזו היא טבלאות של מספרים ותו לא**, ולכן
 * ההבחנה הזו חשובה כאן יותר מאשר בכל פרויקט אחר על השרת.
 */

@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/heebo-hebrew.de80852899c5.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: 100 900;
  font-display: swap;
  src: url("../fonts/heebo-latin.480b1d24f2aa.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;
}
/* ‎גופן התצוגה — כותרות בדפים ציבוריים בלבד. הממשק הפנימי נשאר Heebo:
 * ‎18.3KB על כל מסך שנהג פותח 20 פעם ביום בשביל אפס רווח. */
@font-face {
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/frank-ruhl-hebrew.57720a889009.woff2") format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}

:root {
  /* ═══ צבע ═══════════════════════════════════════════════════════════
   * כל היחסים בהערות **נמדדו** ב-``test_palette``, ולא הועתקו מהראש.
   * מבטא מוסדי אחד — נייבי. על קרקע מבטא: **לבן, תמיד.**
   *
   * ⚠️ התקן מזהיר במפורש: בערכה ירוקה ``--accent`` היה גוון אמצע, ולכן
   *    ``color: var(--ink)`` עליו נתן 7.51 ו**גם** לבן נתן 7.51. נייבי
   *    כהה, ואותה שורה מתמוטטת ל-1.24 בשמונה מקומות בבת אחת.
   */
  --ink:          #13181F;   /* על נייר 15.64 · על משטח 17.82 */
  --bg:           #F2F0EA;   /* נייר — חם, לא אפור-ירוק */
  --surface:      #FFFFFF;
  --line:         #DDD8CC;   /* קו שיער דקורטיבי — לא גבול של רכיב */
  --muted:        #5C5A52;   /* על נייר 6.06 · על משטח 6.91 */
  --accent:       #122A4A;   /* נייבי · לבן עליו 14.43 */
  --accent-soft:  #E4E8EF;   /* מבטא עליו 11.74 */

  /* ★ זהב עתיק — **קו או מתאר, לא מילוי ולא טקסט.**
   * 4.80 על משטח: עובר 3:1 לרכיב, נכשל 4.5 לטקסט. **אל תצבע בו כותרת.** */
  --gold:         #8A6E3C;

  /* ═══ דירוג רווחיות — **מצב, לא קישוט** (§32) ══════════════════════
   *
   * שלושת אלה אומרים דבר אחד: האם הנסיעה עמדה ביעד של הנהג. הם
   * ה**אות** היחיד במסך, ולכן הם אסורים בכל מקום אחר — כפתור "שמור"
   * בירוק גורם לעין ללמוד שהירוק לא אומר כלום, ואז הוא לא אומר כלום
   * גם על הנסיעה.
   *
   * ⚠️ **וגם לא רק צבע.** WCAG 1.4.1: הדירוג נושא **תמיד** גם תווית
   *    מילולית. נהג עם עיוורון צבעים אדום-ירוק — כ-8% מהגברים, וזה
   *    הקהל — רואה שני עיגולים זהים.
   */
  --rate-good:    #0F5F58;   /* על משטח 7.51 */
  --rate-good-bg: #E3F0EE;
  --rate-ok:      #9A5B10;   /* על משטח 5.42 */
  --rate-ok-bg:   #FBF1E0;
  --rate-bad:     #8C2F22;   /* על משטח 8.25 */
  --rate-bad-bg:  #F8E9E6;

  /* ⚠️ אזהרה — **לחריגות בלבד.** כשהיא מופיעה בכל מקום היא מפסיקה
   * להיות סימן. */
  --warn:         #9A5B10;
  --warn-bg:      #FBF1E0;

  /* ★ גבול של רכיב אינטראקטיבי — **לא ‎--line.**
   * ‎WCAG 1.4.11 דורש 3:1. ‎--line נותן פחות מ-1.5: מספיק למפריד, ונכשל
   * כגבול של שדה קלט. שדה עם ‎--line הוא שדה שלא מוצאים בשמש. */
  --line-field:   #84806F;   /* על לבן 3.96 · על נייר 3.48 */
  --focus:        var(--accent);

  /* ═══ טיפוגרפיה ═════════════════════════════════════════════════════ */
  --font:         'Heebo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: 'Frank Ruhl Libre', 'Heebo', Georgia, serif;

  --w-regular: 400;  --w-medium: 500;  --w-semibold: 600;  --w-bold: 700;

  --t-xs:    0.8125rem;
  --t-sm:    0.9375rem;
  --t-base:  1.0625rem;
  --t-md:    1.25rem;
  --t-lg:    1.5rem;
  --t-xl:    1.875rem;
  /* ★ המספר הגדול של לוח הבקרה. הוא **התשובה** לשאלה שבשביל זה נכנסו. */
  --t-hero:  2.75rem;

  --lh-tight: 1.25;
  --lh-body:  1.7;          /* עברית צפופה נקראת רע — 1.7 ולא 1.5 */

  /* ═══ מרווח — סולם של 4 ═════════════════════════════════════════════ */
  --s-1: 0.25rem;  --s-2: 0.5rem;  --s-3: 0.75rem;  --s-4: 1rem;
  --s-5: 1.5rem;   --s-6: 2rem;    --s-7: 3rem;     --s-8: 4rem;

  /* ═══ צורה ══════════════════════════════════════════════════════════ */
  --r-sm: 8px;  --r-md: 10px;  --r-lg: 12px;  --r-pill: 999px;

  /* ★ 44px מינימום מטרת מגע — והכפתור הראשי גדול מזה.
   * ‎§95: נסיעה נכנסת בפחות מ-10 שניות. נהג מקליד תוך כדי עבודה, ביד
   * אחת, לפעמים באור שמש ישיר. כפתור קטן הוא כפתור שמפספסים, ופספוס
   * אחד הוא בדיוק מה שגורם לו להפסיק לרשום. */
  --touch: 44px;
  --touch-primary: 56px;

  /* ═══ הגבהה — **אין.** ══════════════════════════════════════════════
   * ההפרדה באה מ-``--line`` ומקצה נייר. יש טסט שנכשל על ``box-shadow``,
   * ``text-shadow``, ``filter: blur`` ו-``backdrop-filter`` בכל גיליון. */
}

/* ═══ בסיס ════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  /* ‎§63 — מובייל ראשון. גלילה אופקית בדף של מספרים היא דף שבור. */
  overflow-x: hidden;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: var(--t-base);
  font-weight: var(--w-regular);
  line-height: var(--lh-body);
  /* ‎``tnum`` מיותר ב-Heebo (רוחב-אחיד מלידה) ואינו מזיק. ``lnum``
   * מוודא ספרות בגובה אחיד גם בגיבוי המערכתי, שאולי אינו Heebo. */
  font-variant-numeric: tabular-nums lining-nums;
}

h1, h2, h3, h4 {
  margin: 0 0 var(--s-3);
  line-height: var(--lh-tight);
  font-weight: var(--w-semibold);
}
h1 { font-size: var(--t-lg); }
h2 { font-size: var(--t-md); }
h3 { font-size: var(--t-base); }

p { margin: 0 0 var(--s-3); }

a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }

/* ★ מוקד נראה, בכל מקום. ``outline: none`` בלי חלופה הוא מקלדת שאבדה. */
:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* ‎דילוג לתוכן — הדבר הראשון בטאב, ונראה רק כשמתמקדים בו.
 * ⚠️ ``transform`` ולא ``opacity: 0`` (חוק ברזל 11): הוא יוצא מהמסך
 *    ולא נעלם, ולכן הוא נגיש לקורא מסך גם בלי JS. */
.skip-link {
  position: absolute;
  inset-inline-start: var(--s-4);
  top: 0;
  transform: translateY(-120%);
  z-index: 100;
  background: var(--accent);
  color: #fff;
  padding: var(--s-2) var(--s-4);
  border-radius: 0 0 var(--r-sm) var(--r-sm);
}
.skip-link:focus { transform: translateY(0); }

.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}