/* ============================================================
   پوستهٔ ۶ — طرح نهایی (انتخابِ صاحب سامانه)
   ============================================================
   قاعدهٔ کلی بعد از دیدنش: «۶ بماند، ولی فضاها مثل ۴ پر شود.»

   · چیپ‌ها کوچک و یک‌خطی‌اند — مثل چهار دکمهٔ مرخصی/غیبتِ تردد.
     گریدِ دوستونهٔ قدیمی برداشته شد؛ هفت نقش در یک سطر جا می‌شوند.
   · در دسترسی‌ها هر اجازه یک سطر است: عنوان راست، سه دکمه چپ.
   · کارت و تاشو و فاصله‌ها به تراکمِ طرح ۴ نزدیک شدند، ولی اندازهٔ
     متن نه — خوانایی مالِ داور ۲ و ۷ است و قربانی نمی‌شود.

   قول‌های هشت داور سر جایشان است: کنتراست ‎4.9:1‎، فوکوس دیدنی،
   عدد هم‌عرض، معنا هیچ‌جا فقط با رنگ نیست.
   ============================================================ */

/* ---------- پایه: کنتراست و خط فارسی (داور ۷ و ۸) ---------- */
:root{
  --muted:#4E5C68;
  --line:#E0DBD0;
}
body{font-size:15px;line-height:1.8}
.kv b,.tile u,.tag,.frow b,.mini b,.mv,.shv{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:6px}

/* ---------- مقیاس (داور ۳) ---------- */
.appbar .ttl b{font-size:16.5px}
.card>h2{font-size:14.5px}
.sec{font-size:11px;letter-spacing:.4px;font-weight:700}
.card>.sub,.hint{font-size:12px;line-height:1.7}
.card>.sub{margin-bottom:7px}

/* خانه: هر چهار شمارنده در یک سطر — صاحب سامانه خواست مثل قبل
   همه دیده شوند، صفر هم خبر است. */
.tiles{grid-template-columns:repeat(4,1fr);gap:6px}
.tile{padding:8px 6px}
.tile u{font-size:22px}
@media (max-width:520px){.tiles{grid-template-columns:repeat(2,1fr)}}

/* فهرست خانه: دو ستون کنار هم */
.menu{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.menu a{margin-bottom:0}
@media (max-width:640px){.menu{grid-template-columns:1fr}}

/* ---------- تراکمِ طرح ۴، با متنِ خوانا ---------- */
.wrap{padding:10px 9px 16px}
.card,.fcard{padding:10px 12px;margin-bottom:6px;border-radius:12px}
.menu a{padding:9px 12px}
.menu a .ic{background:var(--soft);border-radius:9px;padding:5px;flex-basis:32px;height:32px}
.menu a .ic svg{width:17px;height:17px}
.kv{padding:3px 0}
.row{padding:8px 11px;margin-bottom:5px}
.field{margin-bottom:8px}
.field label{margin-bottom:3px}
.msg{padding:9px 12px}
.empty{padding:14px}
.mbox{min-height:0;padding:7px 10px}
.mini{min-height:44px}
.fcard h4{margin-bottom:4px}
.frow{padding:2.5px 0}
.k3{gap:6px;margin-bottom:7px}
.k3 div{padding:7px 5px}
.gapnote{padding:7px 10px;font-size:12px;line-height:1.65}
.yearbar{padding:6px 10px;margin-bottom:7px}
.shgrid{gap:3px;margin-top:6px}
.shday{min-height:64px;padding:5px 2px}

/* ---------- چیپ‌ها: کوچک، یک‌خطی — مثل دکمه‌های تردد ----------
   گریدِ دوستونه فقط برای انتخابگرِ توضیح‌دار (نوع جلسه) می‌ماند؛
   بقیه در یک سطر می‌نشینند و اگر جا نشد، می‌شکنند. */
.typepick{display:flex;flex-wrap:wrap;gap:5px}
.tp{padding:5px 12px;font-size:12.5px;border-radius:99px;flex:0 1 auto;min-height:32px}
.tp i{width:8px;height:8px}
.tp small{font-size:10.5px;margin-right:6px}
.tp.picked,.typepick .tp:has(input:checked){border-color:var(--navy);background:var(--navy);color:#fff}
.tp.picked small,.typepick .tp:has(input:checked) small{color:rgba(255,255,255,.8)}
/* انتخابگرِ توضیح‌دار (نوع جلسه در تقویم) دوستونه و درشت می‌ماند —
   آنجا توضیح بخشی از تصمیم است */
.typepick.big{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.typepick.big .tp{padding:11px 10px;font-size:15px;border-radius:12px}

/* زبانه‌های بخش (مالی و مانندش): قرصِ کوچک با شمارنده */
.tabs{gap:6px;border:none;background:transparent;padding:2px 2px 6px}
.tabs a{border:1px solid var(--line);background:var(--card);border-radius:99px;
  padding:5px 12px;font-size:12.5px;min-height:34px;display:inline-flex;align-items:center;gap:6px}
.tabs a.on{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:none}
.tabs a i,.tabs a b{background:var(--paper);color:var(--muted);border-radius:99px;
  padding:0 6px;font-size:10.5px;font-weight:700;min-width:16px;text-align:center;font-style:normal}
.tabs a.on i,.tabs a.on b{background:rgba(255,255,255,.22);color:#fff}

/* ---------- دسترسی‌ها: هر اجازه یک سطر ----------
   چهار سطر بود — دو سطر عنوان و توضیح، دو سطر دکمه. حالا عنوان
   راست می‌نشیند و سه دکمهٔ کوچک چپ، روبه‌رویش. */
.tlev{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:5px 0;border-bottom:1px solid var(--line)}
.tlev:last-child{border-bottom:none}
.tlev .fh-top{flex:1 1 auto;min-width:0}
.tlev .typepick{flex:0 0 auto;flex-wrap:nowrap}
.tlev .tp{padding:4px 10px;font-size:12px;min-height:30px;white-space:nowrap}

/* ---------- لمس (داور ۷): کوچک ولی نه ریز ---------- */
.btn{min-height:40px}
.btn.sm{min-height:32px}
.tabbar a{min-height:52px}
.mbtn{min-height:52px}

/* ---------- رنگ کمتر در مالی (داور ۱) ---------- */
.mini.p{background:var(--slate-bg);color:var(--slate)}

/* ---------- تاشوها: سطرِ جمع، بدنهٔ جمع ---------- */
details.fold{margin-bottom:5px}
.fold>summary{padding:9px 12px}
.fold>.fold-bd{padding:9px 12px}
.fold[open]{border-color:#D5CFC2}
.fold>summary b{font-size:13.5px}
.fold>summary s{font-size:11.5px}

/* پرکاربردها برجسته (داور ۶) */
a.row:hover,.menu a:hover,.fold>summary:hover{background:var(--soft)}

/* در گوشی، سطرِ یک‌خطیِ دسترسی‌ها جا کم می‌آورد — عنوان بالا،
   دکمه‌ها زیرش. در صفحهٔ بزرگ همان یک سطر می‌ماند. */
@media (max-width:520px){
  .tlev{flex-wrap:wrap}
  .tlev .typepick{flex-wrap:wrap}
}

/* ---------- پرونده: دو تا سه ستون ----------
   چهارده فیلدِ زیرهم یعنی چهارده سطر اسکرول برای هیچ. در صفحهٔ
   بزرگ، ستون‌بندی خودکار: هرچه جا باشد ۲ یا ۳ ستون. فیلدی که
   وسطِ ویرایش است تمام‌عرض می‌شود تا فرمش جا داشته باشد. */
@media (min-width:700px){
  .card:has(> .fd-row){display:grid;
    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
    column-gap:26px;align-items:start}
  .fd-row.editing,.fd-edit{grid-column:1/-1}
}

/* صفحه از عرض استفاده کند — تراکمِ طرح ۴ فقط عمودی نیست */
.wrap{max-width:980px}
.wrap.narrow{max-width:860px}

/* زبانه‌ها در گوشی بشکنند، نه اینکه از قاب بزنند بیرون */
.tabs{flex-wrap:wrap}

/* ============================================================
   فرم جلسه (تقویم) — هم‌خانواده با زبانِ چیپ
   چهار حرکت: نوع جلسه و ماه‌ها چیپِ یک‌خطی · مسئول و فضا یک‌سطری
   (نام راست، وضعیت چپ — نصف باکسِ خالی حذف) · شروع و پایان کنار
   هم · روزهای هفته هم‌شکل بقیهٔ چیپ‌ها.
   ============================================================ */

/* نوع جلسه: چیپ رنگ‌نقطه‌دار — توضیحی ندارد که جعبه بخواهد */
.pop .tsel,.overlay.solo .pop .tsel,.overlay.solo .sheet .tsel{
  display:flex;flex-wrap:wrap;gap:5px;margin-bottom:7px;align-content:flex-start;align-items:flex-start}
.tsel label{border-radius:99px;padding:5px 12px;font-size:12.5px;flex:0 1 auto;
  min-height:32px;overflow:visible}
.tsel label i{width:8px;height:8px}
.tsel label:has(input:checked){background:var(--navy);border-color:var(--navy);
  color:#fff;font-weight:700}

/* شروع و پایان در یک سطر — مدت زیرشان تمام‌عرض */
.pop .tman{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.pop .tman .tcell:nth-child(3){grid-column:1/-1}

/* مسئول و فضا: یک سطر — نام راست، وضعیت چپ */
.pop .rc,.overlay.solo .pop .rc,.overlay.solo .sheet .rc,
.overlay.solo .pop .cc,.overlay.solo .sheet .cc{
  flex-direction:row;justify-content:space-between;align-items:center;
  gap:8px;padding:7px 11px;min-height:38px;line-height:1.4}
.pop .rc small,.pop .cc small{margin:0;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;max-width:55%}

/* ماه‌ها: چیپ با سالِ ریز — سیزده جعبهٔ بزرگ لازم نبود */
.pop .mdays,.overlay.solo .sheet .mdays{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:7px}
.pop .md{border-radius:99px;padding:4px 12px;font-size:12.5px;font-weight:500;
  display:inline-flex;align-items:baseline;gap:5px;overflow:visible;min-height:32px}
.pop .md small{font-size:10px;font-weight:400}
.pop .md.on{background:var(--navy);border-color:var(--navy)}

/* روزهای هفته: قرص، مثل بقیه */
.pop .wdays{flex-wrap:wrap;gap:5px}
.pop .wd{flex:0 1 auto;border-radius:99px;padding:5px 13px;font-weight:500;min-height:32px}

/* تاشوی درونی (گروه‌های «کسانی که در جلسه‌اند») — سبک‌تر از کارت */
.fold.sub{background:var(--soft);border:1px solid var(--line);border-radius:10px;
  margin:6px 0;padding:0}
.fold.sub>summary{padding:8px 11px}
.fold.sub>summary b{font-size:12.5px}
.fold.sub>.fold-bd{padding:8px 11px;background:var(--card);
  border-radius:0 0 10px 10px}

/* ---------- نوار هفتهٔ «گزارش‌های بله» ----------
   هفت ستون: هر ستون یک روز، بالایش گزارشِ دانش‌آموز، پایینش
   بررسیِ مشاور. «رها» تنها خانهٔ سرخ است — باید از دور داد بزند. */
.bwk{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:4px 0 6px}
.bwd{display:flex;flex-direction:column;align-items:center;gap:3px;
  border:1px solid var(--line);border-radius:9px;padding:5px 2px;background:var(--card)}
.bwd.fut{border-style:dashed;opacity:.55}
.bwd i{font-style:normal;font-size:10.5px;color:var(--muted);line-height:1}
.bwd b{width:100%;text-align:center;border-radius:6px;font-size:11px;line-height:1.7;
  font-weight:700}
.bwd b.g{background:var(--green-bg);color:var(--green)}
.bwd b.b{background:var(--brass-bg);color:var(--brass)}
.bwd b.r{background:var(--red);color:#fff}
.bwd b.x{background:var(--soft);color:var(--muted);font-weight:400}
.bwd b.f{background:transparent}

/* خانهٔ روز حالا در است — لینک، با همان ظاهر؛ لمسش خبر بدهد */
a.bwd{text-decoration:none;color:inherit;cursor:pointer}
a.bwd:hover{border-color:var(--navy)}
.bwd.sel{border-color:var(--navy);border-width:2px;background:var(--blue-bg)}

/* ============================================================
   رصد بله — سه نمای تازه
   ============================================================ */

/* هفتهٔ مرکز، روز به روز: هفت ستون، هر روز سه عدد رنگی */
.bdw{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.bdd{border:1px solid var(--line);border-radius:10px;background:var(--card);
  padding:6px 3px;display:flex;flex-direction:column;align-items:center;gap:3px}
.bdd.fut{border-style:dashed;opacity:.5;min-height:74px}
.bdd i{font-style:normal;font-size:10.5px;color:var(--muted);line-height:1.3;text-align:center}
.bdd i em{font-style:normal;display:block;font-weight:700;font-size:12px;color:var(--ink)}
.bdd b{width:88%;text-align:center;border-radius:6px;font-size:12px;line-height:1.6;
  font-weight:700;font-variant-numeric:tabular-nums}
.bdd b.g{background:var(--green-bg);color:var(--green)}
.bdd b.n{background:var(--blue-bg);color:var(--navy)}
.bdd b.r{background:var(--red);color:#fff}
.bdd b.x{background:var(--soft);color:var(--muted);font-weight:400}

/* سلامت دریافت داده حالا SVG است (در balewatch.php) — نه گریدِ CSS.
   مقیاسِ عددی و ربع‌ساعت با گرید در نمی‌آمد. */

/* ماتریس کیفیت: سطر گزارش/بررسی × ستون متن/ویس/فایل */
.qmx{display:grid;grid-template-columns:auto 1fr 1fr 1fr;gap:4px;align-items:stretch}
.qmx .qh{font-size:11px;font-weight:700;color:var(--muted);text-align:center;padding:2px 0}
.qmx .qr{font-size:12px;font-weight:700;display:flex;align-items:center;padding-left:8px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:9em}
.qmx .qc{border:1px solid var(--line);border-radius:9px;background:var(--card);
  padding:5px 4px;display:flex;flex-wrap:wrap;gap:3px;align-items:center;justify-content:center;
  min-height:38px}
.qmx .qc b{border-radius:6px;padding:1px 7px;font-size:12px;font-weight:700;
  font-variant-numeric:tabular-nums;display:inline-flex;align-items:baseline;gap:3px}
.qmx .qc b em{font-style:normal;font-weight:400;font-size:9.5px;opacity:.85}
.qmx .qc b.g{background:var(--green-bg);color:var(--green)}
.qmx .qc b.b{background:var(--brass-bg);color:var(--brass)}
.qmx .qc b.r{background:var(--red-bg);color:var(--red)}
.qmx .qc b.x{background:var(--soft);color:var(--muted);font-weight:400}
.qmx .qz{color:var(--line);font-size:13px}
@media (max-width:520px){
  .qmx{grid-template-columns:auto 1fr 1fr 1fr;font-size:11px}
  .qmx .qr{max-width:6em;font-size:11px}
}

/* ---------- رصد: سطرِ حکم با دکمهٔ اقدام ----------
   حکم بدون دکمه یعنی مدیر باید جای دیگری کاری کند و یادش بماند
   که کرد. دکمه کنارِ خودِ خبر می‌نشیند. */
.vrow{display:flex;align-items:center;gap:8px;
  padding:6px 0;border-bottom:1px solid var(--line)}
.vrow:last-child{border-bottom:none}
.vrow .nm{flex:1 1 auto;min-width:0}
.vrow .nm a{color:var(--navy);font-weight:700;text-decoration:none}
.vrow .nm a:hover{text-decoration:underline}
.vrow .vack{flex:0 0 auto;margin:0}
.vrow .vack .btn{min-height:30px;padding:0 10px;font-size:12px;white-space:nowrap}

/* خانهٔ روزِ نامعلوم — نه سبز، نه قرمز؛ خاکستریِ خط‌دار.
   رنگِ خنثی عمدی است: ندانستن خبرِ بد نیست، خبرِ نبودِ نقش است. */
.bwd b.u{background:repeating-linear-gradient(45deg,var(--soft),var(--soft) 3px,
  transparent 3px,transparent 6px);color:var(--muted);font-weight:400}

/* ضعیف‌ترها و قوی‌ترها، دو ستون کنار هم در صفحهٔ بزرگ */
.rk{display:grid;gap:10px}
@media (min-width:700px){.rk{grid-template-columns:1fr 1fr;column-gap:18px}}
.rk .row{margin-bottom:4px}
.bdd b.u{background:repeating-linear-gradient(45deg,var(--soft),var(--soft) 3px,
  transparent 3px,transparent 6px);color:var(--muted);font-weight:400;font-size:10px}

/* نمودار سلامت: در صفحهٔ کوچک قابِ خودش اسکرول می‌خورد، نه صفحه */
.hsc{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}

/* اتصال مشاور: نام راست، کشویی و دکمه چپ — یک سطر برای هر نفر */
.prow{display:flex;align-items:center;gap:8px;margin:0;
  padding:6px 0;border-bottom:1px solid var(--line)}
.prow:last-child{border-bottom:none}
.prow .nm{flex:1 1 auto;min-width:0}
.prow .psel{flex:0 0 auto;max-width:190px;min-height:32px;padding:4px 8px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;font-size:12.5px;color:inherit}
.prow .btn{min-height:32px;padding:0 12px;font-size:12px}
@media (max-width:560px){
  .prow{flex-wrap:wrap}
  .prow .nm{flex:1 1 100%}
  .prow .psel{max-width:none;flex:1 1 auto}
}

/* ---------- سطرِ گروه در تاشوی مشاور: یک خط ----------
   نام و نوارِ هفته و نمره کنارِ هم. پیش از این سه طبقه بود و هر
   گروه ۱۷۰ پیکسل می‌گرفت؛ چهل گروه یعنی هفت هزار پیکسل اسکرول. */
.grow{display:flex;align-items:center;gap:10px;padding:5px 0;
  border-bottom:1px solid var(--line)}
.grow:last-child{border-bottom:none}
.grow .nm{flex:1 1 auto;min-width:0;overflow:hidden}
.grow .nm a{color:var(--navy);font-weight:700;text-decoration:none}
.grow .nm a:hover{text-decoration:underline}
.grow .tags{flex:0 0 auto}
/* flex-direction را صریح می‌نویسیم: قاعده‌ای عام‌تر در app.css
   ستونی‌اش می‌کرد و نوارِ هفته عمودی می‌شد. */
.bwk.mini{flex:0 0 auto;display:flex;flex-direction:row;flex-wrap:nowrap;gap:2px;margin:0;
  width:auto;min-width:max-content;grid-template-columns:none}
.bwk.mini .bwd{width:24px;min-width:24px;padding:2px 1px;gap:1px;border-radius:6px}
.bwk.mini .bwd i{font-size:8px}
.bwk.mini .bwd b{font-size:8.5px;line-height:1.45;border-radius:4px}

/* در گوشی نوار زیرِ نام می‌رود، ولی هنوز یک‌جا و جمع */
@media (max-width:560px){
  .grow{flex-wrap:wrap;gap:4px 8px}
  .grow .nm{flex:1 1 100%}
}

/* ============================================================
   داشبورد رصد — طرح ۵
   ستون‌ها در هر سه سطح یکی‌اند؛ مقایسه وقتی ممکن است که چشم
   برای رفتن از سطری به سطر دیگر حرکت نکند.
   ============================================================ */
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
/* تصادمِ نام: .strip اینجا نوارِ عددهاست (.strip .st) ولی در
   app.css ردیفِ تراشه‌هاست — و چون این فایل بعد از app.css می‌آید،
   هر ردیفِ تراشه در پنل چهارستونیِ کشیده می‌شد، نه قرص‌های کنارِ هم.
   جای دیدنش: عیب‌یابی «چه کسانی پیام تردد می‌گیرند»، کانالِ هر
   شماره در پروندهٔ دانش‌آموز، و کانالِ مدیرها در صفحهٔ پیامک.
   نام عوض نشد چون هر دو معنی جای دیگری هم استفاده می‌شوند؛
   به‌جایش ردیفی که تراشه دارد از این قاعده بیرون می‌ماند.
   مرورگرِ بی‌:has همان رفتارِ امروز را می‌بیند، پس پس‌رفتی نیست. */
.strip:has(> .tchip){display:flex;flex-wrap:wrap;gap:5px;
                     grid-template-columns:none}
.strip .st{background:var(--card);border:1px solid var(--line);border-radius:9px;
  padding:6px 8px;text-decoration:none;color:inherit;display:block}
.strip a.st:hover{background:var(--soft)}
.strip .st u{text-decoration:none;font-size:19px;font-weight:700;color:var(--navy);
  font-variant-numeric:tabular-nums;line-height:1.15;display:block}
.strip .st s{text-decoration:none;font-size:10.5px;color:var(--muted);display:block}
.meta{font-size:10.5px;color:var(--muted);margin:5px 2px 8px;display:flex;gap:14px;flex-wrap:wrap}

/* جدولِ مقایسه — گرید مشترکِ هر سه سطح */
.tbl{display:grid;grid-template-columns:1fr 92px 120px 108px 12px;
  align-items:center;column-gap:10px}
.tbl > *{min-width:0}
.tbl .th{font-size:10.5px;color:var(--muted);padding:0 0 4px;border-bottom:1px solid var(--line)}
.tbl .th.n{text-align:center}
a.tr{display:contents;text-decoration:none;color:inherit;cursor:pointer}
a.tr > span{padding:5px 0;border-bottom:1px solid var(--line)}
a.tr:hover > span{background:var(--soft)}
.nm2 b{font-size:13px;display:block;line-height:1.35}
.nm2 s{text-decoration:none;font-size:10.5px;color:var(--muted);display:block}
.nm2 .r{color:var(--red)}
svg.cell{display:block;width:100%;height:22px}
.sil{text-align:center;font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.sil small{display:block;font-weight:400;font-size:9.5px;color:var(--muted)}
.sil.r{color:var(--red)} .sil.g{color:var(--green)} .sil.b{color:var(--brass)}

/* کارتِ اقدام */
.act{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:7px 0;
  border-bottom:1px solid var(--line)}
.act:last-child{border-bottom:none}
.act .w{flex:1 1 220px;min-width:0;text-decoration:none;color:inherit}
.act .w b{font-size:13.5px;display:block;color:var(--navy)}
.act .w s{text-decoration:none;font-size:11px;color:var(--muted);display:block;margin-top:2px}
.act .w:hover b{text-decoration:underline}
.act .why{font-size:11px;color:var(--muted);background:var(--soft);
  border-radius:99px;padding:2px 8px;white-space:nowrap}
.act .vack{margin:0;flex:0 0 auto}
.act .vack .btn{min-height:28px;padding:0 10px;font-size:11.5px;white-space:nowrap}

/* کارت نظر شورا */
.crow{display:flex;align-items:center;gap:9px;padding:6px 0;border-bottom:1px solid var(--line)}
.crow:last-child{border-bottom:none}
.crow .cw{flex:1 1 auto;min-width:0}
.crow .cw b{font-size:13px;display:block;font-weight:700}
.crow .cw s{text-decoration:none;font-size:11px;color:var(--muted);display:block;margin-top:2px}
.crow .tag{flex:0 0 auto}

@media (max-width:620px){
  .tbl{grid-template-columns:1fr 92px 12px}
  .hide-s{display:none}
  .strip{grid-template-columns:repeat(2,1fr)}
}

/* ---------- نوارِ سلامت داده — بالاترین جای صفحه ----------
   اگر داده سالم نباشد، هر عددِ زیرش مشکوک است. پس اول این، و
   کوچک: خبرِ زیرساخت نباید جای خبرِ مرکز را بگیرد. */
.hbar2{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;
  background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:7px 11px;margin-bottom:8px}
.hbar2:hover{background:var(--soft)}
.hbar2 .dot{flex:0 0 auto;width:9px;height:9px;border-radius:99px;background:var(--green)}
.hbar2.bad .dot{background:var(--red)}
.hbar2 .t{flex:1 1 auto;min-width:0}
.hbar2 .t b{font-size:13px;display:block;line-height:1.3}
.hbar2 .t s{text-decoration:none;font-size:11px;color:var(--muted);display:block}
.hbar2 .cov{flex:0 0 auto;font-size:11px;color:var(--muted);white-space:nowrap}
.hbar2 .go{flex:0 0 auto;color:var(--muted);font-size:14px}

/* ---------- سطرِ اقدام: شماره، نام، قدمِ بعد ----------
   قبلاً چیپ و تگ و دکمه کنارِ هم بودند و شلوغ می‌شد. حالا شماره
   ترتیب را می‌گوید و رنگ فقط در همان شماره است. */
.arow{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:7px 0;
  border-bottom:1px solid var(--line)}
.arow:last-child{border-bottom:none}
.arow .rk{flex:0 0 auto;width:21px;height:21px;border-radius:99px;background:var(--soft);
  color:var(--muted);font-size:11.5px;font-weight:700;display:flex;
  align-items:center;justify-content:center}
.arow .rk.r{background:var(--red);color:#fff}
.arow .rk.b{background:var(--brass);color:#fff}
.arow .w{flex:1 1 200px;min-width:0;text-decoration:none;color:inherit}
.arow .w b{font-size:13.5px;display:block;color:var(--navy)}
.arow .w:hover b{text-decoration:underline}
.arow .w s{text-decoration:none;font-size:11px;color:var(--muted);display:block;margin-top:2px}
.arow .nx{flex:0 0 auto;font-size:11px;color:var(--brass);white-space:nowrap}
.arow .vack{margin:0;flex:0 0 auto}
.arow .vack .btn{min-height:27px;padding:0 9px;font-size:11px;white-space:nowrap}

/* ---------- جدولِ مقایسهٔ مشاورها: هم تعداد، هم درصد ---------- */
.cmp-w{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cmp{width:100%;min-width:560px;border-collapse:collapse;font-size:12.5px}
.cmp th{font-size:10.5px;color:var(--muted);font-weight:400;text-align:center;
  padding:0 4px 5px;border-bottom:1px solid var(--line);white-space:nowrap}
.cmp th.nm,.cmp td.nm{text-align:right}
.cmp td{text-align:center;padding:6px 4px;border-bottom:1px solid var(--line);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.cmp tr:hover td{background:var(--soft);cursor:pointer}
.cmp td b{font-size:13.5px;font-weight:700;display:block;line-height:1.25}
.cmp td s{text-decoration:none;font-size:10px;color:var(--muted);display:block}
.cmp td.nm a{color:var(--navy);font-weight:700;text-decoration:none}
.cmp td.nm s{font-size:10px;color:var(--red)}
.cmp td.g b,.cmp td.g{color:var(--green)}
.cmp td.b b,.cmp td.b{color:var(--brass)}
.cmp td.r b,.cmp td.r{color:var(--red)}
.cmp td.g s,.cmp td.b s,.cmp td.r s{color:inherit;opacity:.75}
.cmp td.sp{width:92px;padding:2px}
.cmp td.sp svg{height:20px}

/* ---------- منوی کشویی — بی‌جاوااسکریپت ---------- */
.navdd{margin-bottom:8px;border:1px solid var(--line);border-radius:10px;
  background:var(--card);overflow:hidden}
.navdd > summary{list-style:none;cursor:pointer;padding:8px 12px;
  display:flex;align-items:center;justify-content:space-between;gap:8px}
.navdd > summary::-webkit-details-marker{display:none}
.navdd > summary::marker{content:''}
.navdd > summary b{font-size:13.5px}
.navdd > summary i{font-style:normal;color:var(--muted);font-size:15px;
  transform:rotate(-90deg);transition:transform .15s}
.navdd[open] > summary i{transform:rotate(90deg)}
.navdd > summary:hover{background:var(--soft)}
.ndd{border-top:1px solid var(--line);padding:5px}
.ndd a{display:block;padding:7px 10px;border-radius:8px;text-decoration:none;
  color:inherit;font-size:13px}
.ndd a:hover{background:var(--soft)}
.ndd a.on{background:var(--blue-bg);color:var(--navy);font-weight:700}
.ndd s{display:block;text-decoration:none;font-size:10.5px;color:var(--muted);
  padding:7px 10px 3px;letter-spacing:.3px}

/* ---------- خطِ «ایرادی نبود» ---------- */
.okline{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);padding:3px 0}
.okline .dot{width:8px;height:8px;border-radius:99px;background:var(--green);flex:0 0 auto}

/* ---------- جدولِ مقایسه: سرستونِ دوطبقه و راهنمای عددها ---------- */
.cmp thead tr.grp th{font-size:11px;color:var(--navy);font-weight:700;
  padding-bottom:3px;border-bottom:1px solid var(--line)}
.cmp th.sep,.cmp td.sep{border-right:1px solid var(--line)}
.cmp td s{font-size:9.5px}
.cmp-key{margin-top:8px;padding-top:7px;border-top:1px solid var(--line);
  font-size:11px;color:var(--muted);line-height:1.9}
.cmp-key > b{display:block;font-size:11.5px;color:var(--navy);margin-bottom:2px}
.cmp-key span{display:block}
.cmp-key span b{color:var(--navy);font-weight:700}

/* سرستونِ پرسشی — دو خطه و آرام، چون خودش جمله است نه برچسب */
.cmp thead tr.ask th{font-size:10.5px; line-height:1.5; font-weight:400;
  color:var(--muted); padding-bottom:6px}
.cmp td b{white-space:nowrap}

/* ══════════ داشبوردِ رصد ══════════
   سه قاعده: سقفِ ارتفاع (صفحهٔ اول از یک نما بلندتر نمی‌شود) ·
   جای ثابت (خانهٔ بی‌داده خالی نمی‌شود) · یک کانون.
   چهار پلهٔ قلم: ۲۴ / ۱۳٫۵ / ۱۱٫۵ / ۱۰٫۵ — و بس. */
.top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:11px;
  padding:7px 12px;margin-bottom:8px}
.top .say{flex:1 1 280px;min-width:0;font-size:13.5px;line-height:1.6;color:var(--navy)}
.top .say b{font-weight:700}
.per{display:flex;gap:3px;flex:0 0 auto}
.per a{font-size:11.5px;padding:7px 13px;border-radius:99px;text-decoration:none;
  color:var(--muted);border:1px solid var(--line);min-height:36px;
  display:flex;align-items:center}
.per a:hover{background:var(--soft)}
.per a.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700}
.lamp{flex:0 0 auto;display:flex;align-items:center;gap:7px;font-size:11.5px;
  color:var(--muted);text-decoration:none;padding:5px 10px;border-radius:99px;
  border:1px solid var(--line);min-height:36px}
.lamp:hover{background:var(--soft)}
.lamp i{width:9px;height:9px;border-radius:99px;background:var(--green);flex:0 0 auto}
.lamp.bad i{background:var(--red)}
.lamp b{color:var(--ink);font-weight:500}

.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:8px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:7px 11px}
.kpi u{text-decoration:none;font-size:24px;font-weight:700;color:var(--navy);
  line-height:1.1;display:block;font-variant-numeric:tabular-nums}
.kpi u.r{color:var(--red)}
.kpi s{text-decoration:none;font-size:11.5px;color:var(--muted);display:block;
  margin-top:1px;line-height:1.6}
.kpi s b{color:var(--ink);font-weight:700}

.dash{display:grid;gap:8px;grid-template-columns:1fr}
@media (min-width:900px){
  .dash{grid-template-columns:1.35fr 1fr 0.95fr}
  .dash .full{grid-column:1/-1}
}
@media (min-width:620px) and (max-width:899px){
  .dash{grid-template-columns:1fr 1fr}
  .dash .full{grid-column:1/-1}
}
.cell{background:var(--card);border:1px solid var(--line);border-radius:11px;
  padding:8px 11px;display:flex;flex-direction:column;min-width:0}
.cell > h3{font-size:10.5px;letter-spacing:.4px;font-weight:700;color:var(--muted);
  margin:0 0 5px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.cell > h3 a{font-size:11.5px;color:var(--navy);text-decoration:none;font-weight:400;
  padding:8px 6px;margin:-8px -6px}
.cell > h3 a:hover{text-decoration:underline}

.act{display:flex;align-items:center;gap:9px;padding:5px 0;
  border-bottom:1px solid var(--line);min-height:40px}
.act:last-of-type{border-bottom:none}
.act:hover{background:var(--soft)}
.act .n{flex:0 0 auto;width:20px;height:20px;border-radius:99px;font-size:10.5px;
  font-weight:700;display:flex;align-items:center;justify-content:center;
  background:var(--soft);color:var(--muted)}
.act .n.r{background:var(--red);color:#fff}
.act .w{flex:1 1 auto;min-width:0;text-decoration:none;color:inherit}
.act .w b{font-size:13.5px;display:block;line-height:1.35;color:var(--navy)}
.act .w:hover b{text-decoration:underline}
.act .w s{text-decoration:none;font-size:11.5px;color:var(--muted);display:block}
.act .do{flex:0 0 auto;font-size:11.5px;color:var(--brass);white-space:nowrap}
.act .vack{margin:0;flex:0 0 auto}
.act .vack .btn{min-height:36px;padding:0 10px;font-size:11px;white-space:nowrap}

.crow{display:flex;align-items:center;gap:8px;padding:4px 0;
  border-bottom:1px solid var(--line);text-decoration:none;color:inherit;min-height:38px}
.crow:last-of-type{border-bottom:none}
.crow:hover{background:var(--soft)}
.crow .st{flex:0 0 auto;width:8px;height:8px;border-radius:99px}
.crow .st.g{background:var(--green)} .crow .st.b{background:var(--brass)}
.crow .st.r{background:var(--red)} .crow .st.n{background:var(--line)}
.crow .nm{flex:1 1 auto;min-width:0;font-size:13.5px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.crow .nm s{text-decoration:none;font-size:10.5px;color:var(--muted);display:block}
.crow .v{flex:0 0 auto;font-size:13.5px;font-variant-numeric:tabular-nums;
  color:var(--muted);text-align:left;min-width:56px;white-space:nowrap}
.crow .v b{color:var(--navy);font-weight:700;display:block;line-height:1.3}
.crow .v s{text-decoration:none;font-size:10.5px;color:var(--muted);display:block}

.chart svg{width:100%;height:auto;display:block}
.chart .cap{font-size:10.5px;color:var(--muted);margin-top:2px;line-height:1.65}
.chart .cap b{color:var(--navy)}
.sep-h{border-top:1px solid var(--line);margin:6px 0 5px}

.belowfold{margin-top:14px;padding-top:10px;border-top:1px dashed var(--line-2,#D5CFC2)}

/* منوی کشویی داخلِ نوارِ بالا: باز شدنش نباید چیدمان را هل بدهد،
   پس پنلش شناور است نه در جریانِ صفحه. */
.top > .navdd{flex:0 0 auto;margin:0;position:relative;border-radius:99px}
.top > .navdd > summary{padding:6px 12px;min-height:36px}
.top > .navdd > summary b{font-size:11.5px}
.top > .navdd .ndd{position:absolute;top:calc(100% + 4px);right:0;z-index:20;
  min-width:210px;background:var(--card);border:1px solid var(--line);
  border-radius:10px;box-shadow:var(--shadow)}

/* ---------- مقایسهٔ بازه‌ها ----------
   روند در هر سه سطح — مرکز، مشاور، دانش‌آموز — با همین چند قاعده
   کشیده می‌شود. ستونِ روند پهن‌تر شد چون عددِ کنارِ خط باید خوانا
   بماند؛ خطی که عددش را نشود خواند، تزئین است نه سنجه. */
.tbl{grid-template-columns:1fr 140px 96px 186px 12px}
.tbl .tr{display:contents}
.tbl .tr > span{padding:5px 0;border-bottom:1px solid var(--line)}
.tbl.trn{grid-template-columns:1fr 1fr 1fr}
.tbl.trn .sil small{white-space:nowrap}
@media (max-width:620px){ .tbl{grid-template-columns:1fr 140px 12px} }

/* ستونِ بازهٔ قبل کم‌رنگ است: مرجع است، نه خبر */
.cmp td.dim b{color:var(--muted);font-weight:400}
.cmp td.dim s{opacity:.7}

/* «۹ واحد بیشتر از هفتهٔ پیش» — جهت با رنگ، عدد با وزن */
.kpi s b.up{color:var(--green)}
.kpi s b.dn{color:var(--red)}

/* سرستونِ کارت با نامِ بازه بلندتر شد — عنوان کوتاه می‌شود، لینک نه */
.cell > h3{min-width:0}
.cell > h3 > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cell > h3 a{flex:0 0 auto;white-space:nowrap}

.okline .dot.b{background:var(--brass)}

/* ---------- حلقهٔ ترکیب و نوارِ نمودار ----------
   حلقه فقط جایی می‌آید که یک «کل» واقعی هست و تکه‌هایش کم‌اند؛
   برای مقایسهٔ چند ردیف با هم نوارِ انباشته می‌ماند، نه چند حلقه. */
.chpair{display:grid;gap:10px;grid-template-columns:1fr}
@media (min-width:760px){ .chpair{grid-template-columns:1fr 1fr;align-items:start} }
.chpair > .chart{min-width:0}
.chpair .chart svg{max-width:300px;margin-inline:auto}

.dnut{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.dnut > svg{flex:0 0 auto;width:auto;height:auto;margin:0;max-width:none}
.dnut .lg{flex:1 1 150px;min-width:0;display:flex;flex-direction:column;gap:2px}
.dnut .lg span,.dnut .lg a{font-size:10.5px;color:var(--muted);display:flex;align-items:center;
  gap:5px;line-height:1.5}
.dnut .lg i{flex:0 0 auto;width:8px;height:8px;border-radius:2px}
.dnut .lg b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums;
  margin-inline-start:auto}

/* مرزِ روز — یک خط، همان‌جا که عددها را می‌بینند */
.dayrule{font-size:10.5px;line-height:1.6;color:var(--muted);background:var(--soft);
  border:1px solid var(--line);border-radius:8px;padding:3px 9px;margin-bottom:6px}
.dayrule b{color:var(--navy);font-weight:700}

/* ---------- کیفیت در سطرِ جدول ----------
   همان چیپ‌های کارتِ صفحهٔ گروه، فشرده: هر نوع یک خط، هر تکه با
   عدد و نامِ خودش. رنگ تنها هیچ‌وقت حاملِ معنا نیست. */
.qmini{display:flex;flex-direction:column;gap:2px;padding:1px 0}
.qmini span{display:flex;align-items:center;gap:3px;min-width:0}
.qmini i{font-style:normal;font-size:9.5px;color:var(--muted);flex:0 0 24px}
.qmini b{border-radius:5px;padding:0 5px;font-size:11px;font-weight:700;
  font-variant-numeric:tabular-nums;display:inline-flex;align-items:baseline;gap:3px;
  white-space:nowrap}
.qmini b em{font-style:normal;font-weight:400;font-size:9px;opacity:.85}
.qmini b.g{background:var(--green-bg);color:var(--green)}
.qmini b.b{background:var(--brass-bg);color:var(--brass)}
.qmini b.r{background:var(--red-bg);color:var(--red)}
.qmini b.x{background:var(--soft);color:var(--muted);font-weight:400}
.qmini .qz{font-size:10.5px;color:var(--muted)}

/* ---------- تکه‌های کلیک‌پذیر و فهرستِ پشتشان ----------
   نامِ هر تکهٔ حلقه لینک است به فهرستِ همان — کی و چه روزی.
   بدونِ جاوااسکریپت: یک نشانی، یک لنگر.
   روی موس ۲۲ پیکسل بس است؛ روی لمس نه. هدفِ لمسیِ کوچک را
   pointer:coarse تشخیص می‌دهد، نه حدسِ ما. */
.dnut .lg a{min-height:22px;text-decoration:none;border-radius:6px;
  padding:0 4px;margin:0 -4px}
@media (pointer:coarse),(max-width:899px){ .dnut .lg a{min-height:36px} }
.dnut .lg a:hover{background:var(--soft);color:var(--navy)}
.dnut .lg a:hover i{outline:2px solid var(--line);outline-offset:1px}

/* کاشیِ کلیک‌پذیر — همان کاشی، فقط رفتنی */
a.kpi{text-decoration:none;color:inherit;display:block}
a.kpi:hover{background:var(--soft);border-color:var(--navy)}

/* فهرستِ رده: نفر · روز · اندازه */
.tbl.kl{grid-template-columns:1fr 1fr 170px}
#kk{scroll-margin-top:10px}
/* در موبایل هیچ ستونی حذف نمی‌شود — هر سه چیزی می‌گویند که کار
   با آن شروع می‌شود. فقط تنگ‌تر، و نامِ بلند سه‌نقطه می‌خورد. */
.tbl.kl .nm2{min-width:0}
.tbl.kl .nm2 b,.tbl.kl .nm2 s{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:620px){
  .tbl.kl{grid-template-columns:1fr 1fr 86px;column-gap:6px}
  .tbl.kl .nm2 b{font-size:12px}
}

/* ---------- خانهٔ روز ----------
   واژه به‌جای نشانه، و هر نوعِ پیام با بلند و کوتاهِ خودش. ریز است
   و اشکالی ندارد: این نوار برای «کدام روز را باز کنم» است، ولی
   دیگر برای فهمیدنش لازم نیست کسی رنگ حفظ کند. */
.bwk.wide{align-items:stretch}
.bwk.wide .bwd{gap:0;padding:0;overflow:hidden;justify-content:flex-start}
.bwk.wide .bwd i{font-size:11.5px;font-weight:700;color:var(--navy);
  padding:5px 4px 4px;width:100%;text-align:center;border-bottom:1px solid var(--line)}
.bwk.wide .bwd.fut i{color:var(--muted);font-weight:400}
.bwk.wide .bwd .sd{width:100%;padding:4px;display:flex;flex-direction:column;gap:2px}
.bwk.wide .bwd .sd + .sd{border-top:1px solid var(--line);background:var(--soft)}
.bwk.wide .bwd em{font-style:normal;font-size:9.5px;font-weight:700;line-height:1.5;
  display:block;text-align:center;border-radius:5px;padding:1px 2px}
.bwk.wide .bwd em.g{background:var(--green-bg);color:var(--green)}
.bwk.wide .bwd em.b{background:var(--brass-bg);color:var(--brass)}
.bwk.wide .bwd em.r{background:var(--red);color:#fff}
.bwk.wide .bwd em.x{background:transparent;color:var(--muted);font-weight:400}
.bwk.wide .bwd em.z{color:var(--line);font-weight:400;padding:8px 2px}
.bwk.wide .bwd .sd span{display:flex;align-items:center;gap:3px;flex-wrap:wrap;
  justify-content:flex-start}
.bwk.wide .bwd .sd span b{font-size:8.5px;font-weight:400;color:var(--muted);
  flex:0 0 20px;text-align:right}
.bwk.wide .bwd .sd u{text-decoration:none;font-size:8.5px;line-height:1.6;font-weight:700;
  border-radius:4px;padding:0 3px;font-variant-numeric:tabular-nums;white-space:nowrap}
.bwk.wide .bwd .sd u.g{background:var(--green-bg);color:var(--green)}
.bwk.wide .bwd .sd u.b{background:var(--brass-bg);color:var(--brass)}
.bwk.wide .bwd .sd u.r{background:var(--red-bg);color:var(--red)}
.bwk.wide .bwd .sd u.x{background:var(--card);color:var(--muted);
  box-shadow:inset 0 0 0 1px var(--line)}
.leg b{color:var(--navy);font-weight:700}

/* در گوشی هفت ستون جا نمی‌شود — نوار افقی می‌شود و می‌لغزد،
   چون حذفِ روز یعنی حذفِ خبر. */
@media (max-width:820px){
  .bwk.wide{display:flex;overflow-x:auto;gap:5px;padding-bottom:4px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .bwk.wide .bwd{flex:0 0 132px;scroll-snap-align:start}
}

/* در گوشی هفت ستون جا نمی‌شود — نوار افقی می‌شود و می‌لغزد،
   چون حذفِ روز یعنی حذفِ خبر. */
@media (max-width:700px){
  .bwk.wide{display:flex;overflow-x:auto;gap:5px;padding-bottom:4px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .bwk.wide .bwd{flex:0 0 124px;scroll-snap-align:start}
}

/* «اتمام» رنگِ خودش را دارد — نه قرمزِ خروج، نه سبزِ جاری.
   دوره تمام شده و این نه شکست است نه ادامه. */
.s-done{background:var(--blue-bg);color:var(--blue)}

/* ---------- انتخابگرِ مرحله ----------
   سه وضعیتِ اصلی، هرکدام با توضیح و زیرمرحله‌های اختیاری.
   بی‌جاواسکریپت کار می‌کند: رادیوی پنهان و برچسبِ کلیک‌پذیر. */
.stg{display:flex;flex-direction:column;gap:8px;margin:4px 0 10px}
.stg-g{border:1px solid var(--line);border-radius:12px;padding:9px 11px;background:var(--card)}
.stg-g.on{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.stg-m{display:block;cursor:pointer;min-height:40px}
.stg-m input{position:absolute;opacity:0;pointer-events:none}
.stg-m b{font-size:14.5px;font-weight:700;color:var(--navy);display:block}
.stg-m s{text-decoration:none;font-size:11.5px;color:var(--muted);display:block;line-height:1.7}
.stg-g:has(.stg-m input:checked) .stg-m b::after{content:' ✓';color:var(--green)}
.stg-s{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px;
  padding-top:7px;border-top:1px solid var(--line)}
.stg-s .tp{flex:0 1 auto;min-height:40px;display:flex;flex-direction:column;
  justify-content:center;padding:5px 11px;border:1px solid var(--line);
  border-radius:10px;cursor:pointer;background:var(--paper);font-size:13px}
.stg-s .tp input{position:absolute;opacity:0;pointer-events:none}
.stg-s .tp small{display:block;font-size:10px;color:var(--muted);font-weight:400;margin-top:1px}
.stg-s .tp:has(input:checked),.stg-s .tp.picked{background:var(--navy);border-color:var(--navy);color:#fff}
.stg-s .tp:has(input:checked) small,.stg-s .tp.picked small{color:rgba(255,255,255,.82)}
@media (max-width:520px){ .stg-s .tp{flex:1 1 100%} }

/* ---------- نمای کاملِ گفتگو ----------
   فشرده مثل تلگرام: پیام‌های پشتِ سرِ هم یک دسته می‌شوند و نام
   یک بار بالای دسته می‌آید، نه روی هر حباب. ساعت و برچسبِ کیفیت
   داخلِ همان خطِ آخر می‌نشینند نه در سطرِ جدا.

   و لایه‌ای که تلگرام ندارد: فاصلهٔ تا جواب، و روزی که بی‌جواب
   ماند — بین حباب‌ها، چون معنایشان به همان لحظه بند است. */
.tbl.tlk{grid-template-columns:1fr 90px 90px 140px 12px}
@media (max-width:620px){ .tbl.tlk{grid-template-columns:1fr 80px 12px} }
.warnx{color:var(--red);font-style:normal}
/* خلاصهٔ نظارتی — یک خط، نه سه کاشی */
.tksum{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;
  font-size:12px;color:var(--muted);padding:5px 12px;margin-bottom:7px;
  background:var(--card);border:1px solid var(--line);border-radius:10px}
.tksum b{color:var(--navy);font-weight:700;font-variant-numeric:tabular-nums}
.tksum .r,.tksum .r b{color:var(--red)}
.tkcard{padding-top:6px}

.tk{display:flex;flex-direction:column;gap:2px}
.tkday{position:sticky;top:0;z-index:2;align-self:center;margin:10px 0 4px;
  font-size:11px;font-weight:700;color:var(--muted);background:var(--paper);
  border:1px solid var(--line);border-radius:99px;padding:2px 12px}
.tkrun{display:flex;flex-direction:column;gap:2px;max-width:min(76%,600px)}
.tkrun.stu{align-self:flex-start}
.tkrun.con{align-self:flex-end}
.tkrun.oth{align-self:center;max-width:min(58%,420px);opacity:.75}
.tkwho{font-size:10.5px;font-weight:700;color:var(--muted);padding:0 6px;margin-bottom:1px}

.tkb{background:var(--card);border:1px solid var(--line);border-radius:13px;
  padding:4px 9px 3px;font-size:13.5px;line-height:1.75;word-break:break-word}
.tkrun.stu .tkb{border-bottom-right-radius:5px}
.tkrun.con .tkb{background:var(--blue-bg);border-color:transparent;
  border-bottom-left-radius:5px}
.tkrun.oth .tkb{background:var(--soft)}
/* گوشهٔ تیز فقط روی آخرینِ دسته — همان دُمِ تلگرام */
.tkrun.stu .tkb:not(:last-child){border-bottom-right-radius:13px}
.tkrun.con .tkb:not(:last-child){border-bottom-left-radius:13px}

.tkt{white-space:pre-wrap}
/* ویس/فیلمِ رونویسی‌شده — نشانه و متن، جای فایلِ پاک‌شده (۶ مهر ۱۴۰۵) */
.tksay{display:block;white-space:pre-wrap;background:var(--soft);border-inline-start:3px solid var(--line2);
  border-radius:8px;padding:6px 9px;margin:3px 0}
.tksay b{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:2px}
/* ساعت و برچسب، همان خط: جای عمودی هدر نمی‌رود */
.tkm{float:left;font-style:normal;font-size:10px;color:var(--muted);
  margin:3px 0 0 0;padding-inline-start:8px;white-space:nowrap;
  font-variant-numeric:tabular-nums;line-height:1.9}
.tkm u{text-decoration:none;border-radius:4px;padding:0 4px;margin-inline-end:4px;
  font-size:9.5px;font-weight:700}
.tkm u.b{background:var(--brass-bg);color:var(--brass)}
.tkm u.r{background:var(--red-bg);color:var(--red)}
.tkm u.x{background:var(--soft);color:var(--muted);font-weight:400}
.tkb::after{content:'';display:block;clear:both}
.tkwait{font-style:normal;font-size:11.5px;color:var(--muted)}

.tkb audio{width:100%;max-width:290px;height:38px;margin:2px 0 1px;display:block}
.tkimg{max-width:100%;max-height:300px;border-radius:9px;margin:2px 0 1px;display:block}
.tkfile{display:inline-flex;align-items:center;gap:5px;min-height:34px;
  text-decoration:none;color:var(--navy);font-weight:700}

/* آنچه تلگرام نمی‌گوید */
.tkgap{align-self:center;font-size:10px;color:var(--muted);margin:4px 0;
  padding:1px 10px;border-radius:99px;background:var(--soft)}
.tkno{align-self:center;font-size:10.5px;font-weight:700;color:var(--red);
  background:var(--red-bg);border-radius:99px;padding:2px 12px;margin:4px 0 6px}

@media (max-width:620px){
  .tkrun{max-width:88%}
  .tkrun.oth{max-width:80%}
}

/* سرستون‌های سه‌سطحیِ فهرست — سرمشاور، مشاور، دانش‌آموز */
.tkh1,.tkh2{grid-column:1/-1}
.tkh1{font-size:12px;font-weight:700;color:var(--navy);background:var(--soft);
  border-radius:8px;padding:5px 11px;margin:11px 0 2px}
.tkh1:first-child{margin-top:2px}
.tkh2{font-size:11px;color:var(--muted);padding:4px 11px 2px}
.tkh2{display:flex;align-items:baseline;gap:10px}
.tkh2>span::before{content:'↳ ';opacity:.6}
/* لینکِ گزارش **بغلِ** نام می‌ماند، نه آن‌سرِ جدول: با
   margin-inline-start:auto روی صفحهٔ عریض یک وجب از نام فاصله
   می‌گرفت و معلوم نبود مالِ کدام مشاور است. */
.tkrep{font-size:11px;color:var(--acc);text-decoration:none;
  white-space:nowrap;opacity:.8;border-bottom:1px dotted currentColor}
.tkrep:hover{opacity:1}

/* خطِ نخوانده — مقصدِ پرشِ خودکار.
   scroll-margin تا زیرِ نوارِ چسبانِ روز پنهان نشود. */
.tknew{align-self:stretch;text-align:center;font-size:11px;font-weight:700;
  color:var(--red);margin:9px 0 5px;scroll-margin-top:70px;
  border-top:1px solid var(--red);padding-top:6px;position:relative}
.tknew::after{content:'';display:block}
#unread:empty{height:1px;scroll-margin-top:400px}


/* ============================================================
   داشبورد — کاشیِ انتخاب‌شدنی، حلقهٔ با مخرج، میلهٔ چهارتکه.
   یک زبان برای مرکز و برای هر مشاور.
   ============================================================ */
.dscope{display:flex;gap:5px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.dscope a{font-size:12px;padding:3px 11px;border-radius:20px;text-decoration:none;
  border:1px solid var(--line);background:var(--soft);color:var(--muted)}
.dscope a.on{background:var(--navy);border-color:var(--navy);color:#fff}
.dscope a small{opacity:.65;font-size:11px}
.dscope .sep{color:#C9C2B4}

.dalert{background:var(--red-bg);border:1px solid #EFCFC9;border-radius:9px;
  padding:5px 10px;font-size:12.5px;line-height:1.7;margin-bottom:9px}
.dalert b{color:var(--red)}
.dalert.ok{background:var(--green-bg);border-color:#CFE4D6}
.dalert.ok b{color:var(--green)}

/* کاشی: عدد و توضیحش کنارِ هم، نه روی هم — یک ردیف عمودی کم
   می‌شود و نشانِ تغییر روی رقم‌ها نمی‌افتد. */
.dkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:10px}
.dkpi{display:block;text-decoration:none;color:inherit;background:var(--soft);
  border:1.5px solid var(--line);border-radius:11px;padding:7px 10px}
.dkpi:hover{border-color:#CFC7B6}
.dkpi.on{background:var(--navy);border-color:var(--navy);color:#fff}
.dkpi.on .dkl,.dkpi.on .dkd{color:#B9C9D8}
.dkpi.on u.r{color:#F0A79C}
.dkrow{display:flex;align-items:center;gap:9px}
.dkpi u{font-size:25px;font-weight:700;text-decoration:none;line-height:1.15;
  flex:0 0 auto;font-variant-numeric:tabular-nums}
.dkpi u.r{color:var(--red)}
.dktx{flex:1 1 auto;min-width:0}
.dkl{display:block;font-size:12px;color:var(--muted);line-height:1.45}
.dkd{display:block;font-size:10.5px;color:var(--muted);line-height:1.45}
.dkv{flex:0 0 auto;font-size:11px;font-weight:700}
.dkv.up{color:var(--green)} .dkv.dn{color:var(--red)}
.dkpi.on .dkv.up{color:#8FD3AC} .dkpi.on .dkv.dn{color:#F0A79C}
.dspk{margin-top:5px;display:block;width:100%;height:20px}

.drings{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:9px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  margin-bottom:10px}
.dring{text-align:center}
.dring figcaption{font-size:11.5px;margin-top:2px;line-height:1.45}
.dring small{display:block;font-size:10.5px;color:var(--muted)}
.dring small.w{color:var(--brass)}
.drn{font-size:17px;font-weight:700;fill:var(--ink);font-variant-numeric:tabular-nums}

.dleg{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--muted);
  margin-bottom:4px}
.dleg i{display:inline-block;width:10px;height:10px;border-radius:2px;
  vertical-align:-1px;margin-inline-end:4px}
.dleg .e{margin-inline-start:auto}
.dchart{width:100%;height:auto;display:block;margin-bottom:12px}
.dchart text.dax{font-size:9.5px;fill:var(--muted)}
.dchart text.dax.mo{fill:var(--navy);font-weight:700}
.dchart text.dvy{font-size:9.5px;fill:var(--muted)}
.dchart text.dvy.cap{fill:var(--navy);font-weight:700}

.dtbl{grid-template-columns:1fr auto auto auto auto auto 14px}
.dtbl .n{text-align:center;font-variant-numeric:tabular-nums}
.dtbl .bad{color:var(--red);font-weight:700}
.qbar{display:flex;height:7px;border-radius:4px;overflow:hidden;min-width:70px}
.qbar i{display:block}

@media (max-width:760px){
  .dkpis{grid-template-columns:repeat(2,1fr)}
  .drings{grid-template-columns:repeat(3,1fr);row-gap:12px}
}
/* ---------- کاشی روی گوشی ----------
   `.dkrow` ردیفی است: عدد (`flex:0 0 auto`، ۲۵ پیکسل) و کنارش
   برچسب. روی ۳۷۵ پیکسل عددِ «۲۸:۴۴ ساعت» ۱۳۴ از ۱۶۸ پیکسلِ خانه را
   می‌گرفت و برچسب **۳ پیکسل** پهنا داشت — یعنی یک حرف در هر خط، و
   کاشی ۴۰۶ پیکسل بلند. چهار کاشی می‌شد ۵۱۸ پیکسل از نمای اول.

   حالا زیر ۴۲۰ پیکسل عدد بالا می‌نشیند و برچسب زیرش، تمام‌عرض. */
@media (max-width:420px){
  .dkrow{flex-wrap:wrap;gap:2px 9px}
  .dktx{flex:1 1 100%}
  .dkpi u{font-size:21px}
}

/* جعبهٔ عددِ نمودار — فقط وقتی جاوا هست؛ بی آن، <title> خودِ
   مرورگر همان را می‌گوید (کندتر و بی‌شکل، ولی می‌گوید). */
.dtip{position:absolute;z-index:60;background:var(--navy);color:#fff;
  border-radius:8px;padding:6px 10px;font-size:11.5px;line-height:1.85;
  pointer-events:none;opacity:0;transition:opacity .12s;white-space:nowrap;
  transform:translateY(-100%);box-shadow:0 4px 14px rgba(27,58,87,.25)}
.dtip.on{opacity:1}
.dtip u{display:block;text-decoration:none;font-weight:700;font-size:12.5px;
  margin-bottom:2px}
#dashbox.wait{opacity:.55;transition:opacity .12s}
.dtbl .th.sortme{cursor:pointer;user-select:none}
.dtbl .th.sortme::after{content:' ⇅';opacity:.35}
.dtbl .th.sorted::after{content:' ▾';opacity:1;color:var(--navy)}
.dtbl .th.sorted.up::after{content:' ▴'}

/* نوارِ نما — جای منوی کشویی. همیشه دیده می‌شود، چون فهرستش
   کوتاه است و کشویی فقط یک چیزِ شکستنیِ اضافه بود. */
.navrow{display:flex;gap:5px;flex-wrap:wrap;align-items:center;
  flex:1 1 100%;order:-1;margin-bottom:2px}
.navrow a{font-size:11.5px;padding:3px 11px;border-radius:20px;text-decoration:none;
  border:1px solid var(--line);background:var(--soft);color:var(--muted)}
.navrow a:hover{border-color:#CFC7B6}
.navrow a.on{background:var(--navy);border-color:var(--navy);color:#fff}
.navrow .sep{font-size:11px;color:var(--muted);opacity:.7;margin-inline-start:4px}

/* ============================================================
   نوارِ روز — یک مربع برای هر روز، همان چهار رنگِ داشبورد.
   در سطحِ یک گروه یا یک بچه، میلهٔ چهارتکه معنا ندارد: هر روز
   فقط یک حالت دارد. شکل عوض می‌شود، زبان نه.
   ============================================================ */
.tstrip{display:flex;gap:3px;flex-wrap:wrap;margin:2px 0 8px}
.tsd{width:26px;text-align:center;text-decoration:none;color:inherit}
.tsd i{display:block;height:26px;border-radius:6px;position:relative}
.tsd u{display:block;font-size:9px;color:var(--muted);text-decoration:none;margin-top:2px}
.tsd i.seen{background:#1B3A57}
.tsd i.nak{background:#B3372B}
.tsd i.fu{background:#7FA8C9}
.tsd i.sil{background:#EFEBE3;border:1px solid #E3DED4}
.tsd i b{position:absolute;inset:0;display:flex;align-items:center;
  justify-content:center;font-size:9px;color:#fff;opacity:.85;font-weight:400}
.tsd i.sil b{color:var(--muted)}
a.tsd:hover i{outline:2px solid var(--navy);outline-offset:1px}
.tslg{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--muted);
  margin-bottom:8px}
.tslg i{display:inline-block;width:10px;height:10px;border-radius:3px;
  vertical-align:-1px;margin-inline-end:4px}
.tmini{display:flex;gap:2px}
.tmini i{width:7px;height:15px;border-radius:2px;display:block}
.tmini i.seen{background:#1B3A57}
.tmini i.nak{background:#B3372B}
.tmini i.fu{background:#7FA8C9}
.tmini i.sil{background:#EFEBE3;border:1px solid #E3DED4}

/* داشبوردِ یک گروه — بالای گفتگو، نه به‌جایش */
.gcard{padding:11px 12px;margin-bottom:6px}
.gmk{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:10px}
.gmk div{background:var(--soft);border:1px solid var(--line);border-radius:11px;
  padding:7px 10px}
.gmk u{display:block;font-size:20px;font-weight:700;text-decoration:none;
  line-height:1.2;font-variant-numeric:tabular-nums}
.gmk u.r{color:var(--red)}
.gmk s{display:block;text-decoration:none;font-size:11px;color:var(--muted);
  line-height:1.5}
.gmk s em{font-style:normal;font-size:10px;display:block}
.gtwo{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:4px}
.gtwo > div{background:var(--soft);border:1px solid var(--line);border-radius:11px;
  padding:8px 10px}
.gtwo h4{font-size:11.5px;color:var(--muted);font-weight:700;margin-bottom:5px}
.gqr{display:flex;align-items:center;gap:6px;font-size:12px;margin-bottom:3px}
.gqr i{width:9px;height:9px;border-radius:2px;flex:0 0 auto}
.gqr b{margin-inline-start:auto;font-variant-numeric:tabular-nums}
.gqr s{text-decoration:none;font-size:10.5px;color:var(--muted);width:34px;
  text-align:left;font-variant-numeric:tabular-nums}
.gqb{display:flex;height:8px;border-radius:4px;overflow:hidden;margin-top:6px}
.gqb i{display:block}
.gwarn{margin-top:7px;font-size:11px;color:var(--brass);line-height:1.6}
@media (max-width:640px){.gmk{grid-template-columns:repeat(2,1fr)}
  .gtwo{grid-template-columns:1fr}}

/* نوارِ ماه در گفتگو — شمارِ پیام نشانِ جدای خودش را دارد، وگرنه
   «شهریور ۱۴۰۵ ۵۶» سه عددِ پشتِ سرِ هم می‌شود. */
.gchip i{font-style:normal;display:inline-block;margin-inline-start:6px;
  padding:1px 7px;border-radius:20px;font-size:11px;line-height:1.6;
  background:var(--slate-bg);color:var(--muted);font-variant-numeric:tabular-nums}
.gchip.on i{background:rgba(255,255,255,.18);color:#fff}
.gchip s{text-decoration:none;font-size:11px;color:var(--muted);
  margin-inline-start:4px}
.gchip.on s{color:#B9C9D8}

/* ---------- حرفِ قاضی در جدول ----------
   قضاوت تا امروز فقط یک کارت بالای صفحه بود. مدیری که می‌خواهد
   بداند سراغِ کی برود، باید حرف را کنارِ نامِ همان آدم ببیند —
   نه در یک جملهٔ کلی که نمی‌گوید کدام. */
.dtbl .jsay{grid-column:1/-1;font-size:12px;color:var(--muted);
  padding:0 0 7px 0;margin-top:-3px;display:flex;gap:6px;
  align-items:baseline;flex-wrap:wrap;line-height:1.6}
.dtbl .jsay.red{color:var(--ink)}
.dtbl .jsay.none{opacity:.5;font-style:italic}
.dtbl .jsay .x{opacity:.7}
/* نقطهٔ رنگ کنارِ نام: پیش از خواندنِ جمله هم رنگ دیده می‌شود، و
   در فهرستِ بیست‌تایی همان رنگ است که چشم را می‌برد. */
/* نام در این جدول <b>ِ بلوکی است؛ بی این دو خط، نقطه به سطر
   بعد می‌افتد و مثلِ خطای چیدمان دیده می‌شود. */
.dtbl .nm2{display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.dtbl .nm2 b{display:inline}
.jdot{display:inline-block;width:7px;height:7px;border-radius:50%;
  margin-inline-start:5px;vertical-align:middle;background:var(--muted)}
.jdot.green{background:var(--green)} .jdot.brass{background:var(--brass)}
.jdot.red{background:var(--red)}

/* سرِ جدول: نام و قرص‌های بازه در یک خط. قرص‌ها اینجایند نه بالای
   صفحه، چون وقتی جدول را می‌خوانی نباید تا بالا برگردی. */
.tblhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  justify-content:space-between}
.per.sm{display:flex;gap:4px}
.per.sm a{font-size:11.5px;padding:3px 9px;border-radius:999px;
  border:1px solid var(--line);color:var(--muted);text-decoration:none}
.per.sm a.on{background:var(--navy);border-color:var(--navy);color:#fff}

/* ---------- گفتگو، روزبه‌روز ----------
   یک ماه پیام در یک ستونِ پیوسته یعنی غرق‌شدن. هر روز حالا یک
   کشوست؛ `<details>`ِ خودِ مرورگر، پس بی جاوا هم باز و بسته
   می‌شود و جاوا فقط یادش می‌ماند کدام باز بود.

   باز می‌آید: تازه‌ترین روز، روزی که قاضی قرمز کرده، و روزی که
   بچه گزارش داده و جواب نگرفته. یعنی هرچه آدم برایش آمده از
   اول جلوی چشم است. */
.tkd{border:1px solid var(--line);border-radius:10px;margin:8px 0;
  background:var(--card,#fff);overflow:hidden}
.tkd.no{border-inline-start:3px solid var(--red)}
.tkd > summary.tkday{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  cursor:pointer;user-select:none;padding:8px 11px;margin:0;
  background:transparent;font-size:12.5px;list-style:none}
.tkd > summary.tkday::-webkit-details-marker{display:none}
.tkd > summary.tkday::before{content:'›';opacity:.5;transition:transform .15s;
  display:inline-block}
.tkd[open] > summary.tkday::before{transform:rotate(-90deg)}
.tkd > summary.tkday:hover{background:var(--hover,rgba(0,0,0,.03))}
.tkd .tkn{color:var(--muted);font-size:11px}
/* جملهٔ قاضی روی درِ بسته کوتاه می‌شود — سرِ کشو نباید دو خط شود */
.tkd .tkjs{font-style:normal;color:var(--muted);font-size:11.5px;
  flex:1 1 200px;min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.tkd[open] .tkjs{white-space:normal;overflow:visible}
.tkin{padding:2px 11px 10px}

/* ---------- عمقِ قضاوتِ j3 ----------
   رنگ سقف است، متن زیرِ سقف: فهرست فقط رنگ و یک خط را نشان
   می‌دهد و این‌ها با بازکردنِ ردیف می‌آیند. */
.jcrits{display:inline-flex;gap:4px;flex-wrap:wrap;margin:4px 0}
.jcrit{font-style:normal;font-size:10.5px;padding:2px 8px;border-radius:999px;
  background:var(--line);color:var(--muted)}
.jcrit.green{background:var(--green);color:#fff}
.jcrit.brass{background:var(--brass);color:#fff}
.jcrit.red{background:var(--red);color:#fff}
/* `na` — «چیزی برای سنجیدن نبود». عمداً **توخالی** است نه توپُر:
   سه رنگِ پُر یعنی حکم، و این حکم نیست. تا ۲۸ شهریور ۱۴۰۵ این حالت
   اصلاً وجود نداشت و به سبز ترجمه می‌شد؛ روزی که مشاور هیچ نگفته
   بود سه چیپش سبز درمی‌آمد. */
.jcrit.gray{background:transparent;color:var(--muted);
            box-shadow:inset 0 0 0 1px var(--line2)}
.jparts{margin:6px 0 2px}
.jpart{padding:5px 10px;border-inline-start:3px solid var(--line);
  margin:4px 0;font-size:13px;line-height:1.8}
.jpart b{display:inline-block;min-width:5.5em;color:var(--muted);font-size:11.5px}
.jpred{padding:5px 10px;border-inline-start:3px solid var(--brass);
  margin:4px 0;font-size:12.5px;line-height:1.8;border-radius:0 6px 6px 0}

/* ---------- سبکِ دستور، و رأیِ آدم روی قضاوتِ ماشین ----------
   سبک کوچک و خاموش است: وقتی معیارها عوض می‌شوند باید معلوم باشد
   این قضاوت با کدام قاعده نوشته شده، ولی نباید جلوی خودِ قضاوت را
   بگیرد. */
.jstyle{font-size:10px;padding:1px 7px;border-radius:999px;
  background:var(--line);color:var(--muted);margin-inline-end:6px}
.jvote{display:flex;gap:6px;align-items:center;flex-wrap:wrap;
  margin:8px 0 2px;font-size:12px}
.jvote .lbl{color:var(--muted);font-size:11.5px}
.jvote button{font-size:12px;padding:3px 12px;border-radius:999px;
  border:1px solid var(--line);background:var(--card);color:var(--ink);
  cursor:pointer}
.jvote button:hover{border-color:var(--muted)}
.jvote button.on.right{background:var(--green);border-color:var(--green);color:#fff}
.jvote button.on.wrong{background:var(--red);border-color:var(--red);color:#fff}
.jvote input[type=text]{flex:1;min-width:10em;font-size:12px;padding:3px 8px;
  border:1px solid var(--line);border-radius:6px;background:var(--card);
  color:var(--ink)}
.jvote .said{color:var(--muted);font-size:11.5px}

/* ---------- سطرهای چهارپله — به زبانِ rasad4 ----------
   هر فرزند (مشاور در پلهٔ ۱، گروه در پلهٔ ۲) یک سطرِ کارت‌مانند
   با چهار طبقه: نقطهٔ رنگِ قاضی + نام + وضعیت · جملهٔ قاضی ·
   عددهای شورا · چیپ‌ها. جدولِ ستونی جملهٔ قاضی را جا نمی‌داد. */
.jrows{display:flex;flex-direction:column;gap:9px;margin-top:4px}
.jrow{display:block;background:var(--card,#fff);border:1px solid var(--line);
  border-radius:14px;padding:11px 14px;text-decoration:none;color:var(--ink);
  transition:background .12s}
.jrow:hover{background:var(--hover,rgba(0,0,0,.03))}
.jrow .top{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.jrow .nm{font-weight:800;color:var(--navy);font-size:14px}
.jrow .gr{color:var(--muted);font-size:12px;margin-inline-start:auto;
  font-variant-numeric:tabular-nums}
.jrow .jd{display:block;font-size:13px;margin-top:3px;line-height:1.75}
.jrow .jd b{color:var(--muted);font-weight:500;font-size:12px}
.jrow .jd.none{color:var(--muted);opacity:.6;font-style:italic}
/* عددهای شورا — قلبِ سطر */
.jrow .nums{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:7px;
  padding-top:7px;border-top:1px dashed var(--line)}
.jrow .nums span{font-size:12px;color:var(--muted)}
.jrow .nums b{font-size:15px;font-weight:800;color:var(--navy);
  font-variant-numeric:tabular-nums;margin-inline-start:4px}
.jrow .nums b.r{color:var(--red)} .jrow .nums b.w{color:var(--brass)}
.jrow .nums b.g{color:var(--green)}

/* ---------- نوارِ روزهای عددی (پلهٔ گروه) ----------
   هر مربع یک روز: عدد = پیام‌ها، رنگ = وضعیت. کلیک = پریدن به
   کشوی همان روز — لنگرِ ساده، بی‌جاوا هم کار می‌کند. رنگ‌ها همان
   چهاروضعیتیِ نمودارِ داشبورد. */
.ribx .rb{display:flex;gap:5px;flex-wrap:wrap;direction:ltr;
  justify-content:flex-end;margin-top:4px}
.ribx .d{min-width:36px;height:38px;border-radius:9px;display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:1px;
  font-size:13px;font-weight:800;line-height:1;text-decoration:none;
  font-variant-numeric:tabular-nums;transition:transform .1s}
.ribx .d:hover{transform:translateY(-2px)}
.ribx .d small{font-size:9px;font-weight:500;opacity:.85}
.ribx .d.s1{background:#24365B;color:#fff}
.ribx .d.s2{background:#A73F2E;color:#fff}
.ribx .d.s3{background:#9FB6D9;color:#24365B}
.ribx .d.s4{background:#EDE9E2;color:var(--muted);font-weight:500}

/* چیپ‌های سطرِ چهارپله — فاکتورهای بازه: رنگ‌شمارِ قاضی، معیارِ
   لنگیده، پیش‌بینیِ باز. همان زبانِ chips نمونه. */
.jchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.jchip{font-style:normal;font-size:11.5px;border-radius:99px;padding:2px 11px;
  background:var(--soft,#faf8f4);border:1px solid var(--line);color:var(--ink)}
.jchip.w{background:var(--brass-bg,#f7efd8);color:var(--brass);border-color:transparent}
.jchip.r{background:var(--red-bg,#f9e7e3);color:var(--red);border-color:transparent}

/* نوارِ باکس‌های رنگی در سطرِ چهارپله — همان زبانِ tmini،
   فقط جا و اندازه. با یک نگاه: قرمز = بی‌جواب ماند. */
.jrow .jstrip{display:block;margin-top:7px;direction:ltr;text-align:left}
.jrow .jstrip .tmini i{width:12px;height:12px;border-radius:3px}

/* ============================================================
   وصل‌ها — ۲۸ شهریور ۱۴۰۵
   ============================================================ */
table.lktbl{width:100%;border-collapse:collapse;font-size:12.5px;min-width:620px}
table.lktbl th{font-size:10.5px;color:var(--muted);font-weight:700;text-align:start;
  padding:6px 8px;border-bottom:1px solid var(--line)}
table.lktbl td{padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
table.lktbl tr:last-child td{border-bottom:0}
table.lktbl td.lk-n{min-width:170px}
table.lktbl td.lk-n a{font-weight:700;color:var(--ink);text-decoration:none}
table.lktbl td.lk-n s,table.lktbl td.lk-c s{display:block;text-decoration:none;
  font-size:10px;color:var(--muted);margin-top:2px}
table.lktbl td.lk-n s.warn{color:var(--red);font-weight:700}
table.lktbl td.lk-c{width:190px}
table.lktbl td.lk-c.dim{opacity:.25}
table.lktbl td.lk-c .btn{margin:4px 4px 0 0}
/* پیوندِ یک‌ضربه‌ای: دیده شود و کپی‌کردنی باشد — کسی که می‌خواهد
   برای خانواده بفرستد، همین را برمی‌دارد. */
.lk-go{display:block;margin-top:4px;font-size:10px;color:var(--navy);
  word-break:break-all;text-decoration:none;border-bottom:1px dashed var(--navy)}
@media (max-width:760px){
  table.lktbl{min-width:0}
  table.lktbl thead{display:none}
  table.lktbl,table.lktbl tbody,table.lktbl tr,table.lktbl td{display:block;width:auto}
  table.lktbl tr{border:1px solid var(--line);border-radius:12px;padding:8px 10px;
    margin-bottom:8px;background:var(--card)}
  table.lktbl td{border:0;padding:4px 0}
  table.lktbl td.lk-c{width:auto}
  table.lktbl td.lk-c::before{content:attr(data-lb);display:block;font-size:9.5px;
    color:var(--muted);font-weight:700;margin-bottom:2px}
}

/* قطعِ اتصالِ سالم — یک پله تأیید، بی جاوااسکریپت.
   در جدولی با ده‌ها سطر و سه خانه، خطای لمس محتمل است و برگشتش
   ارزان نیست: کد ساختن یک کلیک است، ولی وصل شدن کارِ آن نفر است. */
.dq{display:inline-block;margin:4px 4px 0 0}
.dq > summary{list-style:none;cursor:pointer;font-size:10.5px;font-weight:700;
  color:var(--red);border:1px solid var(--red);border-radius:99px;padding:2px 9px}
.dq > summary::-webkit-details-marker{display:none}
.dq[open] > summary{background:var(--red);color:#fff}
.dq > div{margin-top:5px;padding:7px 9px;border:1px solid var(--red);
  border-radius:10px;background:var(--paper)}
.dq > div > s{display:block;text-decoration:none;font-size:10px;
  color:var(--muted);margin-bottom:5px}

/* ---------- دو کلیدِ پیامِ شبانه (groups.php) ----------
   `gsw` نه `sw`: `.sw` در app.css از قبل هست و `display:flex` است. */
.gswd > summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--ink);padding:10px 2px;min-height:40px}
.gswd > summary b{color:var(--red)}
.gswd[open] > summary{margin-bottom:8px}
.gswbox{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  margin-bottom:14px}
.gsw{display:block;padding:11px 13px;border:1px solid var(--line);
  border-radius:12px;background:var(--paper)}
.gsw.off{border-style:dashed;background:var(--slate-bg)}
.gsw-t{font-size:13px;font-weight:700;display:flex;align-items:center;
  gap:7px;margin-bottom:4px}
.gsw > s{display:block;text-decoration:none;font-size:11.5px;
  color:var(--muted);line-height:1.7;margin-bottom:8px}