/* src/app/dan/announcements.css — הודעות · פרסום · לוח: העיצוב של דן, מועתק.
 * מקור: legacy/community/announcements.html · legacy/community/board.html · legacy/community/assets/js/announcement-format.js
 * מסכים: src/app/screens/announcements.js · src/app/screens/community-publishing.js · src/app/screens/community-board.js — כל אחד עוטף את עצמו ב-`<div class="dan dan-<מודול>">`.
 * הנוהל: docs/runbooks/dan-design-port.md · הפלטה (`--d-*`): src/app/dan/dan.css.
 *
 * 🔴 01.10 · גיל: "תעתיק גם את הלוגיקה והפונקציונליות בדף וגם את העיצוב של כל המסכים, פשוט העתקה
 *    ממקום למקום. שיהיה אחד לאחד בכל הדפים." ⟹ אלה ה-<style> של `board.html` (לוח המודעות — `/announcements`,
 *    המסך `.dan-announcements`) ושל `announcements.html` (מסך המחבר — `/community/publishing`, המסך
 *    `.dan-community-publishing`), ועוד ה-CSS ש-`announcement-format.js` מזריק בזמן ריצה (`kd-ann*`) —
 *    כאן קובץ סטטי, כי אין כאן הזרקת <style> (ובלעדיה הרינדור המשותף אינו תלוי במי שקרא ראשון).
 *    מועתקים ולא מיובאים (ADR 0025: src/ אינו מייבא מ-legacy/).
 *
 * ⚠️ מה שונה מהמקור, ולמה:
 *  ① **אין `:root`, אין `body`, אין `main`, אין גופן.** הפלטה ב-dan.css (`--d-*`, תחומה ל-`.dan`),
 *     והרקע, המרווח והגופן של המעטפת. `main{max-width:1000px}` של `announcements.html` ⟹ `max-width` על
 *     `.dan-community-publishing`; ה-`radial-gradient` של `body` ב-`board.html` נשאר של המעטפת.
 *  ② **שמות מקומיים במקום מחלקות שהמעטפת מגדירה לא-תחום** (docs/runbooks/dan-design-port.md):
 *     `.card` ⟹ `.dcard` · `.topbar` ⟹ `.dtop` · `.btn` ⟹ `.dbtn` · `.alert` ⟹ `.dalert` · `.row` — אינו בשימוש.
 *  ③ **נשמטו כללי הדשבורד שאין להם צרכן בעמוד** (`.years` · `.legend5` · `.donut` · `.bars` · `.soon` · `.todo`
 *     …) — ה-<style> של `announcements.html` הוא העתק של `dashboard.html` ובו כללים שאף אלמנט בעמוד אינו נושא.
 *     נשארו כל מה שהעמוד משתמש בו ועוד המחלקות של המעצב.
 *  ④ **container query ולא media query** (`@container`): רוחב התוכן תלוי במעטפת (סרגל פתוח/סגור), לא בחלון.
 *     1000px של דן ⟹ 720px של המכל (העמודה הצרה של הטופס יורדת מתחת ל-300px), 560px ⟹ 560px.
 *  ⑤ **`:focus-visible` מפורש** על הפקדים — דן מכבה `outline` על השדות ומחליף ב-`box-shadow` מנטה
 *     (1.1:1 על לבן), וב-checkbox/radio הוא אינו נראה בכלל; מקלדת חייבת טבעת (ui-keyboard).
 *     ⚠️ 01.10 (סוקר): הכלל הזה ישב **לפני** `.f input { outline: none }` ושניהם בספציפיות (0,2,1) — האחרון ניצח, ושדות הטקסט נשארו עם
 *     הזוהר המנטה בלבד. ⟹ הוא עבר לסוף קטע המחבר ("טבעת המקלדת"), אחרי כל `outline:none`.
 *  ⑥ **שדה הקובץ אינו `display:none`** (כמו בדן) אלא מוסתר חזותית — `<label>` שהפקד שלו `display:none` אינו
 *     נגיש במקלדת. `label:focus-within` נושא את הטבעת.
 */

/* ═══════════════════════════════════════════════════════════════════════════
   מעצב ההודעות · `kd-ann*` — משותף ללוח, לרשימת ההודעות שפורסמו ולתצוגה המקדימה
   ═══════════════════════════════════════════════════════════════════════════ */
.dan-announcements .kd-ann,
.dan-community-publishing .kd-ann { font-size: 15px; line-height: 1.6; color: var(--d-text); display: flex; flex-direction: column; gap: 12px; }
.dan-announcements .kd-ann > :first-child,
.dan-community-publishing .kd-ann > :first-child { margin-top: 0; }
.dan-announcements .kd-ann-p,
.dan-community-publishing .kd-ann-p { margin: 0; color: var(--d-muted); }
.dan-announcements .kd-ann strong,
.dan-community-publishing .kd-ann strong { color: var(--d-ink); font-weight: 600; }
.dan-announcements .kd-ann-head,
.dan-community-publishing .kd-ann-head { margin: 2px 0 -4px; font-size: 15.5px; font-weight: 600; color: var(--d-ink);
  /* 🔴 01.10 (סוקר) — base.css קובע לכל h1–h3 `letter-spacing:-.02em; line-height:1.25`, ו-`.kd-ann-head` בדן הוא h4 בלי אף אחד מהם
     (מדוד: -0.31px / 19.4px מול normal / 1.6). ⟹ מאופס, כדי שגם h2/h3 יצאו כמו ה-h4 של המקור. */
  letter-spacing: normal; line-height: inherit; }
.dan-announcements .kd-ann-facts,
.dan-community-publishing .kd-ann-facts { margin: 0; display: flex; flex-direction: column; gap: 7px; background: var(--d-mint);
  border-radius: 14px; padding: 13px 16px; border: 1px solid #D6EADF; }
.dan-announcements .kd-ann-facts > div,
.dan-community-publishing .kd-ann-facts > div { display: flex; gap: 10px; align-items: baseline; }
.dan-announcements .kd-ann-facts dt,
.dan-community-publishing .kd-ann-facts dt { flex: none; min-width: 64px; font-size: 13.5px; font-weight: 600; color: var(--d-green-dark); }
.dan-announcements .kd-ann-facts dd,
.dan-community-publishing .kd-ann-facts dd { margin: 0; font-size: 15px; font-weight: 500; color: var(--d-ink); }
.dan-announcements .kd-ann-list,
.dan-community-publishing .kd-ann-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.dan-announcements .kd-ann-list li,
.dan-community-publishing .kd-ann-list li { display: flex; gap: 9px; align-items: baseline; color: var(--d-muted);
  padding-inline-start: calc(var(--d, 0) * 20px); }
.dan-announcements .kd-ann-m,
.dan-community-publishing .kd-ann-m { flex: none; font-weight: 600; color: var(--d-green); font-size: 14px; min-width: 22px; }
.dan-announcements .kd-ann-sign,
.dan-community-publishing .kd-ann-sign { border-top: 1px solid var(--d-line-soft); padding-top: 10px; font-size: 14px; color: var(--d-faint); }

/* ═══════════════════════════════════════════════════════════════════════════
   לוח מודעות · board.html — `/announcements`
   ═══════════════════════════════════════════════════════════════════════════ */
.dan-announcements { container: dan-announcements / inline-size; color: var(--d-text); }
.dan-announcements a { color: var(--d-green); text-decoration: none; }
.dan-announcements a:hover { color: var(--d-orange-ink); }
.dan-announcements :is(a, button):focus-visible { outline: 2px solid var(--d-green); outline-offset: 3px; border-radius: 6px; }

.dan-announcements .wrap { width: 100%; max-width: 680px; margin: 0 auto; display: flex; flex-direction: column; gap: 18px; }
.dan-announcements .dcard { background: #fff; border-radius: clamp(20px, 3vh, 28px); overflow: hidden;
  box-shadow: 0 2px 4px rgba(16,42,32,.04), 0 26px 64px rgba(16,42,32,.10); }

.dan-announcements .scene { height: clamp(120px, 18vh, 150px); background: linear-gradient(180deg, var(--d-cream) 0%, #EFF6EC 100%);
  position: relative; display: grid; place-items: end center; overflow: hidden; }
/* ⚠️ base.css קובע `svg { width:20px; height:20px }` — המידה המפורשת כאן היא מה שמותח את הנוף על הכרטיס. */
.dan-announcements .scene svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.dan-announcements .arch { position: relative; width: 100px; height: 100px; background: #fff; border-radius: 50px 50px 0 0;
  display: grid; place-items: center; padding-top: 16px; }
.dan-announcements .arch img { height: 50px; width: auto; border-radius: 12px; }

.dan-announcements .head { padding: 22px 28px 4px; text-align: center; display: flex; flex-direction: column; gap: 6px; align-items: center; }
.dan-announcements .title { font-size: clamp(24px, 4vh, 30px); font-weight: 600; color: var(--d-ink); letter-spacing: -.02em; margin: 0; }
.dan-announcements .sub { font-size: 15.5px; color: var(--d-muted); }

.dan-announcements .list { padding: 18px 28px 30px; display: flex; flex-direction: column; gap: 12px; }
.dan-announcements .items { display: flex; flex-direction: column; gap: 12px; }
.dan-announcements .item { background: var(--d-cream2); border-radius: 16px; padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; }
.dan-announcements .item .n { font-size: 17.5px; font-weight: 600; color: var(--d-ink); line-height: 1.35; }
.dan-announcements .item .n a { color: inherit; }
/* בדן `white-space:pre-wrap` — כאן המעצב מפרק שורות בעצמו (`<br>` ופסקאות), והגוף נושא `.kd-ann`. */
.dan-announcements .item .b { font-size: 16px; color: var(--d-body); line-height: 1.6; }
/* 🔴 01.10 (סוקר) — `.item .b {color:#3A4A42}` של `board.html` חל על **הטקסט**; המעצב עוטף כל פסקה ב-`.kd-ann-p`, ו-`.kd-ann-p` צובע ב-muted
   (זה הצבע של הפיד ב-`resident.html` ושל רשימת המחבר) ⟹ הגוף בלוח יצא אפור יותר מבדן (rgb 95,110,102 במקום 58,74,66). הלוח הוא `board.html`. */
.dan-announcements .item .b .kd-ann-p,
.dan-announcements .item .b .kd-ann-list li { color: var(--d-body); }
.dan-announcements .item .d { font-size: 13.5px; color: var(--d-faint); }
/* התמונה בולטת אל שולי הכרטיס, כמו הבאנר ב-/hours, ומופיעה מתחת לגוף: הודעה מזוהה לפי מה שכתוב בה, והתמונה מלווה. (`board.html`, אות באות;
   `padding` של `.item` הוא 16px 18px ⟹ ‎±36px‎.) ⚠️ `[hidden]` — `.dan [hidden]` ב-dan.css מנצח את ה-`display:block` עד שהתמונה נטענת. */
.dan-announcements .item .img { display: block; width: calc(100% + 36px); margin: 4px -18px 2px; aspect-ratio: 16/6;
  object-fit: cover; background: var(--d-cream); }

/* "הסתרה" ו"קודמות" — אין בלוח של דן (A42 · app.js); בצורה של `.annacts button` / `.btn` של announcements.html. */
.dan-announcements .acts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 2px; }
.dan-announcements .hidebtn { font-family: inherit; font-size: 12.5px; color: var(--d-muted); background: none;
  border: 1px solid var(--d-line); border-radius: 999px; padding: 4px 11px; cursor: pointer; }
.dan-announcements .hidebtn:hover { border-color: var(--d-green); color: var(--d-green-dark); }
.dan-announcements .more { margin: 6px 0 0; display: flex; justify-content: center; }
.dan-announcements .dbtn { border: 1px solid var(--d-line); background: #fff; color: var(--d-text); font-family: inherit; font-size: 15px;
  font-weight: 500; padding: 11px 22px; border-radius: 999px; cursor: pointer; transition: .15s; }
.dan-announcements .dbtn:hover { border-color: var(--d-green); color: var(--d-green-dark); }
.dan-announcements .dbtn:disabled { opacity: .5; cursor: not-allowed; }

.dan-announcements .state { padding: 34px 28px 40px; text-align: center; color: var(--d-muted); font-size: 16px; line-height: 1.6; }
.dan-announcements .state b { display: block; color: var(--d-ink); font-size: 17.5px; font-weight: 600; margin-bottom: 5px; }

.dan-announcements .foot { display: flex; justify-content: center; gap: 14px; align-items: center; font-size: 15px; color: var(--d-faint); flex-wrap: wrap; }

@container dan-announcements (max-width: 560px) {
  .dan-announcements .head { padding: 20px 20px 4px; }
  .dan-announcements .list { padding: 16px 20px 26px; }
  .dan-announcements .state { padding: 28px 20px 32px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   מסך פרסום ההודעות · announcements.html — `/community/publishing`
   ═══════════════════════════════════════════════════════════════════════════ */
.dan-community-publishing { container: dan-publishing / inline-size; display: flex; flex-direction: column; gap: 22px;
  max-width: 1000px; color: var(--d-text); }
.dan-community-publishing a { color: var(--d-green); text-decoration: none; }
.dan-community-publishing a:hover { color: var(--d-orange-ink); }

.dan-community-publishing .dtop { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.dan-community-publishing h1 { font-size: 27px; font-weight: 600; color: var(--d-ink); letter-spacing: -.02em; margin: 0 0 5px; }
.dan-community-publishing .dtop .meta { font-size: 15px; color: var(--d-muted); }
.dan-community-publishing .syncst { font-size: 13px; font-weight: 600; padding: 5px 12px; border-radius: 20px; opacity: 0; transition: opacity .25s; white-space: nowrap; }
.dan-community-publishing .syncst.show { opacity: 1; }
.dan-community-publishing .syncst.wait { background: var(--d-orange-soft); color: var(--d-orange-ink); }
.dan-community-publishing .syncst.ok { background: var(--d-mint); color: var(--d-green-dark); }
.dan-community-publishing .syncst.err { background: var(--d-orange-soft); color: var(--d-orange-ink); font-weight: 700; }

/* ---------- רצועת הציות (שלנו — בדן אין טיוטות: הפרסום מיידי) · בצורה של `.alert` ---------- */
.dan-community-publishing .dalerts { display: flex; gap: 12px; flex-wrap: wrap; }
.dan-community-publishing .dalert { flex: 1; min-width: min(300px, 100%); display: flex; align-items: center; gap: 12px; border-radius: 16px;
  padding: 14px 18px; font-size: 15px; line-height: 1.5; }
.dan-community-publishing .dalert .ic { width: 24px; height: 24px; flex: none; border-radius: 50%; font-weight: 700;
  display: grid; place-items: center; font-size: 13px; }
.dan-community-publishing .dalert.warn { background: var(--d-orange-soft); color: var(--d-orange-ink); }
/* ⚠️ `--d-orange-ink` ולא `--d-orange` של דן: לבן על #E07A3F הוא 2.99:1 (נמדד 01.10); על #A9542A — 5.26:1. */
.dan-community-publishing .dalert.warn .ic { background: var(--d-orange-ink); color: #fff; font-size: 14px; }
.dan-community-publishing .dalert.plain { background: #fff; border: 1px solid var(--d-line); color: var(--d-body); }
.dan-community-publishing .dalert.plain .ic { background: #EAF2EC; color: var(--d-green); }

.dan-community-publishing .dcard { background: #fff; border-radius: 22px; padding: 26px 28px; box-shadow: var(--d-shadow);
  display: flex; flex-direction: column; gap: 20px; }
.dan-community-publishing .dcard h2 { font-size: 17px; font-weight: 600; color: var(--d-ink); margin: 0;
  /* 01.10 — דן אינה נותנת ל-`.card h2` letter-spacing ו-line-height; base.css נותן לכל h2 (-.02em · 1.25). */
  letter-spacing: normal; line-height: normal; }
.dan-community-publishing .cardhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

.dan-community-publishing .f { display: flex; flex-direction: column; gap: 6px; }
.dan-community-publishing .f label,
.dan-community-publishing .f .lbl { font-size: 13px; color: var(--d-muted); font-weight: 600; }
.dan-community-publishing .f input,
.dan-community-publishing .f textarea { font-family: inherit; font-size: 15.5px; color: var(--d-text); background: #fff;
  border: 1px solid var(--d-line); border-radius: 11px; padding: 11px 13px; outline: none; transition: .15s; }
.dan-community-publishing .f textarea { resize: vertical; line-height: 1.55; min-height: 92px; }
.dan-community-publishing .f input:focus,
.dan-community-publishing .f textarea:focus { border-color: var(--d-green); box-shadow: 0 0 0 3px var(--d-mint); }
.dan-community-publishing .f [aria-invalid="true"] { border-color: var(--d-orange); }
.dan-community-publishing .ferr { margin: 0; font-size: 13px; color: var(--d-orange-ink); }
.dan-community-publishing .opt { font-weight: 400; color: var(--d-faint); }

/* קהל היעד. הכותרת **מעל** השורה ולא לצידה: בעברית RTL שורת flex-wrap עם תווית צמודה נשברה לשלוש שורות בנייד.
   בדן — צ'קבוקסים של מעמד/תפקיד/ענף/קבוצה/גיל; כאן — בחירה מקטלוג הקהלים (radio באותה צורה). */
.dan-community-publishing .aud { display: flex; flex-direction: column; gap: 9px; }
.dan-community-publishing .audg { display: flex; flex-direction: column; gap: 5px; }
.dan-community-publishing .audgl { font-size: 12px; font-weight: 600; color: var(--d-faint); }
.dan-community-publishing .audr { display: flex; flex-wrap: wrap; gap: 6px; }
.dan-community-publishing .aud label,
.dan-community-publishing .audr label { display: inline-flex; align-items: center; gap: 6px; font-size: 14px;
  border: 1px solid var(--d-line); border-radius: 999px; padding: 6px 14px; cursor: pointer; background: #fff; }
.dan-community-publishing .aud label:has(input:checked),
.dan-community-publishing .audr label:has(input:checked) { background: var(--d-mint); border-color: var(--d-green-mid); color: var(--d-green-dark); font-weight: 500; }
.dan-community-publishing .aud input,
.dan-community-publishing .audr input { width: 15px; height: 15px; accent-color: var(--d-green); cursor: pointer; padding: 0; }
.dan-community-publishing .pubrow { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.dan-community-publishing .dbtn { border: 1px solid var(--d-line); background: #fff; color: var(--d-text); font-family: inherit; font-size: 15px;
  font-weight: 500; padding: 11px 22px; border-radius: 999px; cursor: pointer; transition: .15s; }
.dan-community-publishing .dbtn.primary { background: var(--d-green); border-color: var(--d-green); color: #fff; font-weight: 600; }
.dan-community-publishing .dbtn.primary:hover { background: var(--d-green-dark); }
.dan-community-publishing .dbtn:disabled { opacity: .5; cursor: not-allowed; }
.dan-community-publishing .hint { font-size: 13.5px; color: var(--d-faint); }
/* סיכום קהל היעד — בלוק ולא שורה, מאז שיש כמה צירים. */
.dan-community-publishing .audsum { margin-top: 12px; padding: 9px 11px; border: 1px solid var(--d-line); border-radius: 9px;
  background: var(--d-mint); font-size: 13.5px; line-height: 1.65; }
.dan-community-publishing .audsum b { font-weight: 700; }
.dan-community-publishing .audsum .cond { display: block; }
.dan-community-publishing .audsum .k { color: var(--d-faint); }

/* ---------- רשימת ההודעות שפורסמו ---------- */
.dan-community-publishing .ann { padding: 15px 0; border-bottom: 1px solid var(--d-line-soft); display: flex; flex-direction: column; gap: 5px; }
.dan-community-publishing .ann:last-child { border-bottom: 0; }
.dan-community-publishing .ann.off .annt { color: var(--d-muted); }
.dan-community-publishing .annhead { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.dan-community-publishing .annt { font-size: 17px; font-weight: 600; color: var(--d-ink); flex: 1; min-width: 0; }
/* 🔴 01.10 (סוקר) — ב-375 הכותרת נמעכה לעמודה של ~70px ("גיוס / מתנדבים / לערב / הקהילתי"): בדן ל-`.annhead` שלושה ילדים (כותרת · תאריך · שני
   כפתורים), אצלנו נוספו תגי מצב ("פרסומת" · "חובת פרסום" · "טיוטה") — והם לוקחים את שאר השורה, כך שהכותרת לא יורדת לשורה משלה. בסיס `14em` ⟹ כשאין
   מקום היא עוברת לשורה חדשה במלוא הרוחב (flex-wrap:wrap) ונשברת רק אחרי שהיא ארוכה מהמכל. */
.dan-community-publishing .annhead .annt { flex: 1 1 14em; min-width: min(14em, 100%); }
.dan-community-publishing .annmeta { font-size: 12.5px; color: var(--d-faint); }
.dan-community-publishing .annimg { display: block; width: 100%; max-width: 320px; aspect-ratio: 16/9; object-fit: cover;
  border-radius: 10px; background: var(--d-cream2); margin-top: 4px; }
.dan-community-publishing .annacts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 2px; }
.dan-community-publishing .annacts label { position: relative; }
.dan-community-publishing .annacts input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.dan-community-publishing .annacts label,
.dan-community-publishing .annacts button { font-size: 12.5px; color: var(--d-muted); background: none;
  border: 1px solid var(--d-line); border-radius: 999px; padding: 4px 11px; cursor: pointer; font-family: inherit; }
.dan-community-publishing .annacts label:hover,
.dan-community-publishing .annacts button:hover { border-color: var(--d-green); color: var(--d-green-dark); }
.dan-community-publishing .xbtn { border: 0; background: none; color: var(--d-faint); cursor: pointer; font-size: 18px; line-height: 1;
  padding: 2px 8px; border-radius: 8px; flex: none; font-family: inherit; }
.dan-community-publishing .xbtn:hover { color: var(--d-orange-ink); background: var(--d-orange-soft); }
/* תגי מצב (שלנו) — טיוטה · פרסומת · חובת פרסום · בוטלה: בצורה של `.pill-*` של הדשבורד. */
.dan-community-publishing .dpill { font-size: 12px; font-weight: 500; border-radius: 999px; padding: 2px 9px; white-space: nowrap; flex: none; }
.dan-community-publishing .dpill.warn { background: var(--d-orange-soft); color: var(--d-orange-ink); }
.dan-community-publishing .dpill.mute { background: var(--d-cream2); color: var(--d-muted); }
.dan-community-publishing .dpill.ok { background: var(--d-mint); color: var(--d-green-dark); }

/* --- מחולל ההודעות: טופס + תצוגה מקדימה, מסך אחד --- */
/* ⚠️ [hidden] עם !important. שדות התבנית מוסתרים דרך המאפיין, וכל כלל display שיושב על .f/.frow מנצח את
   ברירת המחדל של [hidden] בשקט — בדיוק כך נשאר תפריט המשתמש פתוח ימים שלמים בדן. dan.css מכריז אותו
   ל-`.dan [hidden]`; כאן הוא חוזר על `.composer` כמו במקור. */
.dan-community-publishing .composer [hidden] { display: none !important; }
.dan-community-publishing .composer { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.dan-community-publishing .tpl { display: flex; gap: 6px; flex-wrap: wrap; }
.dan-community-publishing .tpl button { font-family: inherit; font-size: 14px; color: var(--d-muted); background: #fff;
  border: 1px solid var(--d-line); border-radius: 999px; padding: 8px 16px; cursor: pointer; }
.dan-community-publishing .tpl button:hover { border-color: var(--d-green-mid); }
.dan-community-publishing .tpl button.on { background: var(--d-green); border-color: var(--d-green); color: #fff; font-weight: 500; }
.dan-community-publishing .frow { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.dan-community-publishing .frow .f.grow { flex: 1 1 170px; }
.dan-community-publishing .sect { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--d-line-soft); padding-top: 16px; }
.dan-community-publishing .sect > label,
.dan-community-publishing .sect > .lbl { font-size: 13px; color: var(--d-muted); font-weight: 600; }
.dan-community-publishing .dbtn.small { font-size: 13.5px; padding: 7px 15px; align-self: flex-start; }
.dan-community-publishing .points { display: flex; flex-direction: column; gap: 10px; }
.dan-community-publishing .pt { border: 1px solid var(--d-line); border-radius: 12px; padding: 10px 12px;
  display: flex; flex-direction: column; gap: 8px; background: #fff; }
.dan-community-publishing .ptmain,
.dan-community-publishing .sb { display: flex; gap: 8px; align-items: center; }
.dan-community-publishing .ptn { flex: none; min-width: 28px; font-size: 13px; font-weight: 600; color: var(--d-green); }
.dan-community-publishing .pt input { flex: 1; min-width: 0; font-family: inherit; font-size: 15px; color: var(--d-text);
  border: 1px solid var(--d-line); border-radius: 9px; padding: 9px 11px; outline: none; transition: .15s; }
.dan-community-publishing .pt input:focus { border-color: var(--d-green); box-shadow: 0 0 0 3px var(--d-mint); }
.dan-community-publishing .ptx { flex: none; border: 0; background: none; color: var(--d-faint); font-size: 18px; line-height: 1;
  cursor: pointer; padding: 3px 8px; border-radius: 7px; font-family: inherit; }
.dan-community-publishing .ptx:hover { color: var(--d-orange-ink); background: var(--d-orange-soft); }
.dan-community-publishing .ptsubs { display: flex; flex-direction: column; gap: 6px; padding-inline-start: 22px; }
.dan-community-publishing .ptsub { align-self: flex-start; border: 0; background: none; font-family: inherit; font-size: 13px;
  color: var(--d-green); cursor: pointer; padding: 0; }
.dan-community-publishing .ptsub:hover { color: var(--d-orange-ink); }
/* ⚠️ שדות צרים בכוונה. עמודת הטופס היא חצי מ-max-width:1000px, ובשדות רחבים יותר "נמנעו" נשבר לשורה
   שנייה וכל החלטה גבהה בשורה מיותרת. שלוש ספרות נכנסות בנוחות. */
.dan-community-publishing .dc .votes { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; padding-inline-start: 36px; }
.dan-community-publishing .dc .votes label { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--d-muted); }
.dan-community-publishing .dc .votes input[type=number] { flex: none; width: 58px; font-size: 14px; padding: 6px 7px; text-align: center; }
.dan-community-publishing .dc .votes .pass { border: 1px solid var(--d-line); border-radius: 999px; padding: 5px 13px; background: #fff; cursor: pointer; }
.dan-community-publishing .dc .votes .pass:has(input:checked) { background: var(--d-mint); border-color: var(--d-green-mid);
  color: var(--d-green-dark); font-weight: 500; }
.dan-community-publishing .dc .votes input[type=checkbox] { accent-color: var(--d-green); width: 15px; height: 15px; cursor: pointer; }
.dan-community-publishing .pv { position: sticky; top: 22px; }
.dan-community-publishing .phone { background: var(--d-cream2); border: 1px solid var(--d-line); border-radius: 18px;
  padding: 15px 16px; display: flex; flex-direction: column; gap: 11px; }
.dan-community-publishing .phead { font-size: 14.5px; font-weight: 600; color: var(--d-ink); }
.dan-community-publishing .pitem { background: #fff; border-radius: 14px; padding: 15px 16px; display: flex; flex-direction: column;
  gap: 9px; box-shadow: 0 1px 2px rgba(16,42,32,.05); }
.dan-community-publishing .pitem .pn { font-size: 17px; font-weight: 500; color: var(--d-text); }
.dan-community-publishing .pitem .pd { font-size: 13px; color: var(--d-faint); }
.dan-community-publishing .pempty { font-size: 14px; color: var(--d-faint); }

@container dan-publishing (max-width: 720px) {
  .dan-community-publishing .composer { grid-template-columns: minmax(0, 1fr); }
  .dan-community-publishing .pv { position: static; }
}
@container dan-publishing (max-width: 560px) {
  .dan-community-publishing .dcard { padding: 22px 18px; }
  /* 🔴 01.10 (סוקר) — `.alert{min-width:0}` של דן (ב-`@media(max-width:820px)`) לבדו אינו מפרק את הרצועה: `flex:1` + `min-width:0` מקצים לשלוש
     ההתראות ~115px כל אחת, שורה בשורה ("מילה אחת בשורה", רצועה של ~450px גובה). `flex-basis:100%` מעמיד אותן זו מתחת לזו — כמו `manager.css`
     (`/community`, אותו כלל ב-700px). ui-viewport בודק גלישה אופקית בלבד ולא היה תופס זאת. */
  .dan-community-publishing .dalert { flex-basis: 100%; min-width: 0; }
}

/* ---------- טבעת המקלדת — **אחרונה בקטע**, אחרי כל `outline:none` ---------- */
/* 🔴 01.10 (סוקר) — ⑤ בכותרת. `.f input`/`.f textarea`/`.pt input` מכבים `outline` בספציפיות (0,2,1); הכלל הזה בעל אותה ספציפיות, ולכן חייב לבוא אחריהם
   כדי לנצח. בלי זה שדות הטקסט נשארו עם הזוהר המנטה (≈1.1:1) — עובר את ui-keyboard (שמקבל כל box-shadow) אך אינו הטבעת שהכותרת מבטיחה. */
.dan-community-publishing :is(a, button, input, textarea, select):focus-visible,
.dan-community-publishing label:has(input[type=file]:focus-visible) { outline: 2px solid var(--d-green); outline-offset: 2px; }

/* ═══════════════════════════════════════════════════════════════════════════
   הנהלה ומוסדות · `/community/board` — 01.10 (סוקר: המסך היחיד ביחידה שנשאר בשפה הגנרית)
   ⚠️ **אין לו מקור בדן** (`board.html` הוא לוח המודעות) — לכן הכללים כאן הם הפרימיטיבים של דן, **לא עיצוב שהומצא**: כרטיס `.dcard`
   (22px, `--d-shadow`) · סרגל כותרת `.dtop` · שורות רשימה כמו `committees.html` (`.cname` 16px/600, `.purpose` 13px, קו `--line-soft`) ·
   תג `.dpill` · ריבועי מניין כמו אריחי הדשבורד. 🔁 גיל: הכרעת סגנון בלי מקור.
   ═══════════════════════════════════════════════════════════════════════════ */
.dan-community-board { container: dan-board / inline-size; display: flex; flex-direction: column; gap: 22px; max-width: 1180px; color: var(--d-text); }
.dan-community-board a { color: var(--d-green); text-decoration: none; }
.dan-community-board a:hover { color: var(--d-orange-ink); }
.dan-community-board :is(a, button):focus-visible { outline: 2px solid var(--d-green); outline-offset: 2px; border-radius: 6px; }

.dan-community-board .dtop { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.dan-community-board h1 { font-size: 27px; font-weight: 600; color: var(--d-ink); letter-spacing: -.02em; margin: 0 0 5px; }
.dan-community-board .dtop .meta { font-size: 15.5px; color: var(--d-muted); }

.dan-community-board .bcounts { display: flex; gap: 12px; flex-wrap: wrap; }
.dan-community-board .bcount { flex: 1 1 150px; background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: var(--d-shadow);
  display: flex; flex-direction: column; gap: 2px; }
.dan-community-board .bcount b { font-size: 26px; font-weight: 600; color: var(--d-ink); line-height: 1.15; }
.dan-community-board .bcount span { font-size: 13.5px; color: var(--d-muted); }
.dan-community-board .bcount.warn b { color: var(--d-orange-ink); }

.dan-community-board .dcard { background: #fff; border-radius: 22px; padding: 26px 28px; box-shadow: var(--d-shadow);
  display: flex; flex-direction: column; gap: 18px; }
.dan-community-board .dcard h2 { font-size: 17px; font-weight: 600; color: var(--d-ink); margin: 0; letter-spacing: normal; line-height: normal; }
.dan-community-board .cardhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.dan-community-board .note { margin: 0; font-size: 15px; color: var(--d-muted); line-height: 1.6; }

.dan-community-board .blist { display: flex; flex-direction: column; }
.dan-community-board .brow { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 4px;
  border-bottom: 1px solid var(--d-line-soft); color: var(--d-text); }
.dan-community-board .brow:last-child { border-bottom: 0; }
.dan-community-board .brow:hover { background: #FCFAF3; color: var(--d-text); }
.dan-community-board .bmain { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.dan-community-board .bname { font-size: 16px; font-weight: 600; color: var(--d-ink); }
.dan-community-board .brow:hover .bname { color: var(--d-orange-ink); }
.dan-community-board .bmeta { font-size: 13px; color: var(--d-muted); line-height: 1.5; max-width: 62ch; }
.dan-community-board .dpill { font-size: 12px; font-weight: 500; border-radius: 999px; padding: 2px 9px; white-space: nowrap; flex: none; }
.dan-community-board .dpill.ok { background: var(--d-mint); color: var(--d-green-dark); }
.dan-community-board .dpill.warn { background: var(--d-orange-soft); color: var(--d-orange-ink); }

@container dan-board (max-width: 560px) {
  .dan-community-board .dcard { padding: 22px 18px; }
  .dan-community-board .bcount { flex-basis: calc(50% - 6px); }
}