/* ============================================================
   מערכת קליקרים — סגנון בסיס (M0 · scaffold)
   בסיס נקי ומבודד. הכיוון העיצובי המלא ייבחר מ-3 הצעות לפני
   בניית ממשקי המוצר (עורך החידונים + מסך המקרן).
   ============================================================ */
:root {
    --bg:          #0e0f13;
    --bg-2:        #121319;
    --surface:     #171922;
    --surface-2:   #1e212c;
    --surface-3:   #262a37;

    --text:        #f2f0ea;
    --text-2:      #b4bac8;   /* ניגודיות מוגברת ל-WCAG AA (קהל מבוגר, אולם מואר) */
    --text-3:      #8b93a4;

    --border:      #262a37;
    --border-2:    #343a4a;

    --accent:      #cc9a4e;   /* ברונזה מאופקת — פרימיום מכובד, לא "קזינו" (מותן לפי משוב 46 דמויות) */
    --accent-2:    #e2bf82;
    --accent-strong:#a8792f;
    --accent-soft: rgba(204,154,78,.12);
    --accent-ink:  #e6cf9d;

    --success:     #3fae8e;
    --success-soft:rgba(63,174,142,.15);
    --warning:     #d9a23a;
    --danger:      #e0657c;
    --info:        #5b8def;

    --radius:      16px;
    --radius-sm:   10px;
    --radius-lg:   24px;
    --shadow:      0 2px 14px rgba(0,0,0,.45);
    --shadow-lg:   0 24px 60px rgba(0,0,0,.55);
    --sidebar-w:   264px;

    --font-ui:      'Assistant', 'Segoe UI', Tahoma, system-ui, sans-serif;
    --font-display: 'Frank Ruhl Libre', 'Assistant', Georgia, serif;

    /* צבעי תשובה — פלטה מרוסנת (לא ניאון), למיפוי מקש→תשובה במסך */
    --ans-1: #e0a53b;  /* זהב */
    --ans-2: #4f9dde;  /* תכלת */
    --ans-3: #58b98a;  /* ירוק-מרווה */
    --ans-4: #d97a6c;  /* טרקוטה */
    --ans-5: #b48bd0;  /* לבנדר עמום */
    --ans-6: #d9b44a;  /* חרדל */
}

/* ── מצב בהיר (מסכי ניהול; המקרן/screen.php נשאר כהה תמיד) ── */
:root[data-theme="light"] {
    --bg:          #eef1f5;
    --bg-2:        #e6eaf1;
    --surface:     #ffffff;
    --surface-2:   #f4f6fa;
    --surface-3:   #e9edf3;

    --text:        #1a2130;
    --text-2:      #495466;
    --text-3:      #636b7c;

    --border:      #dde2ea;
    --border-2:    #cbd2dd;

    --accent:      #b0803a;   /* ברונזה כהה יותר — ניגודיות על רקע בהיר */
    --accent-2:    #c9963f;
    --accent-strong:#8f6528;
    --accent-soft: rgba(176,128,58,.13);
    --accent-ink:  #855f21;

    --success:     #1f7a46;
    --success-soft:rgba(47,143,91,.13);
    --warning:     #8f5d12;
    --danger:      #c0392b;
    --info:        #3a6bd0;

    --shadow:      0 2px 10px rgba(28,38,58,.08);
    --shadow-lg:   0 20px 50px rgba(28,38,58,.16);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: var(--font-ui);
    background: var(--bg);
    color: var(--text);
    font-size: 15px;
    line-height: 1.55;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    background-image:
        radial-gradient(880px 480px at 90% -10%, rgba(224,165,59,.08), transparent 60%),
        radial-gradient(680px 480px at -6% 108%, rgba(91,141,239,.05), transparent 55%);
    background-attachment: fixed;
}
a { color: var(--accent-ink); text-decoration: none; }   /* --accent-ink כהה מספיק לרף AA (4.5:1) במצב-בהיר */
h1, h2 { margin: 0; font-family: var(--font-display); font-weight: 800; letter-spacing: -.01em; }
.brand-text, .login-title, .stat-value { font-family: var(--font-display); }
.muted { color: var(--text-2); font-size: .88rem; }
.icon { flex: none; vertical-align: -3px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 6px; }

/* ── מעטפת ── */
.app-shell { display: flex; min-height: 100vh; min-height: 100dvh; }

.app-sidebar {
    width: var(--sidebar-w); flex: none;
    background: var(--bg-2); border-inline-start: 1px solid var(--border);
    display: flex; flex-direction: column; padding: 18px 14px;
    position: sticky; top: 0; height: 100vh; height: 100dvh;
}
.brand { display: flex; align-items: center; gap: 12px; padding: 6px 8px 20px; }
.brand-mark {
    width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center;
    background: linear-gradient(145deg, var(--accent), var(--accent-strong)); color: #1a1305;
    box-shadow: 0 4px 12px rgba(0,0,0,.3);
}
.brand-mark.has-logo { background: transparent; box-shadow: none; }
.brand-mark.has-logo img { width: 100%; height: 100%; object-fit: contain; }
.brand-text { font-weight: 800; font-size: 1.12rem; }
.brand-sub  { color: var(--text-3); font-size: .72rem; }

.sidebar-nav { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; flex: 1; }
.nav-section { color: var(--text-3); font-size: .68rem; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; padding: 16px 10px 6px; }
.nav-item {
    display: flex; align-items: center; gap: 11px; padding: 9px 11px; border-radius: 10px;
    color: var(--text-2); font-weight: 600; font-size: .9rem; transition: background .14s, color .14s;
}
.nav-item:hover:not(.disabled) { background: var(--surface); color: var(--text); }
.nav-item.active { background: var(--accent-soft); color: var(--accent-ink); }
.nav-item.disabled { opacity: .45; cursor: default; }
.nav-soon { margin-inline-start: auto; font-size: .62rem; background: var(--surface-2);
    color: var(--text-3); padding: 2px 7px; border-radius: 999px; font-weight: 700; }
.sidebar-foot { color: var(--text-3); font-size: .74rem; padding: 12px 10px 2px; display: flex; align-items: center; gap: 7px; }

/* באנר-מסלול עליון (רצועה אופקית מתחת ל-topbar) */
.usage-bar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 9px 22px; background: var(--surface); border-bottom: 1px solid var(--border); font-size: .82rem; color: var(--text-2); }
.usage-bar.is-over { background: rgba(224,101,124,.08); border-bottom-color: var(--danger); }
.ub-plan { font-family: var(--font-display); font-weight: 700; font-size: .92rem; color: var(--accent-ink); }
.ub-item { display: inline-flex; align-items: center; gap: 8px; }
.ub-item b { color: var(--text); }
.ub-bar { width: 84px; height: 6px; border-radius: 99px; background: var(--surface-3); overflow: hidden; display: inline-block; }
.ub-bar span { display: block; height: 100%; background: var(--accent); border-radius: 99px; }
.is-over .ub-bar span { background: var(--danger); }
.ub-warn { color: var(--danger); font-weight: 700; }
.ub-cta { margin-inline-start: auto; background: var(--accent); color: #1a1305; font-weight: 700; padding: 6px 16px; border-radius: 8px; text-decoration: none; font-size: .8rem; }
.ub-cta:hover { background: var(--accent-2); color: #1a1305; }
.ub-test { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ub-test input { width: 66px; padding: 5px 8px; border-radius: 7px; border: 1px solid var(--border-2); background: var(--surface-2); color: var(--text); font: inherit; font-size: .82rem; }
.ub-test select { padding: 5px 8px; border-radius: 7px; border: 1px solid var(--border-2); background: var(--surface-2); color: var(--text); font: inherit; font-size: .82rem; }
.ub-test-lbl { color: var(--text-2); font-weight: 700; }
.ub-save { background: var(--accent); color: #1a1305; font-weight: 700; border: none; border-radius: 7px; padding: 6px 14px; cursor: pointer; font: inherit; font-size: .8rem; }
.ub-save:hover { background: var(--accent-2); }
.ub-msg { color: var(--text-3); font-size: .76rem; }
@media (max-width: 640px) { .usage-bar { padding: 8px 14px; gap: 10px; } .ub-cta { margin-inline-start: 0; } }

.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.app-topbar {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 14px 26px; border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface) 85%, transparent); backdrop-filter: blur(8px); position: sticky; top: 0; z-index: 20;
}
.topbar-title { display: flex; align-items: center; gap: 12px; }
.app-topbar h1 { font-size: 1.24rem; }
.breadcrumb { color: var(--text-2); font-size: .8rem; }
.sidebar-toggle { display: none; background: none; border: none; color: var(--text); cursor: pointer; padding: 4px; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.topbar-user { font-size: .85rem; color: var(--text-2); font-weight: 600; }
.source-chip { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem;
    color: var(--text-2); background: var(--surface); padding: 5px 10px; border-radius: 999px; border: 1px solid var(--border); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px var(--success-soft); }

.app-content { padding: 26px; max-width: 1180px; width: 100%; margin: 0 auto; }

/* ── כרטיסי סטטיסטיקה ── */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 22px; }
.stat-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px 20px; }
.stat-label { display: flex; align-items: center; gap: 7px; color: var(--text-2); font-size: .82rem; font-weight: 600; }
.stat-value { font-size: 2.1rem; font-weight: 800; margin-top: 6px; }

/* ── פאנל ── */
.panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px 22px; margin-bottom: 18px; }
.panel-info { border-inline-start: 3px solid var(--accent); }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.panel-head h2 { font-size: 1.04rem; display: flex; align-items: center; gap: 8px; }

/* ── roadmap ── */
.roadmap { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rm-item { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 12px;
    background: var(--bg-2); border: 1px solid var(--border); }
.rm-item.rm-done { border-color: var(--success-soft); }
.rm-item.rm-next { border-color: var(--accent); background: var(--accent-soft); }
.rm-badge { flex: none; width: 42px; height: 30px; display: grid; place-items: center; border-radius: 8px;
    background: var(--surface-2); color: var(--text-2); font-weight: 800; font-size: .78rem; }
.rm-next .rm-badge { background: var(--accent); color: #1a1305; }
.rm-body { flex: 1; min-width: 0; }
.rm-title { font-weight: 700; font-size: .93rem; }
.rm-desc { color: var(--text-2); font-size: .8rem; }
.rm-status { flex: none; font-size: .7rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.rm-status-done { background: var(--success-soft); color: var(--success); }
.rm-status-next { background: var(--accent); color: #1a1305; }
.rm-status-planned { background: var(--surface-2); color: var(--text-3); }

/* ── כפתורים ── */
.btn { display: inline-flex; align-items: center; gap: 7px; padding: 9px 15px; border-radius: 10px;
    font-family: inherit; font-weight: 700; font-size: .88rem; cursor: pointer; border: 1px solid transparent; transition: filter .14s, background .14s; }
.btn-sm { padding: 6px 11px; font-size: .8rem; }
.btn-secondary { background: var(--surface-2); color: var(--text); border-color: var(--border-2); }
.btn-secondary:hover { background: var(--surface-3); }

/* ── toast ── */
#toast { position: fixed; inset-block-end: 22px; inset-inline-start: 50%; transform: translateX(50%) translateY(20px);
    background: var(--surface-3); color: var(--text); padding: 12px 20px; border-radius: 12px; box-shadow: var(--shadow-lg);
    opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 100; font-weight: 600; border: 1px solid var(--border-2); }
#toast.show { opacity: 1; transform: translateX(50%) translateY(0); }
#toast.err { border-color: var(--danger); }

/* ── דף משפטי (תנאי שימוש / פרטיות) ── */
.legal-body { background: var(--bg); min-height: 100vh; padding: 40px 20px; }
.legal { max-width: 780px; margin: 0 auto; color: var(--text); line-height: 1.75; }
.legal-back { display: inline-flex; align-items: center; gap: 6px; color: var(--text-3); font-size: .88rem; text-decoration: none; margin-bottom: 24px; }
.legal-back:hover { color: var(--accent-ink); }
/* חץ "חזרה" מצויר ימינה (RTL); ב-LTR ממראים אותו כדי שיצביע שמאלה */
[dir="ltr"] .legal-back svg { transform: scaleX(-1); }

/* דגל-חריגה: אירוע/דייר שעבר את מגבלת-המשתתפים של המסלול (איתות-גבייה) */
.over-flag { display: inline-block; margin-inline-start: 6px; padding: 2px 9px; border-radius: 999px;
    font-size: .72rem; font-weight: 700; background: rgba(224,101,124,.14); color: #e0657c; white-space: nowrap; }
.legal h1 { font-family: var(--font-display); font-weight: 900; font-size: 2rem; margin: 0 0 6px; }
.legal-meta { color: var(--text-3); font-size: .86rem; margin: 0 0 24px; }
.legal h2 { font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; color: var(--accent-ink); margin: 32px 0 10px; }
.legal p { margin: 0 0 12px; color: var(--text-2); }
.legal ul { margin: 0 0 14px; padding-inline-start: 22px; color: var(--text-2); }
.legal li { margin-bottom: 7px; }
.legal strong { color: var(--text); }
.legal a { color: var(--accent-ink); }
.legal-note { background: var(--surface); border: 1px solid var(--border-2); border-radius: 12px; padding: 14px 18px;
    font-size: .9rem; color: var(--text-2); margin: 0 0 24px; border-inline-start: 3px solid var(--accent); }
.legal-disclaimer { margin-top: 34px; border-inline-start-color: var(--danger); }

/* ── login ── */
/* flex + margin:auto על הילד (במקום align-items:center) — מרכז כשנכנס, ומאפשר גלילה בלי לגזור
   את ראש הקוביה כשהמסך נמוך (זה מה שגרם ל"יוצא מהמסגרת" למעלה). */
.login-body { display: flex; min-height: 100vh; min-height: 100dvh; padding: 28px 20px;
    position: relative; overflow-x: hidden; overflow-y: auto;
    background-image: radial-gradient(60vw 55vh at 85% -12%, var(--accent-soft), transparent 60%),
                      radial-gradient(50vw 45vh at -12% 112%, rgba(79,157,222,.05), transparent 55%); }
.login-body .login-wrap { position: relative; z-index: 1; margin: auto; }
/* רקע "במה חיה" גם בכניסה (canvas ב-stage-bg.js) */
.stage-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.stage-bg .beam { position: absolute; inset-block-start: -45%; width: 42%; height: 175%; filter: blur(30px); opacity: .55;
    background: linear-gradient(to bottom, rgba(230,207,157,.14), rgba(204,154,78,.05) 45%, transparent 72%);
    transform-origin: top center; will-change: transform; }
.stage-bg .b1 { inset-inline-start: 6%; animation: beamsweep 15s ease-in-out infinite alternate; }
.stage-bg .b2 { inset-inline-end: 10%; animation: beamsweep 19s ease-in-out infinite alternate-reverse; }
.stage-bg .b3 { inset-inline-start: 44%; opacity: .38; animation: beamsweep 24s ease-in-out infinite alternate; }
.sbg-canvas { position: absolute; inset: 0; }
@keyframes beamsweep { from { transform: rotate(-11deg) translateX(-5%); } to { transform: rotate(11deg) translateX(5%); } }
@media (prefers-reduced-motion: reduce){ .stage-bg .beam { animation: none; } }
.login-brand { display: block; text-decoration: none; }
.login-brand:hover .login-title { color: var(--accent-ink); }
.login-wrap { background: var(--surface); border: 1px solid var(--border); border-top: 3px solid var(--accent);
    border-radius: 18px; padding: 30px 32px; width: 100%; max-width: 400px; box-shadow: var(--shadow-lg); }
.login-mark { width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; margin: 0 auto 12px;
    background: linear-gradient(145deg, var(--accent), var(--accent-strong)); color: #1a1305; box-shadow: 0 6px 16px rgba(0,0,0,.35); }
/* כשיש לוגו מועלה — הוא עומד לבדו (בלי ריבוע-הזהב מאחוריו, שהיה בולע לוגו זהוב) */
.login-mark.has-logo { background: transparent; box-shadow: none; }
.login-mark.has-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.login-title { text-align: center; font-size: 1.55rem; font-weight: 800; margin-bottom: 2px; }
.login-sub { text-align: center; color: var(--text-2); font-size: .82rem; margin-bottom: 18px; }
.field { margin-bottom: 11px; }
.field label { display: block; font-size: .82rem; font-weight: 600; margin-bottom: 4px; }
.field input { width: 100%; padding: 10px 13px; border: 1.5px solid var(--border-2); border-radius: 10px; font-size: 1rem;
    background: var(--bg); color: var(--text); outline: none; transition: border-color .15s; font-family: inherit; }
.field input:focus { border-color: var(--accent); }
.remember { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: var(--text-2); margin-bottom: 14px;
    cursor: pointer; min-height: 42px; padding: 3px 2px; user-select: none; }
.remember input { width: 20px; height: 20px; flex: none; accent-color: var(--accent); cursor: pointer; }
/* הצג/הסתר סיסמה */
.pw-wrap { position: relative; }
.pw-wrap input { padding-inline-end: 46px; }
.pw-toggle { position: absolute; inset-inline-end: 6px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px;
    display: grid; place-items: center; background: none; border: none; color: var(--text-3); cursor: pointer; border-radius: 8px; }
.pw-toggle:hover { color: var(--accent-ink); }
.pw-toggle .pw-eye-off { display: none; }
.pw-toggle.on .pw-eye { display: none; }
.pw-toggle.on .pw-eye-off { display: block; }
.login-home { text-align: center; margin-top: 14px; }
.login-home a { color: var(--text-3); font-size: .82rem; }
.login-home a:hover { color: var(--accent-ink); }
.btn-login { width: 100%; padding: 13px; background: var(--accent); color: #1a1305; border: none; border-radius: 10px;
    font-size: 1rem; font-weight: 800; cursor: pointer; transition: filter .15s; font-family: inherit; }
.btn-login:hover { filter: brightness(1.06); }
.note-box { border-radius: 10px; padding: 11px 14px; margin-bottom: 16px; font-size: .85rem; }
.note-box.err  { background: rgba(224,101,124,.14); color: #f0a9b6; }
.note-box.warn { background: rgba(217,162,58,.14); color: #f2c46b; }
.note-box.info { background: var(--accent-soft); color: var(--accent-ink); }

/* ── רספונסיבי ── */
.sidebar-overlay { display: none; }
@media (max-width: 860px) {
    .app-sidebar { position: fixed; inset-block: 0; inset-inline-start: 0; z-index: 40; transform: translateX(-102%); transition: transform .22s; }
    [dir="rtl"] .app-sidebar { transform: translateX(102%); }
    .sidebar-open .app-sidebar { transform: translateX(0); }
    .sidebar-open .sidebar-overlay { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 35; }
    .sidebar-toggle { display: block; }
    .app-content { padding: 18px; }
}
@media (max-width: 560px) {
    /* topbar צפוף בטלפון: כותרת מתקצרת ל-ellipsis (לא נשברת), כותרת-משנה+שם-משתמש מוסתרים, ריווח מצומצם */
    .app-topbar { padding: 10px 14px; gap: 10px; }
    .topbar-title { min-width: 0; flex: 1 1 auto; }
    .app-topbar h1 { font-size: 1.05rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .breadcrumb { display: none; }
    .topbar-user { display: none; }
    .topbar-actions { gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
    .pool-stats { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   M1 — רכיבי עורך החידונים (Broadcast Stage)
   ============================================================ */

/* ── כפתורים נוספים ── */
.btn-primary { background: var(--accent); color: #1a1305; }
.btn-primary:hover { filter: brightness(1.07); }
.btn-ghost { background: transparent; color: var(--text-2); border-color: var(--border-2); }
.btn-ghost:hover { background: var(--surface-2); color: var(--text); }
.btn-danger { background: transparent; color: var(--danger); border-color: rgba(224,101,124,.4); }
.btn-danger:hover { background: rgba(224,101,124,.12); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-block { width: 100%; justify-content: center; }

/* ── page header row ── */
.page-actions { display: flex; align-items: center; gap: 10px; }

/* ── מודאל רשימת-המתנה ("נגמרו המספרים") ── */
.wl-modal { text-align: center; max-width: 440px; }
.wl-icon { width: 56px; height: 56px; border-radius: 50%; margin: 0 auto 14px; display: grid; place-items: center;
    background: linear-gradient(145deg, var(--accent), var(--accent-strong)); color: #1a1305; box-shadow: 0 6px 18px rgba(204,154,78,.3); }
.wl-modal h3 { margin: 0 0 8px; font-size: 1.35rem; }
.wl-lead { color: var(--text-2); font-size: .95rem; line-height: 1.65; margin: 0 0 20px; }
.wl-form { display: flex; gap: 8px; margin-bottom: 4px; }
.wl-form .input { flex: 1; text-align: center; }
.wl-form .btn { flex: none; white-space: nowrap; }
.wl-done { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 14px; border-radius: 12px;
    background: rgba(78,190,140,.12); color: #7bd6a6; font-weight: 600; }
.wl-done-ic { color: var(--accent-2); display: inline-flex; }
.wl-close { margin-top: 14px; }
@media (max-width: 480px) { .wl-form { flex-direction: column; } }

/* ── טבלה / רשימת משחקים ── */
.games-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }

/* ── ספריית חידונים מוכנים ── */
.tpl-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
    background: linear-gradient(120deg, rgba(204,154,78,.12), rgba(204,154,78,.04) 60%, transparent);
    border: 1px solid rgba(204,154,78,.28); border-radius: 16px; padding: 20px 24px; margin-bottom: 26px; }
.tpl-intro-txt h2 { margin: 0 0 4px; font-size: 1.3rem; font-family: var(--font-display, inherit); }
.tpl-intro-txt p { margin: 0; color: var(--text-2); font-size: .95rem; line-height: 1.5; }
.tpl-intro-txt p b { color: var(--accent-ink); }
.tpl-search { display: flex; align-items: center; gap: 8px; background: var(--bg); border: 1.5px solid var(--border-2);
    border-radius: 10px; padding: 0 12px; min-width: 240px; flex: 0 1 300px; color: var(--text-3); }
.tpl-search:focus-within { border-color: var(--accent); }
.tpl-search input { flex: 1; border: none; background: none; outline: none; color: var(--text); font-family: inherit;
    font-size: .95rem; padding: 11px 0; }
.tpl-sec { margin-bottom: 30px; }
.tpl-sec-h { display: flex; align-items: center; gap: 9px; margin: 0 0 14px; font-family: var(--font-display, inherit);
    font-weight: 800; font-size: 1.15rem; color: var(--text); }
.tpl-sec-h svg { color: var(--accent-2); }
.tpl-count { font-family: inherit; font-size: .72rem; font-weight: 700; color: var(--text-3);
    background: var(--surface-2); border: 1px solid var(--border-2); border-radius: 999px; padding: 2px 9px; }
.tpl-halachic-note { margin: -4px 0 16px; padding: 10px 15px; border-radius: 10px; font-size: .84rem; line-height: 1.55;
    color: var(--text-2); background: rgba(217,162,58,.08); border: 1px solid rgba(217,162,58,.24);
    border-inline-start: 3px solid var(--accent); }
.tpl-halachic-note b { color: var(--accent-ink); }
.tpl-empty { text-align: center; color: var(--text-3); padding: 50px 0; }
.tpl-empty svg { color: var(--border-2); margin-bottom: 10px; }
@media (max-width: 560px) { .tpl-intro { flex-direction: column; align-items: stretch; } .tpl-search { flex: 1; } }
.game-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px 20px;
    display: flex; flex-direction: column; gap: 10px; transition: border-color .15s, transform .15s; position: relative; }
.game-card:hover { border-color: var(--border-2); transform: translateY(-2px); }
.game-card .gc-kind { position: absolute; inset-block-start: 16px; inset-inline-end: 18px; }
.game-card h3 { margin: 0; font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; padding-inline-end: 70px; }
.gc-meta { display: flex; flex-wrap: wrap; gap: 8px 12px; color: var(--text-2); font-size: .82rem; }
.gc-meta span { display: inline-flex; align-items: center; gap: 5px; flex: none; }
.gc-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 6px; }

/* ── תגי סטטוס / סוג ── */
.chip { display: inline-flex; align-items: center; gap: 5px; font-size: .72rem; font-weight: 700;
    padding: 3px 10px; border-radius: 999px; border: 1px solid transparent; white-space: nowrap; flex: none; }
.chip-quiz  { background: var(--accent-soft); color: var(--accent-ink); }
.chip-poll  { background: rgba(79,157,222,.14); color: #9cc9f0; }
.chip-mixed { background: rgba(88,185,138,.14); color: #93d6b5; }
.chip-draft    { background: var(--surface-2); color: var(--text-3); }
.chip-ready    { background: var(--success-soft); color: var(--success); }
.chip-archived { background: var(--surface-2); color: var(--text-3); }
.chip-unverified { background: rgba(217,162,58,.16); color: #f2c46b; border: 1px solid rgba(217,162,58,.35); }
.chip-verified { background: var(--success-soft); color: var(--success); border: 1px solid rgba(88,185,138,.4); }
.pool-owner { padding: 5px 8px; font-size: .82rem; min-width: 150px; width: auto; }
.pool-warn { color: var(--warning); font-size: .72rem; font-weight: 600; margin-top: 4px; }
.pool-idle { color: var(--text-3); font-size: .72rem; margin-top: 4px; }
.dh-mynum { margin-top: 12px; display: inline-flex; align-items: center; gap: 7px; font-size: .92rem; color: var(--text-2);
    background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: 6px 14px; }
.dh-mynum b { color: var(--accent-ink); letter-spacing: .5px; }
.dh-mynum-sub { color: var(--text-3); font-size: .8rem; }
.chip-halachic { background: rgba(217,162,58,.18); color: #f2c46b; border: 1px solid rgba(217,162,58,.5); font-weight: 700; }

/* ── תצוגה מקדימה של הלוגו בגדלים שבהם הוא באמת מופיע (כהה + בהיר) ── */
.logo-preview { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.lp-row { display: flex; align-items: flex-end; gap: 18px; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--border-2); }
.lp-dark  { background: #0e0f13; }
.lp-light { background: #f4f2ee; }
.lp-item { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.lp-item img { object-fit: contain; display: block; }
.lp-cap { font-size: .68rem; white-space: nowrap; }
.lp-dark  .lp-cap { color: #8b8578; }
.lp-light .lp-cap { color: #6b6459; }
.lp-note { font-size: .78rem; color: var(--text-3); line-height: 1.5; }
.chip-live     { background: var(--accent-soft); color: var(--accent-ink); }

/* ── מאגר מספרים ── */
.pool-intro { display: flex; gap: 16px; align-items: flex-start; }
.pi-ic { flex: none; width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-2); }
.pool-intro code { background: var(--bg-2); border: 1px solid var(--border); border-radius: 5px; padding: 1px 6px; font-size: .85em; }
.pool-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.ps-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; }
.ps-card .ps-k { color: var(--text-3); font-size: .8rem; margin-bottom: 6px; }
.ps-card .ps-v { font-family: var(--font-display); font-weight: 800; font-size: 1.7rem; line-height: 1; }
.ps-card.ps-free { border-color: color-mix(in srgb, var(--success) 45%, transparent); }
.ps-card.ps-free .ps-v { color: var(--success); }
@media (max-width: 720px) { .pool-stats { grid-template-columns: repeat(2, 1fr); } }

/* ── טפסים ── */
.form-grid { display: grid; gap: 16px; }
.form-row { display: grid; gap: 6px; }
.form-row label { font-size: .82rem; font-weight: 600; color: var(--text); }
.form-row .hint { font-size: .82rem; line-height: 1.5; color: var(--text-2); }   /* קריא יותר גם לעין מבוגרת (זליג) */
.sys-audio-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; max-width: 640px; }
.sys-audio-grid audio { width: 100%; max-width: 210px; }
@media (max-width: 820px) { .sys-audio-grid { grid-template-columns: 1fr; } }
.sys-audio-h { font-family: var(--font-display); font-size: 1rem; font-weight: 800; display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.bg-track { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 10px; background: var(--bg-2); }
.bg-track.is-def { border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: var(--accent-soft); }
.bg-def { display: flex; align-items: center; gap: 6px; font-size: .8rem; color: var(--text-2); white-space: nowrap; cursor: pointer; }
.bg-track audio { height: 34px; max-width: 230px; }
.bg-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; color: var(--text-2); }

/* ── דשבורד ניהול-הפלטפורמה ── */
.admin-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.admin-kpi-sub { color: var(--text-3); font-size: .78rem; margin-top: 4px; }
.admin-cols { display: grid; grid-template-columns: 1.7fr 1fr; gap: 18px; align-items: start; }
.admin-side { display: flex; flex-direction: column; gap: 12px; }
.admin-link { display: flex; align-items: center; gap: 13px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 15px 16px; text-decoration: none; color: var(--text); transition: background .15s, border-color .15s; position: relative; }
.admin-link:hover { background: var(--surface-2); border-color: var(--border-2); }
.al-ic { flex: none; width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-2); }
.al-t { font-family: var(--font-display); font-weight: 800; font-size: 1rem; }
.al-s { color: var(--text-3); font-size: .8rem; margin-top: 2px; }
.admin-link.admin-soon { cursor: default; opacity: .72; }
.admin-link.admin-soon:hover { background: var(--surface); border-color: var(--border); }
.al-soon { margin-inline-start: auto; font-size: .68rem; font-weight: 700; background: var(--surface-2); color: var(--text-3); padding: 3px 9px; border-radius: 999px; }
@media (max-width: 900px) { .admin-cols { grid-template-columns: 1fr; } .admin-kpis { grid-template-columns: repeat(2, 1fr); } }

/* ── מנויים ── */
.subs-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
.plans-editor { display: flex; flex-direction: column; gap: 10px; }
.plan-row { display: grid; grid-template-columns: 1fr 1.4fr 1fr 1fr; gap: 12px; align-items: end; background: var(--bg-2); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; }
.pf { display: grid; gap: 5px; }
.pf label { font-size: .74rem; color: var(--text-3); }
.input-sm { padding: 6px 9px; font-size: .85rem; }
.t-plan { min-width: 130px; }
.btn-paid { background: var(--success-soft); color: var(--success); border: 1px solid color-mix(in srgb, var(--success) 45%, transparent); }
@media (max-width: 760px) { .subs-summary { grid-template-columns: 1fr; } .plan-row { grid-template-columns: 1fr 1fr; } }
.input, .textarea, .select {
    width: 100%; padding: 11px 13px; border: 1.5px solid var(--border-2); border-radius: 10px;
    background: var(--bg); color: var(--text); font-family: inherit; font-size: .95rem; outline: none; transition: border-color .15s;
}
.input:focus, .textarea:focus, .select:focus { border-color: var(--accent); }
/* טבעת-מיקוד למקלדת בשדות-קלט — ה-outline:none למעלה ביטל אותה למשתמשי-מקלדת (a11y). */
.field input:focus-visible, .input:focus-visible, .textarea:focus-visible, .select:focus-visible {
    outline: 2px solid var(--accent); outline-offset: 2px;
}
.textarea { resize: vertical; min-height: 92px; line-height: 1.6; }
.textarea.grow { min-height: 120px; }
.row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.seg { display: inline-flex; background: var(--bg); border: 1.5px solid var(--border-2); border-radius: 10px; padding: 3px; gap: 3px; }
.seg button { border: none; background: transparent; color: var(--text-2); font-family: inherit; font-weight: 700; font-size: .84rem;
    padding: 7px 14px; border-radius: 8px; cursor: pointer; transition: background .14s, color .14s; }
.seg button.on { background: var(--accent); color: #1a1305; box-shadow: 0 1px 4px rgba(0,0,0,.16); }
.seg button.pop { animation: seg-pop .24s ease; }
@keyframes seg-pop { 0%, 100% { transform: scale(1); } 45% { transform: scale(1.09); } }
@media (prefers-reduced-motion: reduce) { .seg button.pop { animation: none; } }
/* מובייל: שורות-הגדרה דו-טוריות נערמות לטור, ומתגים ארוכים נכרכים במקום לגלוש אופקית (עורך-משחק בטלפון). */
@media (max-width: 560px) {
    .row-2 { grid-template-columns: 1fr; }
    .seg { flex-wrap: wrap; }
}

/* ── פריסת העורך (רשימת שאלות | עורך שאלה) ── */
.editor-layout { display: grid; grid-template-columns: 320px 1fr; gap: 18px; align-items: start; }
/* מובייל: העורך נערם לעמודה אחת; min-width:0 מונע גלישה אופקית (חתך צ'קבוקס "נכון") */
@media (max-width: 760px) {
    .editor-layout { grid-template-columns: 1fr; }
    .editor-layout > .q-list { position: static; }
    .editor-layout > .q-list, .editor-layout > .q-editor { min-width: 0; }
    .q-editor { padding: 16px 14px; }
    .q-editor-head { flex-wrap: wrap; }
    .qeh-actions { flex-wrap: wrap; width: 100%; }
    .type-tabs { flex-wrap: wrap; }
}
@media (max-width: 980px) { .editor-layout { grid-template-columns: 1fr; } }

.q-list { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; position: sticky; top: 84px; }
.q-list-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 6px 10px; }
.q-list-head h3 { margin: 0; font-size: .95rem; font-family: var(--font-display); }
.q-items { display: flex; flex-direction: column; gap: 6px; max-height: 62vh; overflow-y: auto; }
.q-item { display: flex; align-items: center; gap: 10px; padding: 10px 11px; border-radius: 10px; background: var(--bg-2);
    border: 1px solid var(--border); cursor: pointer; transition: border-color .14s, background .14s; }
.q-item:hover { border-color: var(--border-2); }
.q-item.active { border-color: var(--accent); background: var(--accent-soft); }
.q-item .q-num { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px;
    background: var(--surface-2); color: var(--text-2); font-weight: 800; font-size: .76rem; }
.q-item.active .q-num { background: var(--accent); color: #1a1305; }
.q-item .q-label { flex: 1; min-width: 0; font-size: .86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.q-item .q-drag { flex: none; color: var(--text-3); cursor: grab; opacity: .6; }
.q-item.dragging { opacity: .4; }
.q-item.drop-target { border-color: var(--accent-2); border-style: dashed; }

/* ── עורך שאלה ── */
.q-editor { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 22px 24px; }
.q-editor.empty { display: grid; place-items: center; min-height: 300px; color: var(--text-3); text-align: center; }
.q-editor-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px;
    padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.type-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.type-tab { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 9px; cursor: pointer;
    background: var(--bg); border: 1.5px solid var(--border-2); color: var(--text-2); font-weight: 700; font-size: .82rem; transition: all .14s; }
.type-tab:hover { color: var(--text); }
.type-tab.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-ink); }

/* ── תשובות ── */
.answers { display: flex; flex-direction: column; gap: 10px; }
.answer-row { display: flex; align-items: center; gap: 10px; }
.answer-digit { flex: none; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; font-weight: 800;
    color: #1a1305; font-size: .95rem; }
.answer-row[data-digit="1"] .answer-digit { background: var(--ans-1); }
.answer-row[data-digit="2"] .answer-digit { background: var(--ans-2); }
.answer-row[data-digit="3"] .answer-digit { background: var(--ans-3); }
.answer-row[data-digit="4"] .answer-digit { background: var(--ans-4); }
.answer-row[data-digit="5"] .answer-digit { background: var(--ans-5); }
.answer-row[data-digit="6"] .answer-digit { background: var(--ans-6); }
.answer-row .input { flex: 1; }
/* הבלטת תשובה נכונה + אזהרות-ולידציה */
.answer-row.is-correct .input { border-color: var(--success); background: color-mix(in srgb, var(--success) 7%, var(--bg)); }
.ans-warn { margin-top: 10px; font-size: .82rem; color: var(--warning); font-weight: 700; }
.q-warn-mark { color: var(--warning); font-size: .95rem; margin: 0 4px; }
.q-item.q-warn { border-inline-start: 2px solid var(--warning); }

/* מודאל תצוגה-מקדימה (מדמה את המקרן — תמיד כהה) */
.qeh-actions { display: flex; align-items: center; gap: 8px; }
.qeh-autosave { display: inline-flex; align-items: center; gap: 5px; font-size: .76rem; font-weight: 700; color: var(--success); margin-inline-end: 4px; white-space: nowrap; }
.qeh-autosave svg { color: var(--success); }
.preview-modal { max-width: 760px; width: 100%; padding: 0; overflow: hidden; }
.pv-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; border-block-end: 1px solid var(--border); font-size: .85rem; font-weight: 700; color: var(--text-2); }
.pv-x { border: none; background: var(--surface-2); color: var(--text-2); width: 32px; height: 32px; border-radius: 8px; cursor: pointer; font-size: 1.05rem; }
.pv-screen { background: #0f1116; color: #f5f1e8; padding: 44px 36px; min-height: 320px; display: flex; flex-direction: column; justify-content: center;
    background-image: radial-gradient(60% 55% at 85% -10%, rgba(204,154,78,.07), transparent 60%); }
.pv-q { font-family: var(--font-display); font-weight: 800; font-size: 1.9rem; line-height: 1.2; text-align: center; margin-bottom: 24px; color: #f5f1e8; }
.pv-bars { display: flex; flex-direction: column; gap: 12px; }
.pv-bar { display: flex; align-items: center; gap: 14px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 12px; padding: 14px 18px; }
.pv-badge { width: 36px; height: 36px; flex: none; border-radius: 9px; display: grid; place-items: center; font-weight: 800; color: #14110a; background: var(--c,var(--accent)); }
.pv-label { font-size: 1.15rem; font-weight: 600; color: #f5f1e8; }

/* טאבים בפאנל הגדרות-המשחק (פיצול הטופס הארוך) */
.settings-tabs { display: flex; gap: 4px; border-block-end: 1px solid var(--border); margin-bottom: 20px; flex-wrap: wrap; }
.stab { border: none; background: none; color: var(--text-2); font-family: inherit; font-weight: 700; font-size: .92rem;
    padding: 11px 16px; cursor: pointer; border-block-end: 2px solid transparent; margin-block-end: -1px;
    display: inline-flex; align-items: center; gap: 7px; min-height: 44px; }
.stab:hover { color: var(--text); }
.stab.on { color: var(--accent-ink); border-block-end-color: var(--accent); }

/* ── עמוד עזרה ומדריכים ── */
.guide-intro { margin-bottom: 18px; }
.guide-list { display: flex; flex-direction: column; gap: 12px; }
.guide-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.guide-item summary { display: flex; align-items: center; gap: 14px; padding: 16px 20px; cursor: pointer; list-style: none; user-select: none; min-height: 44px; }
.guide-item summary::-webkit-details-marker { display: none; }
.guide-item summary:hover { background: var(--surface-2); }
.gi-ic { flex: none; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-2); }
.gi-head { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gi-title { font-family: var(--font-display); font-weight: 800; font-size: 1.05rem; }
.gi-sub { color: var(--text-3); font-size: .82rem; }
.gi-chev { color: var(--text-3); transition: transform .18s; }
.guide-item[open] .gi-chev { transform: rotate(90deg); color: var(--accent-ink); }
.gi-body { padding: 2px 20px 20px; }
.gi-steps { margin: 14px 0 0; padding: 0; counter-reset: step; list-style: none; display: flex; flex-direction: column; gap: 13px; }
.gi-steps li { position: relative; padding-inline-start: 40px; color: var(--text-2); font-size: .92rem; line-height: 1.65; }
.gi-steps li::before { counter-increment: step; content: counter(step); position: absolute; inset-inline-start: 0; inset-block-start: -1px; width: 26px; height: 26px; border-radius: 50%; background: var(--accent); color: #1a1305; font-weight: 800; font-size: .8rem; display: grid; place-items: center; }
.gi-steps li b { color: var(--text); }
.gi-steps code { background: var(--bg-2); border: 1px solid var(--border); border-radius: 6px; padding: 2px 7px; font-size: .84em; display: inline-block; margin: 3px 0; line-height: 1.7; }

/* ── מודאל הרצה: חיווי הקצאה-אוטומטית ── */
.run-auto { display: flex; gap: 14px; align-items: flex-start; background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); border-radius: 12px; padding: 14px 16px; margin: 0 0 18px; }
.run-auto-ic { flex: none; color: var(--accent-2); margin-top: 1px; }
.run-auto-title { font-family: var(--font-display); font-weight: 800; font-size: 1rem; }
.run-auto-sub { color: var(--text-2); font-size: .86rem; line-height: 1.55; margin-top: 3px; }
.run-auto-sub a { color: var(--accent-ink); font-weight: 700; }
.run-auto-warn { background: color-mix(in srgb, #d98b3a 13%, var(--surface)); border-color: color-mix(in srgb, #d98b3a 40%, transparent); }
.run-auto-warn .run-auto-ic { color: #d98b3a; }

.answer-correct { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; color: var(--text-2); cursor: pointer;
    white-space: nowrap; user-select: none; }
.answer-correct input { accent-color: var(--success); width: 17px; height: 17px; }
.answer-correct.on { color: var(--success); }
.answer-remove { flex: none; background: none; border: none; color: var(--text-3); cursor: pointer; padding: 4px; border-radius: 6px; }
.answer-remove:hover { color: var(--danger); background: rgba(224,101,124,.1); }

/* ── מדיה ── */
.media-drop { border: 1.5px dashed var(--border-2); border-radius: 12px; padding: 20px 18px; text-align: center; color: var(--text-3);
    cursor: pointer; transition: border-color .14s, background .14s, color .14s;
    display: flex; flex-direction: column; align-items: center; gap: 4px; }
.media-drop .md-ic { color: var(--accent); margin-bottom: 4px; }
.media-drop .md-main { font-weight: 700; font-size: .9rem; color: var(--text-2); }
.media-drop .md-sub { font-size: .74rem; color: var(--text-3); letter-spacing: .03em; }
.media-drop:hover, .media-drop.over { border-color: var(--accent); background: var(--accent-soft); }
.media-drop:hover .md-main, .media-drop.over .md-main { color: var(--accent-ink); }
.media-drop.uploading { cursor: default; }
.media-drop .mp-bar { height: 7px; margin: 10px auto 6px; max-width: 260px; background: var(--surface-2); border-radius: 999px; overflow: hidden; }
.media-drop .mp-bar-fill { display: block; height: 100%; width: 0; background: var(--accent); border-radius: 999px; transition: width .18s ease; }
.media-drop .mp-pct { font-variant-numeric: tabular-nums; font-weight: 700; }
.media-preview { display: flex; align-items: center; gap: 12px; background: var(--bg-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.media-preview img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; flex: none; }
.media-preview .mp-video { max-width: 320px; max-height: 200px; border-radius: 8px; background: #000; flex: none; }
.media-preview .mp-info { flex: 1; min-width: 0; font-size: .82rem; }
.media-preview audio { height: 34px; }

.section-title { font-family: var(--font-display); font-size: .95rem; font-weight: 700; color: var(--text);
    margin: 20px 0 10px; padding-top: 16px; border-top: 1px solid var(--border); }
.section-title:first-of-type { border-top: none; padding-top: 0; }

/* ── דגלים / הודעות ריקות ── */
.empty-state { text-align: center; padding: 60px 20px; color: var(--text-3); }
.empty-state .es-icon { color: var(--text-3); opacity: .6; margin-bottom: 12px; }
.empty-state h3 { font-family: var(--font-display); color: var(--text-2); margin-bottom: 6px; }

/* ── קלט-קובץ מותאם (ה-input הילידי מוסתר; הטריגר הוא label בעיצוב .btn הרגיל, שם-הקובץ מוצג לצידו) ── */
.file-input { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.file-input-name { color: var(--text-3); font-size: .85rem; }

/* ── מודאל ── */
.modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.6); display: grid; place-items: center; z-index: 80; padding: 20px; }
.modal { background: var(--surface); border: 1px solid var(--border-2); border-radius: var(--radius-lg); padding: 26px; width: 100%; max-width: 460px; max-height: calc(100vh - 40px); overflow-y: auto; box-shadow: var(--shadow-lg); }
.modal h3 { font-family: var(--font-display); margin-bottom: 6px; }
.modal .modal-actions { display: flex; justify-content: flex-start; gap: 10px; margin-top: 22px; }
.modal.modal-lg { max-width: 640px; }
[hidden] { display: none !important; }

/* ── מרשם משתתפים: ייבוא + רשימת-שמות עם עריכה/מחיקה ── */
.roster-import { border: 1px solid var(--border-2); border-radius: 10px; padding: 12px 14px; background: var(--surface-2); margin-bottom: 16px; }
.roster-sec-label { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: .86rem; color: var(--accent-ink); margin-bottom: 4px; }
.roster-import-actions { display: flex; align-items: center; gap: 12px; margin-top: 10px; flex-wrap: wrap; }
.roster-list-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.roster-check-all { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: .88rem; cursor: pointer; }
.roster-bulk { display: flex; gap: 8px; }
.roster-list { max-height: 46vh; overflow-y: auto; border: 1px solid var(--border-2); border-radius: 10px; }
.roster-empty { padding: 22px; text-align: center; }
.roster-row { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; padding: 7px 12px; border-bottom: 1px solid var(--border); transition: background .5s; }
.roster-row:last-child { border-bottom: none; }
.roster-row.saved { background: var(--accent-soft); }
.roster-row .roster-name { padding: 6px 10px; font-size: .9rem; }
.roster-row .roster-phone { font-size: .82rem; color: var(--text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.roster-row .roster-del { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 1px solid var(--border-2); border-radius: 8px; background: transparent; color: var(--text-2); cursor: pointer; transition: color .14s, border-color .14s, background .14s; }
.roster-row .roster-del:hover { color: #fff; background: var(--danger, #c0392b); border-color: var(--danger, #c0392b); }

/* ============================================================
   M4 — קוקפיט המנחה
   ============================================================ */
.mon-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 16px; }
.mon { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 18px; }
.mon-k { display: flex; align-items: center; gap: 7px; color: var(--text-2); font-size: .8rem; font-weight: 600; }
.mon-v { font-family: var(--font-display); font-weight: 800; font-size: 2rem; margin-top: 4px; }
.mon-phase { font-size: 1.3rem; }
.mon-phase.open { color: var(--success); }
.mon-phase.ph-reveal { color: var(--accent-2); }
.mon-phase.ph-leaderboard { color: var(--accent); }

.present-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.present-top .pt-right { display: flex; gap: 10px; flex-wrap: wrap; }

.present-cols { display: grid; grid-template-columns: 300px 1fr; gap: 16px; align-items: start; }
@media (max-width: 900px) { .present-cols { grid-template-columns: 1fr; } }

.q-nav { padding: 12px; }
.q-nav-list { display: flex; flex-direction: column; gap: 5px; max-height: 62vh; overflow-y: auto; }
.q-nav-item { display: flex; align-items: center; gap: 10px; padding: 10px 11px; border-radius: 10px; background: var(--bg-2);
    border: 1px solid var(--border); cursor: pointer; text-align: start; font-family: inherit; color: var(--text); transition: border-color .14s; }
.q-nav-item:hover { border-color: var(--border-2); }
.q-nav-item.sel { border-color: var(--accent); }
.q-nav-item.current { background: var(--accent-soft); }
.q-nav-item .q-num { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; background: var(--surface-2); color: var(--text-2); font-weight: 800; font-size: .76rem; }
.q-nav-item.current .q-num { background: var(--accent); color: #1a1305; }
.q-nav-item .q-nav-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.q-nav-item .q-label { max-width: 100%; font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.q-nav-item .q-type { font-size: .66rem; font-weight: 800; padding: 1px 8px; border-radius: 999px; background: var(--surface-2); color: var(--text-2); letter-spacing: .02em; }
.q-nav-item .q-type-poll { background: var(--accent-soft); color: var(--accent); }
.q-nav-item .q-type-truefalse { background: rgba(88,185,138,.14); color: var(--success); }
.q-nav-item .q-nav-state { flex: none; font-size: .7rem; font-weight: 800; color: var(--success); }

.present-main { display: flex; flex-direction: column; gap: 16px; min-height: 340px; }
.present-live { flex: 1; }
.pl-empty { display: grid; place-items: center; min-height: 200px; text-align: center; }
.pl-q { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; margin-bottom: 16px; }
.pl-bars { display: flex; flex-direction: column; gap: 10px; }
.pl-bar { position: relative; display: flex; align-items: center; gap: 12px; background: var(--bg-2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; min-height: 46px; }
.pl-bar > * { position: relative; z-index: 1; }
.pl-fill { position: absolute; inset-block: 0; inset-inline-start: 0; z-index: 0; background: var(--c); opacity: .28; transition: width .6s cubic-bezier(.4,0,.2,1); }
.pl-badge { flex: none; width: 30px; height: 30px; margin-inline-start: 10px; display: grid; place-items: center; border-radius: 8px; background: var(--c); color: #14110a; font-weight: 800; }
.pl-label { flex: 1; font-weight: 700; }
.pl-pct { flex: none; padding-inline-end: 14px; color: var(--text-2); font-weight: 700; font-variant-numeric: tabular-nums; }
.pl-bar.correct { border-color: var(--success); box-shadow: inset 0 0 0 1px var(--success); }
.pl-bar.correct .pl-pct { color: var(--success); }

.control-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 14px; border-top: 1px solid var(--border); }

/* ── M7: דוחות ── */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.rep-table { width: 100%; border-collapse: collapse; }
.rep-table th { text-align: start; font-size: .78rem; color: var(--text-3); font-weight: 700; padding: 8px 12px; border-bottom: 1px solid var(--border); }
.rep-table td { padding: 11px 12px; border-bottom: 1px solid var(--border); font-size: .9rem; }
.rep-table tr:hover td { background: var(--bg-2); }
.rep-q { padding: 16px 0; border-bottom: 1px solid var(--border); }
.rep-q:last-child { border-bottom: none; }
.rep-q-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; flex-wrap: wrap; }
.rep-q-title { font-weight: 700; font-size: 1.02rem; display: flex; align-items: center; gap: 10px; }
.rep-q-title .q-num { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; background: var(--surface-2); color: var(--text-2); font-weight: 800; font-size: .76rem; }
.rep-q-stats { display: flex; gap: 14px; color: var(--text-2); font-size: .84rem; }
.rep-q-stats .ok { color: var(--success); font-weight: 700; }

/* ── ספריית מדיה ── */
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.media-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.mi-thumb { height: 130px; display: grid; place-items: center; background: var(--bg-2); overflow: hidden; }
.mi-thumb img { width: 100%; height: 100%; object-fit: cover; }
.mi-thumb.mi-audio { flex-direction: column; gap: 8px; color: var(--text-3); padding: 12px; }
.mi-thumb.mi-audio audio { width: 100%; height: 32px; }
.mi-meta { padding: 10px 12px; }
.mi-name { font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 8px; }
.mi-actions { display: flex; gap: 6px; justify-content: space-between; }

/* ── בוחר מהספרייה (מודאל) ── */
.lib-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; max-height: 340px; overflow-y: auto; margin-top: 12px; }
.lib-pick { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; cursor: pointer; background: var(--bg-2); transition: border-color .14s; }
.lib-pick:hover { border-color: var(--accent); }
.lib-pick .lp-thumb { height: 74px; display: grid; place-items: center; color: var(--text-3); }
.lib-pick .lp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.lib-pick .lp-name { font-size: .7rem; padding: 5px 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-2); }

/* ── עזר חיבור טכנוליין ── */
.conn-help summary { cursor: pointer; font-weight: 700; font-size: .95rem; display: flex; align-items: center; gap: 8px; list-style: none; }
.conn-help summary::-webkit-details-marker { display: none; }
.conn-url { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--bg-2); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; }
.conn-url code { font-size: .9rem; color: var(--accent-2); word-break: break-all; direction: ltr; text-align: left; flex: 1; min-width: 220px; }

/* ── טאבים כניסה/הרשמה ── */
.auth-tabs { display: flex; gap: 6px; background: var(--bg); border: 1px solid var(--border-2); border-radius: 12px; padding: 4px; margin-bottom: 16px; }
.auth-tab { flex: 1; border: none; background: transparent; color: var(--text-2); font-family: inherit; font-weight: 700; font-size: .92rem; padding: 10px; border-radius: 9px; cursor: pointer; transition: background .14s, color .14s; }
.auth-tab.on { background: var(--accent); color: #1a1305; }

/* ── ספינר טעינה (כפתורים) ── */
.spinner { display:inline-block; width:16px; height:16px; border:2px solid rgba(26,19,5,.3); border-top-color:#1a1305; border-radius:50%; animation:spin .7s linear infinite; vertical-align:-3px; }
.btn-secondary .spinner, .btn-ghost .spinner { border-color:rgba(255,255,255,.25); border-top-color:var(--accent-2); }
@keyframes spin { to { transform:rotate(360deg); } }

/* ============================================================
   דשבורד עשיר — "scoreboard" (תחרות/אקשן, מסודר)
   ============================================================ */
.dash-hero { position:relative; overflow:hidden; background:linear-gradient(120deg, var(--surface) 0%, var(--surface-2) 100%);
    border:1px solid var(--border); border-radius:var(--radius-lg); padding:30px 34px; margin-bottom:20px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.dash-hero::before { content:""; position:absolute; inset-block:-40%; inset-inline-end:-6%; width:340px;
    background:radial-gradient(circle at 60% 40%, var(--accent-soft), transparent 62%); pointer-events:none; }
.dash-hero .dh-mark { position:absolute; inset-block-start:-30px; inset-inline-start:-10px; color:var(--accent); opacity:.06; transform:rotate(-12deg); pointer-events:none; }
.dash-hero .dh-mark svg { width:200px; height:200px; }
.dh-text { position:relative; z-index:1; }
.dh-hi { color:var(--text-2); font-size:.9rem; font-weight:600; margin-bottom:4px; }
.dh-title { font-family:var(--font-display); font-weight:900; font-size:clamp(1.6rem,3vw,2.4rem); line-height:1.1; }
.dh-title .g { color:var(--accent-2); }
.dh-cta { position:relative; z-index:1; display:flex; gap:12px; flex-wrap:wrap; }

.dash-stats { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-bottom:24px; }
@media (max-width:1100px){ .dash-stats { grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .dash-stats { grid-template-columns:repeat(2,1fr); } }
.dstat { position:relative; overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:20px 22px; transition:transform .18s, border-color .18s, box-shadow .18s; }
.dstat:hover { transform:translateY(-3px); border-color:var(--c,var(--accent)); box-shadow:0 14px 34px rgba(0,0,0,.4); }
.dstat::after { content:""; position:absolute; inset-block-start:0; inset-inline:0; height:3px; background:var(--c,var(--accent)); opacity:.9; }
.dstat .ds-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.dstat .ds-ic { width:46px; height:46px; border-radius:13px; display:grid; place-items:center; color:#14110a;
    background:var(--c,var(--accent)); box-shadow:0 6px 16px color-mix(in srgb, var(--c,var(--accent)) 20%, transparent); }
.dstat .ds-val { font-family:var(--font-display); font-weight:900; font-size:2.6rem; line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.dstat .ds-label { color:var(--text-2); font-size:.86rem; font-weight:600; margin-top:6px; display:flex; align-items:center; gap:6px; }
.dstat.live-stat .ds-val { color:var(--success); }

.dash-section { margin-bottom:24px; }
.dash-sec-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.dash-sec-head h2 { font-family:var(--font-display); font-size:1.15rem; display:flex; align-items:center; gap:9px; }
.dash-sec-head h2 .bar { width:4px; height:20px; border-radius:3px; background:var(--accent); }
.dash-sec-head a { font-size:.85rem; color:var(--accent-2); font-weight:700; }

/* פעולות מהירות */
.quick-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; }
.quick { display:flex; align-items:center; gap:14px; background:var(--surface); border:1px solid var(--border); border-radius:14px;
    padding:16px 18px; cursor:pointer; transition:transform .16s, border-color .16s, background .16s; text-align:start; }
.quick:hover { transform:translateY(-2px); border-color:var(--accent); background:var(--surface-2); }
.quick .q-ic { width:44px; height:44px; flex:none; border-radius:12px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent-2); }
.quick .q-tx { flex:1; min-width:0; }
.quick .q-t { font-weight:700; font-size:.98rem; }
.quick .q-s { color:var(--text-3); font-size:.78rem; }
.quick .q-arrow { color:var(--text-3); transition:transform .16s, color .16s; }
.quick:hover .q-arrow { color:var(--accent-2); transform:translateX(-4px); }

/* אירועים חיים כעת */
.live-now { background:linear-gradient(120deg, rgba(63,174,142,.1), rgba(63,174,142,.02)); border:1px solid rgba(63,174,142,.3); }
.live-now .dstat::after { background:var(--success); }

/* count-up: מסתיר ריצוד */
[data-count] { font-variant-numeric:tabular-nums; }

/* ── שתי-עמודות (משחקים אחרונים / חי + טכנוליין) ── */
.dash-cols { display:grid; grid-template-columns:1.35fr 1fr; gap:20px; align-items:start; margin-bottom:24px; }
@media (max-width:900px){ .dash-cols { grid-template-columns:1fr; } }
.dcard { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.dcard-head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px 18px; border-block-end:1px solid var(--border); }
.dcard-head h3 { margin:0; font-family:var(--font-display); font-size:1.05rem; display:flex; align-items:center; gap:9px; }
.dcard-head .mini-link { font-size:.82rem; color:var(--accent-2); font-weight:700; }
.dcard-body { padding:8px 8px; }
.empty-mini { padding:26px 18px; text-align:center; color:var(--text-3); }
.empty-mini svg { opacity:.4; margin-bottom:8px; }

/* משחקים אחרונים */
.recent-item { display:flex; align-items:center; gap:12px; padding:11px 12px; border-radius:12px; transition:background .14s; }
.recent-item:hover { background:var(--surface-2); }
.recent-item + .recent-item { border-block-start:1px solid var(--border); }
.recent-item .ri-badge { width:38px; height:38px; flex:none; border-radius:11px; display:grid; place-items:center;
    background:var(--accent-soft); color:var(--accent-2); font-weight:800; font-family:var(--font-display); }
.recent-item .ri-main { flex:1; min-width:0; }
.recent-item .ri-title { font-weight:700; font-size:.96rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.recent-item .ri-meta { color:var(--text-3); font-size:.78rem; display:flex; gap:10px; margin-top:2px; }
.recent-item .ri-go { flex:none; }

/* אירועים חיים כעת */
.live-item { display:flex; align-items:center; gap:11px; padding:12px; border-radius:12px; background:var(--success-soft); border:1px solid rgba(63,174,142,.28); }
.live-item + .live-item { margin-top:8px; }
.live-dot { width:10px; height:10px; border-radius:50%; background:var(--success); flex:none; box-shadow:0 0 0 0 rgba(63,174,142,.6); animation:livepulse 1.6s infinite; }
@keyframes livepulse { 0%{box-shadow:0 0 0 0 rgba(63,174,142,.55);} 70%{box-shadow:0 0 0 10px rgba(63,174,142,0);} 100%{box-shadow:0 0 0 0 rgba(63,174,142,0);} }
.live-item .li-main { flex:1; min-width:0; }
.live-item .li-title { font-weight:700; font-size:.94rem; }
.live-item .li-meta { color:var(--text-2); font-size:.78rem; }

/* הדבקת שאלות במודאל משחק-חדש */
.ng-paste-wrap { margin:4px 0; border-top:1px solid var(--border); padding-top:12px; }
.ng-paste-wrap summary { cursor:pointer; display:flex; align-items:center; gap:8px; font-size:.88rem; font-weight:700; color:var(--accent-ink); user-select:none; min-height:34px; }
.ng-paste-wrap summary::-webkit-details-marker { display:none; }
.ng-paste-wrap summary:hover { color:var(--accent-2); }
.ng-paste-body { padding-top:10px; }
.ng-paste-body textarea { width:100%; font-family:ui-monospace,monospace; font-size:.82rem; line-height:1.6; }

/* סינון משחקים לפי גיל+קושי + תגים */
.games-filter { display:flex; flex-wrap:wrap; gap:10px 22px; margin-bottom:18px; padding:12px 16px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.gf-group { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.gf-label { font-size:.8rem; color:var(--text-3); font-weight:700; margin-inline-end:2px; }
.chip.gf { cursor:pointer; background:var(--surface-2); border:1px solid var(--border-2); color:var(--text-2); font-weight:600; }
.chip.gf:hover { border-color:var(--accent); color:var(--text); }
.chip.gf.on { background:var(--accent); border-color:var(--accent); color:#1a1305; }
:root[data-theme="light"] .chip.gf.on { color:#fff; }
.chip-age { background:var(--accent-soft); color:var(--accent-ink); }
.chip-level-easy { background:var(--success-soft); color:var(--success); }
.chip-level-medium { background:rgba(217,162,58,.16); color:var(--warning); }
.chip-level-hard { background:rgba(224,101,124,.16); color:var(--danger); }
.chip-level-expert { background:rgba(139,26,52,.22); color:#e0657c; font-weight:800; }
/* סרגל-סינון לפי רמת-קושי */
.tpl-filters { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.tpl-filters .tf-label { color:var(--text); opacity:.6; font-size:.9rem; font-weight:600; }
.tf-btn { cursor:pointer; border:1.5px solid var(--border-2); background:var(--bg); color:var(--text);
  border-radius:999px; padding:7px 15px; font-family:inherit; font-size:.92rem; font-weight:600; transition:border-color .15s, background .15s, color .15s; }
.tf-btn:hover { border-color:var(--accent); }
.tf-btn.active { background:var(--accent); border-color:var(--accent); color:#1a1305; }
.tf-btn.tf-easy.active { background:var(--success); border-color:var(--success); color:#fff; }
.tf-btn.tf-medium.active { background:var(--warning); border-color:var(--warning); color:#241a06; }
.tf-btn.tf-hard.active { background:var(--danger); border-color:var(--danger); color:#fff; }
.tf-btn.tf-expert.active { background:#8b1a34; border-color:#8b1a34; color:#fff; }
/* בורר-אורך במודאל-ההרצה (30/50/90/הכל) */
.run-length { margin:6px 0 8px; }
.run-length-lbl { font-size:.92rem; font-weight:600; color:var(--text); margin-bottom:9px; }
.run-length-pool { opacity:.55; font-weight:500; font-size:.85rem; }
.run-length-opts { display:flex; gap:8px; flex-wrap:wrap; }
.rl-opt { cursor:pointer; border:1.5px solid var(--border-2); background:var(--bg); color:var(--text);
  border-radius:10px; padding:9px 18px; font-family:inherit; font-size:.98rem; font-weight:700; transition:border-color .15s, background .15s, color .15s; }
.rl-opt:hover { border-color:var(--accent); }
.rl-opt.active { background:var(--accent); border-color:var(--accent); color:#1a1305; }

/* ============================================================
   פס בקרת איכות (קומפקטי, חיובי) — super בלבד
   ============================================================ */
.qa-strip { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px 20px; margin-bottom:24px; }
.qa-strip-main { display:flex; align-items:center; gap:14px; }
.qa-strip-ic { flex:none; width:40px; height:40px; border-radius:11px; display:grid; place-items:center;
    background:var(--success-soft); color:var(--success); }
.qa-strip-t { font-family:var(--font-display); font-weight:800; font-size:1.02rem; }
.qa-strip-s { color:var(--text-2); font-size:.85rem; margin-top:2px; }
.qa-strip-s b { color:var(--accent-ink); font-variant-numeric:tabular-nums; }

/* נעילת סרגל-בקרת-המנחה בזמן פקודה (מונע דאבל-קליק) */
#control-bar.busy { pointer-events:none; opacity:.55; transition:opacity .1s; }

/* חיווי סטטוס-הקו בקוקפיט */
.present-status { display:flex; align-items:center; gap:10px; padding:11px 16px; border-radius:12px; margin-bottom:16px;
    font-size:.92rem; font-weight:700; border:1px solid var(--border); background:var(--surface); }
.present-status .ps-dot { width:11px; height:11px; border-radius:50%; flex:none; background:var(--text-3); }
.present-status.ps-wait { color:var(--warning); border-color:rgba(217,162,58,.4); background:rgba(217,162,58,.08); }
.present-status.ps-wait .ps-dot { background:var(--warning); }
.present-status.ps-live { color:var(--success); border-color:rgba(63,174,142,.4); background:var(--success-soft); }
.present-status.ps-live .ps-dot { background:var(--success); animation:livepulse 1.6s infinite; }
.present-status.ps-idle, .present-status.ps-ended { color:var(--text-2); }

/* הבלטת הפעולה המומלצת לשלב (מפחית לחיצה שגויה מול קהל) */
.control-bar .btn.is-next { outline:2px solid var(--accent); outline-offset:2px; transform:translateY(-1px); }

/* באנר-אבטחה בפאנל בקרת-האיכות (פעולה מומלצת) */
.qa-alert { display:flex; gap:13px; align-items:flex-start; margin:0 0 18px; padding:14px 16px; border-radius:14px;
    background:rgba(217,162,58,.10); border:1px solid rgba(217,162,58,.4); }
.qa-alert .qa-al-ic { flex:none; width:32px; height:32px; border-radius:9px; display:grid; place-items:center; background:var(--warning); color:#1a1305; }
.qa-alert .qa-al-b { flex:1; font-size:.86rem; line-height:1.6; }
.qa-alert .qa-al-b b { color:var(--text); }
.qa-alert .qa-al-b a { color:var(--accent-2); font-weight:700; }

/* ── כפתור החלפת מצב בהיר/כהה (טופבר) ── */
.theme-toggle { width:40px; height:40px; flex:none; border-radius:11px; border:1px solid var(--border-2); background:var(--surface-2);
    color:var(--text-2); display:grid; place-items:center; cursor:pointer; transition:color .14s, border-color .14s, background .14s; }
.theme-toggle:hover { color:var(--accent-ink); border-color:var(--accent); }
.theme-toggle .ic-sun { display:block; }
.theme-toggle .ic-moon { display:none; }
:root[data-theme="light"] .theme-toggle .ic-sun { display:none; }
:root[data-theme="light"] .theme-toggle .ic-moon { display:block; }
/* מתג-שפה בכותרת (he ⇄ en) */
.lang-toggle { display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 12px; border-radius:11px;
    border:1px solid var(--border-2); background:var(--surface-2); color:var(--text-2); font-family:inherit;
    font-weight:700; font-size:.82rem; text-decoration:none; white-space:nowrap; transition:color .14s, border-color .14s; }
.lang-toggle:hover { color:var(--accent-ink); border-color:var(--accent); }
.lang-toggle svg { flex:none; }

/* מתג-על "מצב קליטה נמוכה" בכותרת (גלובלי) — כבוי=מאופק, פעיל=ממולא-אקסנט */
.lowrec-toggle { display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 12px; border-radius:11px;
    border:1px solid var(--border-2); background:var(--surface-2); color:var(--text-2); font-family:inherit;
    font-weight:700; font-size:.82rem; text-decoration:none; white-space:nowrap; transition:color .14s, border-color .14s, background .14s, box-shadow .14s; }
.lowrec-toggle:hover { color:var(--accent-ink); border-color:var(--accent); }
.lowrec-toggle svg { flex:none; }
.lowrec-toggle.on { background:linear-gradient(145deg, var(--accent), var(--accent-strong)); color:#1a1305;
    border-color:var(--accent-strong); box-shadow:0 3px 12px -4px var(--accent); }
.lowrec-toggle.on:hover { color:#1a1305; }

/* עזר-פרומט AI בתוך מודאל ההדבקה */
.ai-prompt-help { margin:14px 0 4px; border:1px solid var(--border-2); border-radius:10px; padding:10px 12px; background:var(--surface-2); }
.ai-prompt-help > summary { cursor:pointer; font-weight:700; font-size:.86rem; color:var(--accent-ink); display:flex; align-items:center; gap:7px; list-style:none; }
.ai-prompt-help > summary::-webkit-details-marker { display:none; }
.ai-prompt-help[open] > summary { margin-bottom:6px; }
.ai-prompt-help textarea { background:var(--surface); border:1px solid var(--border-2); border-radius:8px; color:var(--text); padding:8px; }

/* מטרות-מגע ≥44px במכשירי-מגע (WCAG 2.2 · קהל מבוגר) */
@media (pointer: coarse) {
    .btn-sm { min-height: 44px; }
    .answer-remove, .pw-toggle, .theme-toggle, .close-x, .pv-x, .sidebar-toggle { min-width: 44px; min-height: 44px; }
    .nav-item { padding-block: 12px; }
}

/* ── פורטל-ניהול (manage.php) ── */
.manage-badge { display: inline-flex; align-items: center; gap: 6px; background: var(--accent-soft); color: var(--accent-ink); font-size: .78rem; font-weight: 700; padding: 6px 14px; border-radius: 999px; margin: 6px auto 18px; }

/* קרדיט-מותג בתחתית הדוח (נראה גם בהדפסה/צילום-מסך שמשתפים) */
.rep-credit { display:flex; align-items:center; justify-content:center; gap:8px; margin:28px 0 4px;
    font-size:.76rem; color:var(--text-3); }
.rep-credit img, .rep-credit svg { width:14px; height:14px; opacity:.8; }
.rep-credit b { color:var(--text-2); }

/* הערת-קיבולת במודאל-ההרצה (#B2) */
.run-cap { display:flex; align-items:flex-start; gap:8px; margin-top:12px; padding:10px 12px; border-radius:10px;
    background:var(--accent-soft); color:var(--text-2); font-size:.86rem; line-height:1.5; }
.run-cap svg { flex:none; margin-top:2px; color:var(--accent-ink); }
.run-cap b { color:var(--text); }
.run-cap.run-cap-unset { background:color-mix(in srgb, var(--warning) 14%, transparent); }
.run-cap.run-cap-unset svg { color:var(--warning); }

/* מודאל עיון-בשאלות (#B4) */
.peek-list { max-height: 56vh; overflow-y: auto; border: 1px solid var(--border-2); border-radius: 10px; padding: 6px 4px; }
.peek-q { padding: 12px 14px; border-bottom: 1px solid var(--border); }
.peek-q:last-child { border-bottom: none; }
.peek-q-h { font-weight: 700; line-height: 1.5; margin-bottom: 8px; }
.peek-poll { font-size: .72rem; font-weight: 700; color: var(--accent-ink); background: var(--accent-soft); padding: 1px 8px; border-radius: 999px; }
.peek-ans { list-style: none; display: flex; flex-direction: column; gap: 4px; padding-inline-start: 20px; }
.peek-ans li { font-size: .9rem; color: var(--text-2); padding: 4px 10px; border-radius: 7px; background: var(--surface-2); }
.peek-ans li.peek-correct { color: var(--text); background: var(--success-soft); font-weight: 700; }
.peek-badge { font-size: .7rem; font-weight: 800; color: var(--success); }

/* חבילות בדשבורד (שדרוג · משתמש רגיל) */
.pkg-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; }
.pkg-card { background:var(--surface-2); border:1px solid var(--border-2); border-radius:13px; padding:16px 14px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:5px; }
.pkg-card.cur { border-color:var(--accent); background:var(--accent-soft); }
.pkg-name { font-family:var(--font-display,inherit); font-weight:800; font-size:1.05rem; color:var(--text); }
.pkg-cap { font-size:.82rem; color:var(--text-2); }
.pkg-price { font-family:var(--font-display,inherit); font-weight:900; font-size:1.5rem; color:var(--accent-ink); line-height:1.1; margin:2px 0 8px; }
.pkg-price .pkg-per { font-family:inherit; font-weight:600; font-size:.72rem; color:var(--text-3); }
.pkg-buy { width:100%; justify-content:center; margin-top:auto; }
.pkg-badge { display:inline-flex; align-items:center; gap:5px; margin-top:auto; font-size:.8rem; font-weight:800; color:var(--accent-ink); background:var(--accent-soft); padding:5px 12px; border-radius:999px; }
/* תצוגה-מקדימה למנהל: באנר + כפתור-המחשה זהה-חזותית אך לא-לחיץ */
.pkg-preview { display:flex; align-items:center; gap:9px; line-height:1.5; margin:-2px 0 14px; }
.pkg-preview svg { flex:0 0 auto; }
.pkg-buy-demo { cursor:default; }
/* ── עמוד חבילות ותשלום (billing.php) ── */
.bill-ownernote { display:flex; align-items:center; gap:9px; line-height:1.5; margin-bottom:18px; }
.bill-ownernote svg { flex:0 0 auto; }
.bill-current { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
    background:var(--accent-soft); border:1px solid var(--border-2); border-radius:16px; padding:18px 22px; }
.bill-cur-cap { font-size:.78rem; font-weight:700; color:var(--text-3); letter-spacing:.3px; }
.bill-cur-name { font-family:var(--font-display,inherit); font-weight:900; font-size:1.7rem; color:var(--accent-ink); line-height:1.15; margin:2px 0; }
.bill-cur-meta { font-size:.9rem; color:var(--text-2); }
.bill-cur-r { text-align:end; }
.bill-tag { display:inline-flex; align-items:center; gap:6px; font-weight:800; font-size:.85rem; padding:6px 14px; border-radius:999px; }
.bill-tag.free { background:var(--surface-2); color:var(--text-2); }
.bill-tag.ok { background:rgba(46,204,113,.16); color:#4bd07f; }
.bill-exp { font-size:.8rem; color:var(--text-3); margin-top:6px; }
.hint svg { vertical-align:-3px; margin-inline-end:2px; opacity:.85; }
.bill-st { font-size:.8rem; font-weight:700; padding:3px 10px; border-radius:999px; }
.bill-st-completed { background:rgba(46,204,113,.16); color:#4bd07f; }
.bill-st-created   { background:rgba(217,162,58,.16); color:#f2c46b; }
.bill-st-refunded  { background:rgba(224,101,124,.14); color:#f0a9b6; }
.bill-st-failed    { background:rgba(224,101,124,.14); color:#f0a9b6; }
/* כרטיס-קישור בדשבורד → עמוד החבילות */
.bill-upsell { display:flex; align-items:center; gap:16px; text-decoration:none;
    background:var(--surface-2); border:1px solid var(--border-2); border-radius:16px; padding:18px 22px;
    transition:border-color .15s, transform .15s, background .15s; }
.bill-upsell:hover { border-color:var(--accent); background:var(--accent-soft); transform:translateY(-1px); }
.bill-up-ic { flex:0 0 auto; width:48px; height:48px; display:grid; place-items:center; border-radius:12px; background:var(--accent-soft); color:var(--accent-ink); }
.bill-up-tx { flex:1 1 auto; min-width:0; }
.bill-up-t { font-family:var(--font-display,inherit); font-weight:800; font-size:1.15rem; color:var(--text); }
.bill-up-s { font-size:.88rem; color:var(--text-2); margin-top:2px; }
.bill-up-cta { flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; font-weight:800; font-size:.9rem; color:var(--accent-ink); white-space:nowrap; }
.bill-up-cta svg { transform:scaleX(-1); }   /* חץ RTL — פונה לכיוון-ההמשך */
/* ── פאנל-תשלום מוטמע (PayPal SDK) ── */
.pkg-card.sel { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-soft); }
.pay-box { max-width:520px; }
.pay-head { display:flex; align-items:center; justify-content:space-between; gap:12px;
    padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid var(--border-2); font-size:1rem; color:var(--text); }
.pay-amt { font-family:var(--font-display,inherit); font-weight:900; font-size:1.4rem; color:var(--accent-ink); white-space:nowrap; }
.pay-buttons { min-height:46px; }
.pay-or { display:flex; align-items:center; gap:0; text-align:center; color:var(--text-3); font-size:.85rem; margin:20px 0 16px; }
.pay-or::before, .pay-or::after { content:''; flex:1; height:1px; background:var(--border-2); }
.pay-or span { padding:0 14px; }
.cf-field { margin-bottom:12px; }
.cf-field label { display:block; font-size:.8rem; color:var(--text-2); margin-bottom:5px; }
.cf-box { background:var(--surface-2); border:1px solid var(--border-2); border-radius:10px; padding:0 10px; height:46px; display:flex; align-items:center; }
.cf-box:focus-within { border-color:var(--accent); }
.cf-row { display:flex; gap:12px; }
.cf-row .cf-field { flex:1; }
.btn-block { width:100%; justify-content:center; margin-top:6px; }
.pay-status { margin-top:14px; padding:11px 14px; border-radius:10px; font-size:.92rem; font-weight:700; }
.pay-status.ok  { background:rgba(46,204,113,.16); color:#4bd07f; }
.pay-status.err { background:rgba(224,101,124,.14); color:#f0a9b6; }

/* ─── מוניטור-קיבולת (pool.php · Capacity) ─────────────────────────── */
.cap-panel{padding:20px 22px}
.cap-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.cap-title{display:flex;align-items:center;gap:9px;font-weight:800;font-size:1.02rem}
.cap-title svg{color:var(--accent-2)}
.cap-badge{font-size:.74rem;font-weight:700;padding:4px 11px;border-radius:999px;white-space:nowrap;border:1px solid transparent}
.cap-badge.cap-ok{color:var(--success);background:var(--success-soft);border-color:rgba(63,174,142,.3)}
.cap-badge.cap-watch{color:var(--warning);background:rgba(217,162,58,.14);border-color:rgba(217,162,58,.32)}
.cap-badge.cap-act{color:var(--danger);background:rgba(224,101,124,.14);border-color:rgba(224,101,124,.34)}
.cap-lede{margin:0 0 16px;font-size:.86rem;line-height:1.6;max-width:70ch}

.cap-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:20px}
.cap-m{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 10px;text-align:center}
.cap-mv{font-family:var(--font-display);font-size:1.9rem;font-weight:900;line-height:1;color:var(--text)}
.cap-mk{margin-top:6px;font-size:.74rem;color:var(--text-3);font-weight:600}
.cap-m.cap-live .cap-mv{color:var(--success)}
.cap-m.cap-m-pool{background:var(--accent-soft);border-color:rgba(204,154,78,.34)}
.cap-m.cap-m-pool .cap-mv{color:var(--accent-2)}

.cap-chart{margin-bottom:18px}
.cap-spark{position:relative;display:flex;align-items:flex-end;gap:5px;height:132px;padding:6px 2px 0;
  border-bottom:1px solid var(--border-2);background:
    repeating-linear-gradient(to top,transparent,transparent 32px,rgba(255,255,255,.03) 32px,rgba(255,255,255,.03) 33px)}
.cap-bar{flex:1;min-width:0;position:relative;border-radius:5px 5px 0 0;
  background:linear-gradient(to top,var(--accent-strong),var(--accent-2));
  transition:filter .15s;box-shadow:0 0 0 1px rgba(0,0,0,.15) inset}
.cap-bar:hover{filter:brightness(1.12)}
.cap-bar-0{background:var(--surface-3);height:3px!important;border-radius:3px}
.cap-bar-v{position:absolute;top:-17px;left:50%;transform:translateX(-50%);font-size:.7rem;font-weight:800;color:var(--accent-2)}
.cap-ceiling{position:absolute;left:0;right:0;height:0;border-top:1.5px dashed var(--danger);opacity:.55;pointer-events:none;z-index:2}
.cap-ceiling span{position:absolute;right:0;top:-16px;font-size:.66rem;font-weight:700;color:var(--danger);background:var(--surface);padding:0 5px;border-radius:4px}
.cap-axis{display:flex;justify-content:space-between;margin-top:6px;font-size:.72rem;color:var(--text-3);font-weight:600}
.cap-axis .muted{color:var(--text-3)}

.cap-reco{display:flex;gap:11px;align-items:flex-start;padding:13px 15px;border-radius:var(--radius-sm);border:1px solid var(--border-2);background:var(--surface-2)}
.cap-reco svg{flex:none;margin-top:1px}
.cap-reco.cap-ok{border-inline-start:3px solid var(--success)}
.cap-reco.cap-ok>svg{color:var(--success)}
.cap-reco.cap-watch{border-inline-start:3px solid var(--warning)}
.cap-reco.cap-watch>svg{color:var(--warning)}
.cap-reco.cap-act{border-inline-start:3px solid var(--danger)}
.cap-reco.cap-act>svg{color:var(--danger)}
.cap-reco-body{display:flex;flex-direction:column;gap:3px}
.cap-reco-body strong{font-size:.92rem;font-weight:700;line-height:1.45}
.cap-reco-sub{font-size:.8rem;line-height:1.5}
.cap-reco-sub.cap-warn{color:var(--warning);display:inline-flex;align-items:flex-start;gap:5px}
.cap-reco-sub.cap-warn svg{flex:none;margin-top:2px}

@media (max-width:720px){
  .cap-metrics{grid-template-columns:repeat(3,1fr)}
  .cap-m.cap-m-pool{grid-column:span 3}
  .cap-spark{height:108px;gap:3px}
}

/* ─── מסך-הפעלה לנרשם חדש (dashboard.php · firstrun) ───────────────── */
.firstrun{position:relative; overflow:hidden; margin:0 0 22px; padding:26px 28px; border-radius:var(--radius);
  background:linear-gradient(135deg, var(--surface-2), var(--surface));
  border:1px solid rgba(204,154,78,.34); box-shadow:var(--shadow)}
.firstrun::before{content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 80% at 88% -20%, rgba(204,154,78,.16), transparent 58%)}
.firstrun>*{position:relative}
.fr-badge{display:inline-flex; align-items:center; gap:7px; font-size:.76rem; font-weight:700; color:var(--accent-2);
  background:var(--accent-soft); border:1px solid rgba(204,154,78,.3); padding:5px 12px; border-radius:999px}
.fr-badge svg{color:var(--accent-2)}
.fr-title{font-family:var(--font-display); font-weight:900; font-size:clamp(1.5rem,3.2vw,2.15rem); margin:14px 0 8px; line-height:1.15}
.fr-title em{font-style:normal; color:var(--accent-2)}
.fr-sub{color:var(--text-2); font-size:.98rem; line-height:1.6; max-width:62ch; margin:0 0 20px}
.fr-quizzes{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:16px}
.fr-quiz{display:flex; flex-direction:column; align-items:flex-start; gap:11px; padding:16px; border-radius:var(--radius-sm);
  background:var(--surface-3); border:1px solid var(--border-2); text-decoration:none; color:var(--text);
  transition:transform .15s, border-color .15s, box-shadow .15s}
.fr-quiz:hover{transform:translateY(-3px); border-color:var(--accent); box-shadow:0 12px 28px rgba(0,0,0,.32)}
.fr-q-ic{width:40px; height:40px; border-radius:11px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent-2)}
.fr-q-title{font-weight:700; font-size:1rem; line-height:1.35; flex:1}
.fr-q-cta{display:inline-flex; align-items:center; gap:6px; font-weight:800; color:var(--accent-2); font-size:.9rem}
.fr-more{display:inline-flex; align-items:center; gap:6px; color:var(--text-3); font-weight:600; font-size:.9rem; text-decoration:none}
.fr-more:hover{color:var(--accent-2)}
@media (max-width:720px){ .fr-quizzes{grid-template-columns:1fr} .firstrun{padding:22px 18px} }

/* ─── משפך שיווקי (dashboard.php · super · funnel-panel) ───────────── */
.funnel-panel{position:relative; overflow:hidden; margin:0 0 22px; padding:20px 24px; border-radius:var(--radius);
  background:linear-gradient(135deg, var(--surface-2), var(--surface)); border:1px solid var(--border-2); box-shadow:var(--shadow)}
.fp-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; flex-wrap:wrap}
.fp-title{display:flex; align-items:center; gap:9px; font-weight:800; font-size:1rem}
.fp-title svg{color:var(--accent-2)}
.fp-conv{font-size:.82rem; color:var(--text-2)}
.fp-conv b{color:var(--accent-2)}
.fp-flow{display:flex; align-items:stretch; gap:0}
.fp-step{flex:1; text-align:center; padding:6px 8px}
.fp-v{font-family:var(--font-display); font-size:2.2rem; font-weight:900; line-height:1; color:var(--text)}
.fp-goal .fp-v{color:var(--accent-2)}
.fp-k{margin-top:6px; font-size:.82rem; color:var(--text-3); font-weight:600; display:flex; flex-direction:column; gap:2px}
.fp-sub{font-size:.72rem; color:var(--text-3); opacity:.85}
.fp-sep{width:1px; background:var(--border-2); margin:8px 0}
.fp-refs{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:16px; padding-top:14px; border-top:1px solid var(--border-2)}
.fp-refs-l{font-size:.8rem; color:var(--text-3); font-weight:600}
.fp-ref{font-size:.8rem; background:var(--surface-3); border:1px solid var(--border-2); border-radius:999px; padding:4px 11px; color:var(--text-2)}
.fp-ref b{color:var(--accent-2)}
@media (max-width:560px){ .fp-v{font-size:1.7rem} .fp-flow{gap:0} }

/* ─── "כך נראה אירוע חי" — פס-הסבר במסך-הפתיחה (firstrun · fr-how) ─── */
.fr-how{display:flex; align-items:stretch; gap:0; margin:0 0 20px; padding:10px 12px; border-radius:var(--radius-sm);
  background:var(--surface-3); border:1px solid var(--border-2); flex-wrap:wrap}
.fr-how-step{flex:1; min-width:160px; display:flex; align-items:center; gap:10px; padding:8px 12px; font-size:.88rem; font-weight:600; color:var(--text-2)}
.fr-how-ic{width:34px; height:34px; border-radius:9px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent-2); flex:none}
.fr-how-div{width:1px; align-self:stretch; background:var(--border-2); margin:6px 0}
@media (max-width:640px){ .fr-how-div{display:none} .fr-how-step{min-width:100%} }

/* מעורבות-משחק בפאנל-המשפך (dashboard.php) */
.fp-game{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 18px;
  margin-top:16px; padding-top:14px; border-top:1px solid var(--border-2); font-size:.85rem; color:var(--text-2)}
.fp-game b{color:var(--accent-2); font-weight:800}
.fp-g{display:inline-flex; align-items:center; gap:6px}
.fp-g svg{color:var(--text-3)}
.fp-g-modes{color:var(--text-3); font-size:.82rem}

/* טוסט-אישור (מחליף confirm הנייטיב) — window.clkConfirm */
.clk-confirm{position:fixed; inset-block-end:24px; inset-inline:0; margin-inline:auto; z-index:200;
  width:max-content; max-width:min(90vw,430px); background:var(--surface-2); border:1px solid var(--border-2);
  border-radius:14px; padding:16px 20px; box-shadow:var(--shadow-lg);
  opacity:0; transform:translateY(16px); transition:opacity .18s, transform .18s; text-align:center}
.clk-confirm.show{opacity:1; transform:translateY(0)}
.clk-confirm.danger{border-color:rgba(224,101,124,.42)}
.cc-msg{color:var(--text); font-size:.98rem; font-weight:600; line-height:1.55; margin-bottom:14px}
.cc-row{display:flex; gap:10px; justify-content:center}
.cc-btn{border:1px solid var(--border-2); background:var(--surface-3); color:var(--text); font-weight:700;
  font-size:.9rem; padding:9px 24px; border-radius:9px; cursor:pointer; font-family:inherit; transition:background .14s, border-color .14s, filter .14s}
.cc-no:hover{border-color:var(--text-3)}
.cc-yes{background:var(--accent); color:#1a1305; border-color:var(--accent)}
.cc-yes:hover{filter:brightness(1.08)}
.clk-confirm.danger .cc-yes{background:var(--danger); border-color:var(--danger); color:#fff}

/* ── קרדיט מפתח ─────────────────────────────────────────────────────────────
   שורה שקטה בתחתית התוכן בממשק המחובר. נועדה להיקרא כחתימה, לא כבאנר:
   קו-שיער קצר וממורכז במקום פס רוחב-מלא, וצבע-טקסט משני שאינו מושך את העין. */
.dev-credit {
    margin-block-start: 44px;
    padding-block-end: 4px;
    text-align: center;
    font-family: var(--font-ui);
    font-size: 13.5px;
    font-weight: 400;
    line-height: 1.75;
    color: var(--text-3);
}
.dev-credit::before {
    content: "";
    display: block;
    inline-size: 42px;
    block-size: 1px;
    margin-inline: auto;
    margin-block-end: 16px;
    background: var(--border-2);
}
.dev-credit a {
    color: var(--text-2);
    text-decoration: none;
    padding-block-end: 1px;
    border-block-end: 1px solid transparent;
    transition: color .18s ease, border-color .18s ease;
}
.dev-credit a:hover { color: var(--accent-2); border-block-end-color: var(--accent-soft); }
.dev-credit a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 3px; }
@media (prefers-reduced-motion: reduce) { .dev-credit a { transition: none; } }