/* chat-tools-face.css — S4-ب «همهٔ ابزارها» (docs/CHAT_MOBILE_TUTOR_POLISH.md §8-ج)
 *
 * The ONE owner of: the tool face (glyph + colour family) on every surface,
 * the phone band's door / chips / teacher index, and the phone panel's
 * audience cards, tool cards and level control. Loaded after
 * chat-mode-surfaces.css and chat-workbench.css, so it wins by order at the
 * same specificity; it never uses !important except where those two files do.
 *
 * Colour families (chat-workspace.js TOOL_FACE decides which tool is which):
 *   learn green · practice amber · plan blue · teach indigo · class teal ·
 *   keep slate · other slate. Night is the default theme; day overrides.
 */

:root {
  --ntf-learn: #4ade80;   --ntf-learn-bg: rgba(74, 222, 128, 0.14);
  --ntf-practice: #fbbf24; --ntf-practice-bg: rgba(251, 191, 36, 0.14);
  --ntf-plan: #93c5fd;    --ntf-plan-bg: rgba(147, 197, 253, 0.15);
  --ntf-teach: #a5b4fc;   --ntf-teach-bg: rgba(165, 180, 252, 0.16);
  --ntf-class: #5eead4;   --ntf-class-bg: rgba(94, 234, 212, 0.14);
  --ntf-keep: #cbd5e1;    --ntf-keep-bg: rgba(203, 213, 225, 0.12);
  --ntf-door: #15803d;    --ntf-door-ink: #ffffff;
  --ntf-sub: #9aa7b8;
  --ntf-track: rgba(148, 163, 184, 0.14);
}

html[data-theme="light"] {
  --ntf-learn: #15803d;   --ntf-learn-bg: #dcfce7;
  --ntf-practice: #b45309; --ntf-practice-bg: #fef3c7;
  --ntf-plan: #1d4ed8;    --ntf-plan-bg: #dbeafe;
  --ntf-teach: #4338ca;   --ntf-teach-bg: #e0e7ff;
  --ntf-class: #0f766e;   --ntf-class-bg: #ccfbf1;
  --ntf-keep: #475569;    --ntf-keep-bg: #eef2f6;
  --ntf-door: #166c43;    --ntf-door-ink: #ffffff;
  --ntf-sub: #475569;
  --ntf-track: #e9edf2;
}

[data-tool-tone] { --ntf-fg: var(--ntf-keep); --ntf-bg: var(--ntf-keep-bg); }
[data-tool-tone="learn"] { --ntf-fg: var(--ntf-learn); --ntf-bg: var(--ntf-learn-bg); }
[data-tool-tone="practice"] { --ntf-fg: var(--ntf-practice); --ntf-bg: var(--ntf-practice-bg); }
[data-tool-tone="plan"] { --ntf-fg: var(--ntf-plan); --ntf-bg: var(--ntf-plan-bg); }
[data-tool-tone="teach"] { --ntf-fg: var(--ntf-teach); --ntf-bg: var(--ntf-teach-bg); }
[data-tool-tone="class"] { --ntf-fg: var(--ntf-class); --ntf-bg: var(--ntf-class-bg); }

/* ── the glyph tile, everywhere ───────────────────────────────────────── */
.nabgol-tool-ico {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: var(--ntf-bg);
  color: var(--ntf-fg);
}
.nabgol-tool-ico svg { width: 19px; height: 19px; }

/* ══ PHONE BAND ══════════════════════════════════════════════════════════
   Height is unchanged: 40px controls in the 45px row (§33-4). The chip only
   gains a 24px glyph tile inside its own 40px. */
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-quick-strip-btn {
  gap: 6px;
  padding-inline: 6px 10px;
  scroll-snap-align: start;
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-quick-strip-btn .nabgol-tool-ico {
  width: 24px;
  height: 24px;
  border-radius: 8px;
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-quick-strip-btn .nabgol-tool-ico svg {
  width: 15px;
  height: 15px;
  stroke-width: 2;
}

/* Every tool stays in the row (owner: «همه مستقیم در دسترس»). The far edge
   fades instead of cutting a chip in half — the fade says «ادامه دارد»; the
   thin scroll line under the row (§34-د, the owner's own ask) stays. */
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] :is(.nabgol-band-rail:not([data-band-clusters]), .nabgol-band-cluster-rail) {
  scroll-snap-type: x proximity;
  -webkit-mask-image: linear-gradient(to left, transparent 0, #000 26px);
  mask-image: linear-gradient(to left, transparent 0, #000 26px);
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-srail {
  height: 2px;
  opacity: 0.6;
}

/* The door: a filled pill that names its content, four tiles, a count. */
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-door {
  gap: 7px;
  padding: 0 10px;
  border-color: var(--ntf-door);
  background: var(--ntf-door);
  background-image: none;
  color: var(--ntf-door-ink);
  overflow: visible;
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-door > .ico { display: none; }
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-door-tiles {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}
.nabgol-band-door-tiles rect:nth-child(1) { fill: #86efac; }
.nabgol-band-door-tiles rect:nth-child(2) { fill: #fcd34d; }
.nabgol-band-door-tiles rect:nth-child(3) { fill: #93c5fd; }
.nabgol-band-door-tiles rect:nth-child(4) { fill: #ffffff; }
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-door-count {
  position: absolute;
  top: -6px;
  left: -5px;
  min-width: 19px;
  height: 19px;
  padding: 0 4px;
  box-sizing: border-box;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  border: 2px solid var(--ntf-door);
  background: #ffffff;
  color: var(--ntf-door);
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1;
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band],
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-pinned { overflow: visible; }

/* Teacher: the index is a small two-word stack — «تدریس» over «کلاس» —
   inside the same 40px, no glyphs. One tap jumps the row to that group;
   the lit word follows the swipe (chat-workspace.js bandMarkActiveSection). */
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-index {
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  height: 40px;
  padding: 2px;
  border: 0;
  border-radius: 10px;
  background: var(--ntf-track);
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-cluster-tag,
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-cluster-tag.is-on {
  border: 0;
  box-shadow: none;
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-cluster-tag {
  flex-direction: row;
  height: 17px;
  min-width: 42px;
  padding: 0 6px;
  border-radius: 7px;
  background: transparent;
  color: var(--ntf-sub);
  font-size: 0.64rem;
  font-weight: 800;
  line-height: 1;
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-cluster-tag .ico { display: none; }
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-cluster-tag[data-band-jump="teacher_deliverable"].is-on {
  background: var(--ntf-teach-bg);
  color: var(--ntf-teach);
}
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-cluster-tag[data-band-jump="classroom"].is-on {
  background: var(--ntf-class-bg);
  color: var(--ntf-class);
}
/* Where «کلاس» begins inside the row: a hairline and the word, in its colour. */
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-boundary .ico { display: none; }
body:is(.mobile-chat, .desktop-chat) #nabgolQuickStrip[data-nabgol-band] .nabgol-band-section[data-band-section="classroom"] .nabgol-band-boundary {
  color: var(--ntf-class);
}

/* ══ PHONE PANEL «همهٔ ابزارها» ══════════════════════════════════════════ */
@media (max-width: 767.98px) {
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-wbm-ask[data-tools-face] {
    display: block;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-wbm-ask[data-tools-face] > .nabgol-ask-block {
    margin: 0 0 16px;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-ask-block > .nabgol-wb-section-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 4px 4px 8px;
    padding: 0;
    border: 0;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-ask-block > .nabgol-wb-section-head .nabgol-wb-section-title {
    font-size: 0.8rem;
    font-weight: 800;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-ask-block[data-tool-tone] > .nabgol-wb-section-head::before {
    content: "";
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ntf-fg);
    align-self: center;
  }

  /* Tool cards: two columns, glyph + full name + its one-line meaning. A name
     wraps to a second line; it is never clamped or cut. */
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-ask-tool-grid,
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-wb-stack {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  body.mobile-chat #nabgolWorkbenchSheet :is(.nabgol-ask-tool-grid .nabgol-ask-sheet-item, .nabgol-wb-stack > .nabgol-wb-btn) {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    align-content: center;
    column-gap: 10px;
    row-gap: 1px;
    min-height: 60px;
    height: auto;
    margin: 0;
    padding: 10px;
    border-radius: 16px;
    text-align: start;
  }
  body.mobile-chat #nabgolWorkbenchSheet [data-tool-tone] > .nabgol-tool-ico { grid-row: 1 / span 2; }
  body.mobile-chat #nabgolWorkbenchSheet [data-tool-tone] > :not(.nabgol-tool-ico) { grid-column: 2; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-wb-stack > [data-wb-progress-btn] { grid-column: 1 / -1; }
  body.mobile-chat #nabgolWorkbenchSheet :is(.nabgol-ask-sheet-item-text, .nabgol-wb-btn-label) {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  body.mobile-chat #nabgolWorkbenchSheet :is(.nabgol-ask-tool-grid .nabgol-ask-sheet-item-label, .nabgol-wb-stack .nabgol-wb-btn-label, .nabgol-wb-progress-line) {
    display: block;
    font-size: 0.84rem;
    font-weight: 750;
    line-height: 1.35;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    -webkit-line-clamp: unset;
    max-height: none;
  }
  body.mobile-chat #nabgolWorkbenchSheet :is(.nabgol-ask-tool-grid .nabgol-ask-sheet-item-hint, .nabgol-wb-stack .nabgol-wb-btn-hint, .nabgol-wb-progress-streak) {
    display: block;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.4;
    color: var(--ntf-sub);
    white-space: normal;
    overflow: visible;
    -webkit-line-clamp: unset;
    max-height: none;
  }

  /* Audience: three equal cards; the lit one carries its colour and a tick. */
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-row.nabgol-audience-cards {
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-cards > .nabgol-ask-prefs-label { display: none; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-height: 44px;
    padding: 12px 6px 10px;
    box-sizing: border-box;
    border: 1.5px solid var(--nab-btn-edge, rgba(148, 163, 184, 0.26));
    border-radius: 16px;
    background: var(--nab-btn-face-2, #161d29);
    color: var(--nab-btn-ink, #eaf0f7);
    font-family: inherit;
    text-align: center;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-ico {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    margin-bottom: 2px;
    border-radius: 13px;
    background: var(--ntf-bg);
    color: var(--ntf-fg);
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-ico svg { width: 22px; height: 22px; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-label { font-size: 0.88rem; font-weight: 800; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-cap { font-size: 0.68rem; line-height: 1.35; color: var(--ntf-sub); }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-check {
    display: none;
    position: absolute;
    top: 7px;
    left: 7px;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    background: var(--ntf-fg);
    color: var(--nab-btn-face-2, #161d29);
  }
  html[data-theme="light"] body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-check { color: #ffffff; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card-check svg { width: 13px; height: 13px; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card.is-on {
    border-color: var(--ntf-fg);
    background: var(--ntf-bg);
    box-shadow: 0 0 0 3px var(--ntf-bg);
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card.is-on .nabgol-audience-card-check { display: grid; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card.is-on .nabgol-audience-card-ico {
    background: var(--ntf-fg);
    color: var(--nab-btn-face-2, #161d29);
  }
  html[data-theme="light"] body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card.is-on .nabgol-audience-card-ico { color: #ffffff; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-audience-card:focus-visible {
    outline: 2px solid var(--ntf-fg);
    outline-offset: 2px;
  }

  /* Level: one segmented track, each option with its own meaning under it. */
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    padding: 4px;
    border: 0;
    border-radius: 14px;
    background: var(--ntf-track);
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row > .nabgol-ask-prefs-label { display: none; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row.nabgol-ask-prefs-row .nabgol-ask-pref-btn { border: 0; margin: 0; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: 58px;
    height: auto;
    padding: 8px 4px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    box-shadow: none;
    text-align: center;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn,
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn.is-active {
    color: var(--nab-btn-ink, #eaf0f7);
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn.is-active {
    background: var(--nab-btn-face-1, #1e2736);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18);
  }
  html[data-theme="light"] body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn.is-active { background: #ffffff; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-label { font-size: 0.84rem; font-weight: 800; }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .is-active .nabgol-level-label { color: var(--ntf-learn); }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-cap {
    font-size: 0.64rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--ntf-sub);
  }

  /* The workbench's own sections (پیشرفتِ من · گزارشِ پیشرفت · پشتیبان‌گیری · کتاب)
     wear the same heading as the tool groups. */
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-wb-section > .nabgol-wb-section-head {
    border: 0;
    margin: 4px 4px 8px;
  }
  body.mobile-chat #nabgolWorkbenchSheet :is(.nabgol-wb-section, .nabgol-ask-block:not([data-tool-tone])) > .nabgol-wb-section-head::before {
    content: "";
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ntf-keep);
    align-self: center;
  }
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-wb-section > .nabgol-wb-section-head .nabgol-wb-section-title {
    font-size: 0.8rem;
    font-weight: 800;
  }
}

/* Desktop: the quick strip (teacher tools above the composer) wears the same
   faces, sized to its 40px chips. The rail beside the canvas keeps its own. */
#nabgolQuickStrip .nabgol-quick-strip-btn[data-tool-tone] {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
#nabgolQuickStrip .nabgol-quick-strip-btn .nabgol-tool-ico {
  width: 26px;
  height: 26px;
  border-radius: 8px;
}
#nabgolQuickStrip .nabgol-quick-strip-btn .nabgol-tool-ico svg { width: 16px; height: 16px; }

/* The segmented track draws no hairline between its options — the lit face
   is the only separator (chat-workbench.css draws one for its own 4-col grid). */
@media (max-width: 767.98px) {
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn:not(.is-active) + .nabgol-ask-pref-btn:not(.is-active),
  body.mobile-chat #nabgolWorkbenchSheet .nabgol-level-row .nabgol-ask-pref-btn:not(.is-active):not([aria-pressed="true"]) {
    border: 0;
    box-shadow: none;
    background: transparent;
  }
}

/* No tile carries two pictures: where a tool wears a face, the older per-kind
   mark (chat-workbench.css §35-4-پ-۲) steps aside. Both shells. */
:is(#nabgolWorkbench, #nabgolWorkbenchSheet) [data-tool-tone]
  :is(.nabgol-wb-btn-label, .nabgol-ask-bar-btn-label, .nabgol-ask-sheet-item-label)::before {
  display: none;
}

/* ══ DESKTOP RAIL «میزِ کار» — the phone panel's design in a 200px column ══
   Same blocks in the same order: readers (as three rows) · tools in named
   groups · «میزانِ کمک» (three rows, each with its meaning) · the workbench's
   own sections. One column; nothing is clamped. */
.nabgol-audience-card[data-audience="student"] { --ntf-fg: var(--ntf-learn); --ntf-bg: var(--ntf-learn-bg); }
.nabgol-audience-card[data-audience="parent"] { --ntf-fg: var(--ntf-practice); --ntf-bg: var(--ntf-practice-bg); }
.nabgol-audience-card[data-audience="teacher"] { --ntf-fg: var(--ntf-teach); --ntf-bg: var(--ntf-teach-bg); }

@media (min-width: 768px) {
  body #nabgolWorkbench #nabgolAskBar[data-tools-face] {
    display: block;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }
  body #nabgolWorkbench #nabgolAskBar[data-tools-face] > .nabgol-ask-block { margin: 0 0 16px; }
  body #nabgolWorkbench :is(#nabgolAskBar .nabgol-ask-block, .nabgol-wb-section) > .nabgol-wb-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 7px;
    row-gap: 0;
    margin: 2px 2px 8px;
    padding: 0;
    border: 0;
  }
  body #nabgolWorkbench :is(#nabgolAskBar .nabgol-ask-block, .nabgol-wb-section) > .nabgol-wb-section-head::before {
    content: "";
    flex: 0 0 7px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ntf-fg, var(--ntf-keep));
    align-self: center;
  }
  body #nabgolWorkbench :is(#nabgolAskBar .nabgol-ask-block, .nabgol-wb-section) > .nabgol-wb-section-head .nabgol-wb-section-title {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 800;
  }
  body #nabgolWorkbench :is(#nabgolAskBar .nabgol-ask-block, .nabgol-wb-section) > .nabgol-wb-section-head .nabgol-wb-section-lede {
    flex-basis: 100%;
    margin: 1px 0 0;
    padding-inline-start: 14px;
    font-size: 0.68rem;
    color: var(--ntf-sub);
  }

  /* Readers: three rows — glyph · name over meaning · a tick on the lit one. */
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-row.nabgol-audience-cards {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-cards > .nabgol-ask-prefs-label { display: none; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    row-gap: 1px;
    width: 100%;
    min-height: 52px;
    padding: 8px 10px;
    box-sizing: border-box;
    border: 1.5px solid var(--nab-btn-edge, rgba(148, 163, 184, 0.26));
    border-radius: 14px;
    background: var(--nab-btn-face-2, #161d29);
    color: var(--nab-btn-ink, #eaf0f7);
    font-family: inherit;
    text-align: start;
    cursor: pointer;
  }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-ico {
    grid-row: 1 / span 2;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: var(--ntf-bg);
    color: var(--ntf-fg);
  }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-ico svg { width: 19px; height: 19px; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-label { grid-column: 2; font-size: 0.84rem; font-weight: 800; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-cap { grid-column: 2; font-size: 0.68rem; line-height: 1.35; color: var(--ntf-sub); }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-check {
    display: none;
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    place-items: center;
    border-radius: 50%;
    background: var(--ntf-fg);
    color: var(--nab-btn-face-2, #161d29);
  }
  html[data-theme="light"] body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-check { color: #ffffff; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card-check svg { width: 13px; height: 13px; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card.is-on {
    border-color: var(--ntf-fg);
    background: var(--ntf-bg);
  }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card.is-on .nabgol-audience-card-check { display: grid; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card.is-on .nabgol-audience-card-ico {
    background: var(--ntf-fg);
    color: var(--nab-btn-face-2, #161d29);
  }
  html[data-theme="light"] body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card.is-on .nabgol-audience-card-ico { color: #ffffff; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-audience-card:focus-visible { outline: 2px solid var(--ntf-fg); outline-offset: 2px; }

  /* Tools and the workbench's own tiles: one column of face + name + meaning. */
  body #nabgolWorkbench :is(#nabgolAskBar .nabgol-ask-tool-grid, .nabgol-wb-stack) {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  body #nabgolWorkbench :is(#nabgolAskBar .nabgol-ask-tool-grid .nabgol-ask-bar-btn, .nabgol-wb-stack > .nabgol-wb-btn)[data-tool-tone] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    align-content: center;
    column-gap: 10px;
    row-gap: 1px;
    width: 100%;
    min-height: 54px;
    height: auto;
    margin: 0;
    padding: 8px 10px;
    box-sizing: border-box;
    border-radius: 14px;
    text-align: start;
  }
  body #nabgolWorkbench [data-tool-tone] > .nabgol-tool-ico { grid-row: 1 / span 2; width: 34px; height: 34px; border-radius: 10px; }
  body #nabgolWorkbench [data-tool-tone] > .nabgol-tool-ico svg { width: 18px; height: 18px; }
  body #nabgolWorkbench [data-tool-tone] > :not(.nabgol-tool-ico) { grid-column: 2; }
  body #nabgolWorkbench [data-tool-tone] :is(.nabgol-ask-bar-btn-label, .nabgol-wb-btn-label, .nabgol-wb-progress-line) {
    display: block;
    font-size: 0.82rem;
    font-weight: 750;
    line-height: 1.35;
    white-space: normal;
    overflow: visible;
    -webkit-line-clamp: unset;
    max-height: none;
  }
  body #nabgolWorkbench [data-tool-tone] :is(.nabgol-ask-bar-btn-hint, .nabgol-wb-btn-hint, .nabgol-wb-progress-streak) {
    display: block;
    font-size: 0.68rem;
    font-weight: 500;
    line-height: 1.4;
    color: var(--ntf-sub);
    white-space: normal;
    overflow: visible;
    -webkit-line-clamp: unset;
    max-height: none;
  }
  body #nabgolWorkbench .nabgol-wb-stack.nabgol-wb-inline-row { flex-direction: column; }

  /* «میزانِ کمک»: three rows in a track, each with its own meaning. */
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 4px;
    border: 0;
    border-radius: 14px;
    background: var(--ntf-track);
  }
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row > .nabgol-ask-prefs-label { display: none; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row .nabgol-ask-pref-btn,
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row .nabgol-ask-pref-btn:not(.is-active):not([aria-pressed="true"]),
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row .nabgol-ask-pref-btn:not(.is-active) + .nabgol-ask-pref-btn:not(.is-active) {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    width: 100%;
    min-height: 44px;
    height: auto;
    padding: 6px 10px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    box-shadow: none;
    color: var(--nab-btn-ink, #eaf0f7);
    text-align: start;
  }
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row .nabgol-ask-pref-btn.is-active {
    background: var(--nab-btn-face-1, #1e2736);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18);
  }
  html[data-theme="light"] body #nabgolWorkbench #nabgolAskBar .nabgol-level-row .nabgol-ask-pref-btn.is-active { background: #ffffff; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-label { font-size: 0.82rem; font-weight: 800; }
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-row .is-active .nabgol-level-label { color: var(--ntf-learn); }
  body #nabgolWorkbench #nabgolAskBar .nabgol-level-cap { font-size: 0.66rem; line-height: 1.35; color: var(--ntf-sub); }
}

/* The rail's tiles also carry a 16px «sends a message» mark as their own
   ::before (a grid item once the tile is a grid). A tile with a face has its
   picture already. */
@media (min-width: 768px) {
  body #nabgolWorkbench :is(.nabgol-ask-bar-btn, .nabgol-wb-btn)[data-tool-tone]::before { display: none; }
}
@media (min-width: 768px) {
  /* Outranks chat-workbench.css's «16px mark + text» grid ((1,3,0), > * col 2). */
  body #nabgolWorkbench :is(.nabgol-ask-bar-btn, .nabgol-wb-btn)[data-tool-tone][data-action-kind] {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    justify-items: stretch;
    column-gap: 10px;
  }
  body #nabgolWorkbench :is(.nabgol-ask-bar-btn, .nabgol-wb-btn)[data-tool-tone][data-action-kind] > .nabgol-tool-ico {
    grid-column: 1;
    grid-row: 1 / span 2;
  }
  body #nabgolWorkbench :is(.nabgol-ask-bar-btn, .nabgol-wb-btn)[data-tool-tone][data-action-kind] > :not(.nabgol-tool-ico) {
    grid-column: 2;
  }
}
@media (min-width: 768px) {
  /* The rail's tiles compute ltr (the body does); the face belongs at the
     start of a Persian line — the right — exactly as on the phone. */
  body #nabgolWorkbench :is(.nabgol-ask-bar-btn, .nabgol-wb-btn)[data-tool-tone] { direction: rtl; }
  /* A heading too long for the column keeps its words, not its dot. */
  body #nabgolWorkbench #nabgolAskBar .nabgol-ask-block:not([data-tool-tone]) > .nabgol-wb-section-head::before { display: none; }
}


/* ══ DESKTOP — THE PHONE BAND, AS IS, SITTING ON THE COMPOSER ══════════════
   Owner, 2026-09-27: «همان نسخهٔ استانداردِ گوشی، برای همهٔ حالت‌ها». Every
   band rule above is written for both shells; this block only places it:
   its bottom edge IS the input box's top edge (composer offset − 8 − the
   52px transparent lift), an opaque face with rounded top corners, above the
   composer's fade (z 6). Measured before: a 194px teacher-only block 61px
   above the box; nothing at all for a student. */
@media (min-width: 768px) {
  body.desktop-chat #nabgolQuickStrip[data-nabgol-band] {
    margin-bottom: calc(var(--nabgol-composer-offset, 76px) - 8px - var(--nbgc-composer-lift, 52px)) !important;
    z-index: 7 !important;
    height: 48px;
    min-height: 48px;
    padding: 0 8px;
    border: 1px solid var(--nab-btn-edge, rgba(148, 163, 184, 0.26));
    border-bottom: 0;
    border-radius: 14px 14px 0 0;
    background: var(--nab-btn-face-2, #161d29);
    box-shadow: 0 -4px 14px rgba(15, 23, 42, 0.08);
  }
  html[data-theme="light"] body.desktop-chat #nabgolQuickStrip[data-nabgol-band] { background: #ffffff; }
  body.desktop-chat #nabgolQuickStrip[data-nabgol-band] .nabgol-band-rail { cursor: default; }
  /* The composer's transparent lift (52px, where the jump-to-latest button
     lives) grows by the band's height while the band is shown: the band sits in
     its lower 52px, the button keeps its own upper 52px — both inside the bar
     (test_controls_always_reachable.js: no control spills out of its bar). */
  body.desktop-chat:has(#nabgolQuickStrip[data-nabgol-band]:not([hidden])) {
    --nbgc-composer-lift: 104px;
  }
  /* «همهٔ ابزارها» on desktop brings the rail's tools into view and lights them. */
  #nabgolWorkbench .nabgol-ask-tool-group.is-called {
    border-radius: 16px;
    box-shadow: 0 0 0 3px var(--ntf-learn-bg);
    transition: box-shadow 0.3s ease;
  }
}