/* ═══════════════ e'thix AI — Agent (live): launcher, job view, findings, artifacts, rail, tabs, run-card states ═══════════════
   Loaded after agent.css. The workspace frame (.ws, .ws-head, .ws-body, .ws-files, .ws-main) keeps agent.css's layout;
   everything the real agent adds is here. The workspace lives in a pane whose width follows the split, not the
   viewport: what stacks or wraps does so by the pane's own width (@container ws, agent.css names .ws a size
   container); viewport queries only set gutters and type sizes. 1000px is where the page becomes two separate panes.
   Small status text uses mixes of the theme tokens that keep 4.5:1 on the pane (--ok / --danger / --muted alone do not). */

/* ─── the scrolling main area ─── */
.agl-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:24px clamp(16px,3.2vw,32px) 44px}
.agl-scroll > *{max-width:780px;margin-inline:auto}
.agl-muted{color:color-mix(in srgb,var(--muted) 60%,var(--ink));font-size:13px}

/* ─── tabs (own class: the right-click file menu of context.js belongs to the old files, not to jobs) ─── */
.agt-tab{position:relative;display:flex;align-items:center;flex:none;max-width:240px;border-radius:11px;color:var(--ink-soft);transition:background-color var(--t),color var(--t),box-shadow var(--t)}
.agt-tab.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1)}
.agt-tab.on::after{content:"";position:absolute;inset-inline:10px;bottom:0;height:2px;border-radius:2px;background:var(--g-agent)}
.agt-tab .wt-main .i{width:15px;height:15px;color:#56667F}
html[data-theme="dark"] .agt-tab .wt-main .i{color:#B7C6DD}
.agt-tab:hover .wt-x,.agt-tab.on .wt-x,.agt-tab .wt-x:focus-visible{opacity:1}
@media (hover:hover){.agt-tab:not(.on):hover{background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}}
/* on touch an inactive tab's × is invisible: it must not be a live target at the end of the tab */
@media (hover:none){.agt-tab:not(.on) .wt-x{visibility:hidden;pointer-events:none}.agt-tab.on .wt-x{width:32px;height:32px}}

/* ─── the way back to the chat: only where the workspace pane fills the screen (a phone or a tablet) ─── */
.ws-tools .agl-to-chat{display:none}
@media (max-width:1000px){.stage[data-mode="agent"][data-pane="ws"] .agl-to-chat{display:inline-grid}}

/* ─── the rail: this conversation's jobs ─── */
.agr-list{list-style:none;margin:0;padding:0 6px 6px;display:grid;gap:2px;align-content:start}
.agr-job{display:grid;gap:2px}
.agr-row{display:flex;align-items:center;gap:2px;min-width:0}
.agr-item{position:relative;flex:1;min-width:0;display:flex;align-items:center;gap:9px;min-height:36px;padding:6px 9px;border-radius:9px;font-size:12.5px;color:var(--ink-soft);text-align:start;transition:background var(--t-fast),color var(--t-fast)}
.agr-item .wf-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agr-item .i{width:16px;height:16px;color:#56667F}
html[data-theme="dark"] .agr-item .i{color:#B7C6DD}
.agr-item.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1)}
@media (hover:hover){.agr-item:not(.on):hover{background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}}
.agr-dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--muted)}
.agr-dot.s-pending,.agr-dot.s-running{background:#7488A8;animation:agl-pulse 1.4s ease-in-out infinite}
.agr-dot.s-completed{background:var(--ok)}
.agr-dot.s-failed{background:var(--danger)}
.agr-dot.s-cancelled{background:color-mix(in srgb,var(--ink) 30%,transparent)}
.agr-dot.s-idle{background:var(--muted);animation:none}
@keyframes agl-pulse{50%{opacity:.35}}
html.reduce-motion .agr-dot{animation:none}
.agr-exp{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:8px;color:var(--muted);transition:background var(--t-fast),color var(--t-fast)}
.agr-exp .i{width:14px;height:14px;transition:transform .35s var(--spring)}
.agr-exp[aria-expanded="true"] .i{transform:rotate(180deg)}
@media (hover:hover){.agr-exp:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 6%,transparent)}}
.agr-arts{list-style:none;margin:0 0 4px;padding:0;padding-inline-start:16px;display:grid;gap:2px}
.agr-art{min-height:32px;font-size:12px}
.agr-none{padding:4px 9px;font-size:11.5px;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agr-empty{padding:6px 12px 10px;font-size:12px;line-height:1.55;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
/* the closed strip: icons and status only */
.ws-body:not(.with-files) .agr-exp,.ws-body:not(.with-files) .agr-arts,.ws-body:not(.with-files) .agr-empty{display:none}
.ws-body:not(.with-files) .agr-list{padding-inline:5px}
.ws-body:not(.with-files) .agr-item{justify-content:center;padding:6px 0}
.ws-body:not(.with-files) .agr-item .wf-name{display:none}
.ws-body:not(.with-files) .agr-dot{position:absolute;top:5px;inset-inline-end:5px;width:7px;height:7px}

/* ─── shared blocks ─── */
/* the title keeps at least 180px: narrower, the actions (Cancel, copy / download) wrap below it instead of squeezing it */
.agl-head{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}
.agl-hic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;flex:none;background:var(--g-agent);color:#141922}
.agl-hic .i{width:21px;height:21px}
.agl-htxt{flex:1 1 180px;min-width:0;display:grid;gap:6px}
.agl-title{font-size:19px;font-weight:700;line-height:1.45;overflow-wrap:anywhere}
.agl-meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:12.5px;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-badge{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:2px 10px;border-radius:20px;font-size:12px;font-weight:600;background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink-soft)}
.agl-badge .spinner{width:12px;height:12px}
.agl-badge.s-pending,.agl-badge.s-running{background:color-mix(in srgb,#7488A8 16%,transparent);color:#46566F}
html[data-theme="dark"] .agl-badge.s-pending,html[data-theme="dark"] .agl-badge.s-running{color:#C9D6EA}
.agl-badge.s-completed{background:color-mix(in srgb,var(--ok) 16%,transparent);color:color-mix(in srgb,var(--ok) 40%,var(--ink))}
.agl-badge.s-failed{background:var(--danger-soft);color:color-mix(in srgb,var(--danger) 55%,var(--ink))}
/* the last status read, while the page is not following the job: still, and in the neutral colours */
.agl-badge.is-static,html[data-theme="dark"] .agl-badge.is-static{background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink-soft)}
.agl-sec{display:grid;gap:10px}
.agl-sec > h3{font-size:14.5px;font-weight:700;color:var(--ink)}
.agl-alert{padding:10px 14px;border-radius:12px;background:var(--danger-soft);color:color-mix(in srgb,var(--danger) 55%,var(--ink));font-size:13.5px;line-height:1.6}
/* q-agentfail: a failed reading, said in words, with «أعِد التشغيل» beside it */
.agl-fail{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.agl-fail-t{flex:1 1 240px;min-width:0;margin:0}
.agl-note{padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--ink) 5%,transparent);color:var(--ink-soft);font-size:13.5px;line-height:1.6}
.agl-note-act{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.agl-note-act p{flex:1 1 220px;min-width:0}
.agl-draft{font-size:12px;color:var(--ink-soft);line-height:1.65;border-top:1px solid var(--line);padding-top:12px}
/* a busy control stays focusable (aria-disabled); it only looks disabled */
.agl-cancel[aria-disabled="true"],.agl-add[aria-disabled="true"],.agl-start[aria-disabled="true"],.agl-docs-reload[aria-disabled="true"]{opacity:.6;cursor:default;filter:saturate(.4)}
.agl-state{display:grid;justify-items:center;gap:12px;padding:48px 16px;text-align:center;color:color-mix(in srgb,var(--muted) 60%,var(--ink));font-size:14px}
.agl-state .i{width:28px;height:28px;color:var(--gold-deep)}
.agl-when{font-variant-numeric:tabular-nums}

/* ─── unavailable ─── */
.agl-off{display:grid;justify-items:center;gap:12px;padding:48px 20px;text-align:center;max-width:460px}
.agl-off-ic{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--muted)}
.agl-off-ic .i{width:30px;height:30px}
.agl-off h2{font-size:20px;font-weight:700}
.agl-off p{color:var(--ink-soft);font-size:14.5px;line-height:1.7}

/* ─── the launcher ─── */
.agl-launch{display:grid;gap:20px}
.agl-ltitle{font-size:21px;font-weight:700;line-height:1.4}
.agl-lsub{margin-top:6px;color:var(--ink-soft);font-size:14px;line-height:1.75}
.agl-tasks,.agl-docs{border:0;margin:0;padding:0;min-width:0;display:grid;gap:10px}
.agl-legend{padding:0;margin-bottom:8px;font-size:13px;font-weight:600;color:var(--ink-soft)}
.agl-task-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:8px}
.agl-task{position:relative;display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:16px;background:var(--surface);border:1px solid var(--line);cursor:pointer;transition:border-color var(--t-fast),box-shadow var(--t),transform .45s var(--spring)}
/* the radio stays in the tab order and in the accessibility tree; only its dot is hidden, the card shows the choice */
.agl-task input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.agl-task:has(input:checked){border-color:color-mix(in srgb,var(--accent-b) 75%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-b) 24%,transparent)}
.agl-task:has(input:focus-visible){outline:2px solid var(--gold-deep);outline-offset:2px}
@media (hover:hover){.agl-task:hover{border-color:color-mix(in srgb,var(--accent-b) 45%,var(--line))}}
.agl-task-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex:none;background:color-mix(in srgb,#7488A8 12%,transparent);color:#56667F}
html[data-theme="dark"] .agl-task-ic{color:#B7C6DD}
.agl-task:has(input:checked) .agl-task-ic{background:var(--g-agent);color:#141922}
.agl-task-ic .i{width:18px;height:18px}
.agl-task-txt{display:grid;gap:3px;min-width:0}
.agl-task-txt b{font-size:13.5px;font-weight:700;color:var(--ink)}
.agl-task-txt small{font-size:12px;line-height:1.55;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-field{gap:8px}
.agl-doclist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
/* documents handed over from the chat, listed first under their own heading */
.agl-handed{margin:0 0 6px;font-weight:600}
.agl-doclist + .agl-doclist{margin-top:10px}
.agl-doc{padding:10px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.agl-doc:has(input:disabled){opacity:.7}
.agl-doc .check{align-items:center}
.agl-doc-txt{display:grid;gap:2px;min-width:0}
.agl-doc-name{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.agl-doc-txt small{font-size:12px;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-docs-reload{margin-top:8px}
.agl-count{justify-self:end;font-size:11.5px;color:var(--ink-soft)}
.agl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.agl-why{flex:1;min-width:200px;font-size:13px;line-height:1.6;color:color-mix(in srgb,var(--ok) 40%,var(--ink))}
.agl-why.bad{color:var(--ink-soft)}
.agl-prev{display:grid;gap:8px}
.agl-prev h3{font-size:13.5px;font-weight:700;color:var(--ink-soft)}
.agl-prevlist{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.agl-prevjob{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:8px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:13px;text-align:start;color:var(--ink)}
.agl-prevjob .i{width:16px;height:16px;color:var(--muted);flex:none}
.agl-prevjob span{flex:1;min-width:0}
.agl-prevjob time{font-size:12px;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}

/* ─── a job ─── */
.agl-job,.agl-art{display:grid;gap:20px}
.agl-cancel{flex:none}
.agl-cancel .spinner{width:14px;height:14px}
.agl-plan{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.agl-step{display:flex;align-items:center;gap:10px;min-height:34px;font-size:13.5px;color:var(--ink-soft)}
.agl-sdot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--surface-2);border:1.5px solid var(--line);color:var(--muted)}
.agl-sdot i{width:6px;height:6px;border-radius:50%;background:currentColor}
.agl-sdot .i{width:13px;height:13px;stroke-width:2.6}
.agl-sdot .spinner{width:14px;height:14px}
.agl-step[data-state="done"] .agl-sdot{background:var(--g-agent);border-color:transparent;color:#141922}
.agl-step[data-state="running"]{color:var(--ink);font-weight:600}
.agl-step[data-state="running"] .agl-sdot{border-color:#7488A8}
.agl-step[data-state="failed"] .agl-sdot{border-color:var(--danger);color:var(--danger)}
.agl-step[data-state="skipped"]{opacity:.62}
.agl-slabel{flex:1;min-width:0}
.agl-sstate{flex:none;font-size:11.5px;color:var(--ink-soft)}
.agl-smodel{flex:none;font-size:11px;padding:1px 8px;border-radius:999px;background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--ink-soft);white-space:nowrap}
/* C20: which model wrote the job's model steps, and — when the pick's lane refused — why the backup wrote instead */
.agl-served{display:flex;flex-direction:column;gap:6px;margin:6px 0 2px}
.agl-served-label{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--ink-soft)}
.agl-served-label svg,.agl-served-notice svg{width:14px;height:14px;flex:none}
.agl-served-name{font-weight:600;color:var(--ink)}
.agl-served-notice{display:flex;align-items:flex-start;gap:8px;padding:8px 12px;border-radius:10px;background:color-mix(in srgb,var(--gold-deep) 12%,transparent);color:var(--ink);font-size:13px;line-height:1.6}
.agl-served-notice svg{margin-top:3px}
.agl-sum{display:flex;flex-wrap:wrap;gap:6px}
.agl-sum-i{padding:3px 10px;border-radius:20px;font-size:12px;background:color-mix(in srgb,var(--ink) 5%,transparent);color:var(--ink-soft);font-variant-numeric:tabular-nums}
.agl-sources{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.agl-src{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-soft)}
.agl-src .i{width:15px;height:15px;flex:none;color:var(--gold-deep)}
.agl-src-label{min-width:0;overflow-wrap:anywhere}
.agl-src-page{flex:none;font-size:12px;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-findings{gap:16px}
.agl-fgroup{display:grid;gap:8px}
.agl-fgroup h4{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--ink-soft)}
.agl-n{min-width:20px;height:20px;padding:0 6px;border-radius:10px;display:grid;place-items:center;font-size:11px;background:color-mix(in srgb,var(--ink) 8%,transparent);font-variant-numeric:tabular-nums}
.agl-flist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.agl-finding{display:grid;gap:10px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.agl-ftext{font-size:14.5px;line-height:1.75;color:var(--ink);overflow-wrap:anywhere}
.agl-prov{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:12.5px;color:var(--ink-soft)}
.agl-pbadge{display:inline-flex;align-items:center;min-height:22px;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:700;background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--ink-soft)}
.agl-pbadge.p-document{background:color-mix(in srgb,var(--accent-b) 20%,transparent);color:var(--gold-text,var(--gold-deep))}
.agl-pbadge.p-calculation{background:color-mix(in srgb,var(--ok) 15%,transparent);color:color-mix(in srgb,var(--ok) 40%,var(--ink))}
.agl-pbadge.p-user_message,.agl-pbadge.p-user_answer{background:color-mix(in srgb,#7488A8 15%,transparent);color:#46566F}
html[data-theme="dark"] .agl-pbadge.p-user_message,html[data-theme="dark"] .agl-pbadge.p-user_answer{color:#C9D6EA}
.agl-docname,.agl-section{font-weight:600;overflow-wrap:anywhere}
.agl-quote{flex-basis:100%;margin:0;padding:8px 12px;border-inline-start:3px solid var(--accent-b);border-start-end-radius:10px;border-end-end-radius:10px;background:color-mix(in srgb,var(--accent-b) 8%,transparent);font-size:13.5px;line-height:1.75;color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
.agl-machine{flex-basis:100%;font-size:11.5px;color:var(--ink-soft)}
.agl-span,.agl-formula{overflow-wrap:anywhere}
.agl-add{justify-self:start}
.agl-added{justify-self:start;display:inline-flex;align-items:center;min-height:28px;padding:2px 12px;border-radius:20px;font-size:12.5px;font-weight:600;background:color-mix(in srgb,var(--ok) 15%,transparent);color:color-mix(in srgb,var(--ok) 40%,var(--ink))}
.agl-report{font-size:14.5px}
.agl-chips{display:flex;flex-wrap:wrap;gap:8px}
.agl-chip .fc-t b{overflow-wrap:anywhere}

/* ─── an artifact ─── */
.agl-tools{display:flex;flex-wrap:wrap;gap:6px;flex:none}

/* ─── the confirm dialog's value and quote ─── */
.agl-cv{font-weight:700;color:var(--ink)}
.agl-cq{display:inline-block;margin-top:4px;padding:6px 10px;border-radius:10px;background:color-mix(in srgb,var(--accent-b) 10%,transparent);color:var(--ink);quotes:"«" "»";overflow-wrap:anywhere}

/* ─── run card (in the chat) ─── */
.agl-card .run-glyph .spinner{width:14px;height:14px}
.agl-card .run-glyph .i{width:15px;height:15px}
.agl-card.done .run-glyph{color:var(--ok)}
.agl-card.failed .run-glyph{color:var(--danger)}
.agl-card .st.failed .st-dot{border-color:var(--danger);color:var(--danger)}
.agl-card .st.skipped{opacity:.6}
.agl-card .st.pending .st-dot{color:var(--muted)}
.st-state{flex:none;font-size:11px;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-card .run-meta{color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-legacy .run-head{cursor:default}
.agl-legacy .run-head:hover{background:none}
/* a job the page is not following: a still card (no spinner, no shimmer, no clock) that says why */
.agl-card.agl-unfollowed .run-glyph{color:var(--muted)}

/* ─── a narrow workspace pane (its own width: the split, the rail and the viewport all move it) ─── */
@container ws (max-width:560px){
  .agl-task-grid{grid-template-columns:1fr}
  .agl-cancel,.agl-tools{width:100%}
  .agl-cancel{justify-content:center}
  .agl-tools .b{flex:1}
  .agl-start{width:100%}
  .agl-why{min-width:0;flex-basis:100%}
}

/* ─── narrower screens: gutters and type only ─── */
@media (max-width:820px){
  .agl-scroll{padding:18px 16px 32px}
  .agl-title{font-size:18px}
}
@media (max-width:640px){
  .agl-step{font-size:13px}
}
@media (max-width:380px){
  .agl-scroll{padding-inline:12px}
  .agl-hic{width:38px;height:38px;border-radius:12px}
  .agl-title,.agl-ltitle{font-size:17px}
  .agl-task{padding:10px}
  .agl-finding{padding:12px}
  .agl-sstate{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
}
/* Wave-2 merge: a finished job opens on its summary (legal-views.css draws it), and the case sits beside the work (B4) */
.agl-job > .agl-lv{display:grid;gap:12px;margin-block:4px 14px;min-width:0}
.agl-case{display:block;margin-top:16px;min-width:0}
.agl-lcase{margin-block:4px 12px}
.agl-lcase[hidden]{display:none}

/* ─── PK-W4-2 (A8, A9, A13): the launcher's cards, upload and case readiness; the activity log ─── */
.agl-task-card{display:grid;gap:6px;align-content:start}
.agl-task-needs,.agl-task-cost{font-size:12px;color:var(--ink-soft)}
.agl-task-cost{font-weight:600;color:color-mix(in srgb,var(--gold-deep) 70%,var(--ink))}
.agl-task-block{font-size:12px;color:color-mix(in srgb,var(--danger) 55%,var(--ink));font-weight:600}
.agl-task-cost.is-free{color:color-mix(in srgb,var(--ok) 40%,var(--ink))}
.agl-task-cost.is-out{color:color-mix(in srgb,var(--danger) 55%,var(--ink))}
.agl-task.is-blocked{opacity:.72;cursor:not-allowed;border-style:dashed}
.agl-task.is-blocked input{cursor:not-allowed}
.agl-task-answer{justify-self:start}
.agl-upload{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:8px}
.agl-upload-hint{flex:1 1 200px}
.agl-uploads .agl-doc-txt{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.agl-uploads .s-failed small{color:color-mix(in srgb,var(--danger) 55%,var(--ink))}
.agl-doc{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.agl-ready{display:grid;gap:6px;padding:12px;border-radius:14px;border:1px solid var(--line);background:var(--surface)}
.agl-ready-title{font-size:14px;font-weight:700;color:var(--ink);margin:0}
.agl-ready h4{font-size:12.5px;font-weight:700;color:var(--ink-soft);margin:4px 0 0}
.agl-ready-list{display:grid;gap:3px;margin:0;padding-inline-start:18px;font-size:13px;color:var(--ink)}
.agl-ready-list b{font-weight:600;color:var(--ink-soft)}
.agl-ready-more{list-style:none;color:var(--muted);font-size:12px}
.agl-ready-ok{color:var(--ok)}
.agl-ready-answer{justify-self:start}
.agl-now{display:grid;gap:4px;padding:8px 10px;border-radius:12px;background:var(--surface-2);font-size:13px;color:var(--ink)}
.agl-now-l{margin:0}
.agl-now-l.is-waking,.agl-now-l.is-queued{font-weight:600}
.agl-now-l.is-count{color:var(--ink-soft)}
.agl-stime{margin-inline-start:auto;font-size:12px;color:var(--muted);white-space:nowrap}
.agl-src-art{cursor:pointer}
@media (max-width:414px){.agl-step{flex-wrap:wrap}.agl-stime{margin-inline-start:34px}}

/* ═══ PK-W4-1 (wave 3): the chat side of a task — Stop and «أعِد التشغيل» on the run card (A10, A12), the result block in
   the chat (A11), «ليست صحيحة» / «افتح ملف القضية» and the waiting banner (D3), counts and the kind filter (A17, A21), the
   earlier version's files (A24), the compact summary in the conversations column (A15). Touch targets are 40px or more. ═══ */
.agl-card .run-acts{display:flex;flex-wrap:wrap;gap:8px;padding:2px 12px 12px}
.agl-card .run-acts .b{min-height:40px}
.agl-card .run-stop[aria-disabled="true"]{opacity:.75;cursor:progress}
.agl-card .run-stop .spinner{width:14px;height:14px}
.agl-result{padding:0 12px 10px}
.agl-result:empty{display:none}
.agl-result-box{display:grid;gap:10px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.agl-result-box .lv{margin:0}
.agl-result-h{font-size:14px;font-weight:700;color:var(--ink)}
.agl-result-counts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ink-soft)}
.agl-result-counts b{font-size:16px;color:var(--ink)}
.agl-result-watch{margin:0;padding-inline-start:18px;display:grid;gap:4px;font-size:13px;line-height:1.6;color:var(--ink-soft)}
.agl-result-acts,.agl-result-box .lv-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.agl-result-acts .b,.agl-result-box .lv-acts .b{min-height:40px}
/* in the chat column the donut is left to the job view: the counts beside it already say the same numbers */
@media (max-width:414px){.agl-result-box .lv-donut{display:none}.agl-result{padding-inline:8px}}

/* D3: the two honest answers to a proposal, and the way on after one */
.agl-facts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.agl-facts .b{min-height:40px}
.agl-reject{color:var(--ink-soft)}
.agl-rejected{display:inline-flex;align-items:center;min-height:28px;padding:2px 12px;border-radius:20px;font-size:12.5px;font-weight:600;background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink-soft)}
.agl-finding.is-waiting{border-color:color-mix(in srgb,var(--accent-b) 45%,var(--line))}
.agl-pending{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--accent-b) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--accent-b) 35%,var(--line))}
.agl-pending > .i{width:18px;height:18px;flex:none;color:var(--ink)}
.agl-pending p{flex:1 1 160px;margin:0;font-size:13.5px;font-weight:600;color:var(--ink)}
.agl-pending .b{min-height:40px}

/* A17: the kind filter, each with its real count; «هذه القراءة خاطئة»; what was hidden and the way to show it again */
.agl-kinds{display:flex;flex-wrap:wrap;gap:6px}
.agl-kind{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:4px 12px;border-radius:20px;font-size:12.5px;font-weight:600;color:var(--ink-soft);background:color-mix(in srgb,var(--ink) 5%,transparent);border:1px solid var(--line);transition:background var(--t-fast),color var(--t-fast)}
.agl-kind.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.agl-kind.on .agl-n{background:color-mix(in srgb,var(--bg) 22%,transparent)}
@media (hover:hover){.agl-kind:not(.on):hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 9%,transparent)}}
.agl-wrong{justify-self:start;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:4px 8px;border-radius:10px;font-size:12px;color:var(--ink-soft)}
.agl-wrong .i{width:14px;height:14px}
@media (hover:hover){.agl-wrong:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 6%,transparent)}}
.agl-hidden{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:12.5px;color:var(--ink-soft)}
.agl-linkbtn{min-height:40px;padding:4px 6px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* A21: counts on the rail and the tabs */
.agr-n,.agt-tab .wt-n{flex:none;min-width:20px;height:20px;padding:0 6px;border-radius:10px;display:inline-grid;place-items:center;font-size:11px;font-weight:600;background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink-soft);font-variant-numeric:tabular-nums}
.ws-body:not(.with-files) .agr-n{display:none}

/* A24: files the earlier demo workspace wrote — download only */
.agl-legacy{display:grid;gap:4px;margin:10px 6px 6px;padding:10px 6px 4px;border-top:1px solid var(--line)}
.agl-legacy h4{display:flex;align-items:center;gap:8px;padding-inline:6px;font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.agl-legacy-note{padding-inline:6px;font-size:11.5px;line-height:1.55;color:color-mix(in srgb,var(--muted) 60%,var(--ink))}
.agl-legacy-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.agl-legacy-dl{min-height:40px}
.ws-body:not(.with-files) .agl-legacy{display:none}

/* A15: the compact summary in the conversations column (chat.js .side-review; shell.css shows it under .side.reviewing) */
.agl-side{display:grid;gap:10px;align-content:start;padding:8px 10px 14px;overflow:auto;min-height:0}
.agl-side-head{display:flex;align-items:center;gap:8px;justify-content:space-between}
.agl-side-title{font-size:14.5px;font-weight:700;color:var(--ink);overflow-wrap:anywhere}
.agl-side .b{min-height:40px}
.agl-side .lv-donut{max-width:180px}

/* A12: «أعِد التشغيل»'s sheet — what runs again */
.agl-rr-list{margin:4px 0 12px;padding-inline-start:18px;display:grid;gap:4px;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
.agl-rerun{flex:none}
.agl-result-box.is-lv{padding:0;border:0;background:none}
/* a stopped / unfollowed card is not shell.css's «stopped» pill (.stopped: inline-flex, 20px radius, muted text) — found in
   a real browser: a cancelled card laid its head, files and actions out in one row, wider than a phone */
.run-card.agl-card.stopped{display:block;gap:0;margin:4px 0 10px;padding:0;border-radius:18px;font-size:inherit;color:inherit;background:var(--surface)}
/* A16 (W4 extras): «راجعتُه» / «غير مهم» on every finding, and how many were dealt with */
.agl-marks{display:flex;flex-wrap:wrap;gap:6px}
.agl-mark{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--ink-soft);background:transparent;border:1px solid var(--line)}
.agl-mark .i{width:14px;height:14px}
.agl-mark[aria-pressed="true"]{color:var(--ink);background:color-mix(in srgb,var(--accent-c) 14%,var(--surface));border-color:color-mix(in srgb,var(--accent-c) 55%,var(--line))}
@media (hover:hover){.agl-mark:hover{color:var(--ink);border-color:color-mix(in srgb,var(--ink) 30%,var(--line))}}
.agl-finding.is-reviewed{border-inline-start:4px solid color-mix(in srgb,var(--ok) 70%,var(--line))}
.agl-finding.is-irrelevant > .agl-ftext{color:var(--ink-soft)}
.agl-finding.is-irrelevant{border-inline-start:4px dashed var(--line)}
.agl-marks-n{margin:0;font-size:12.5px;font-weight:700;color:var(--ink-soft)}
@media (forced-colors:active){ .agl-mark[aria-pressed="true"]{border:2px solid Highlight} }
@media print{ .agl-marks{display:none} }
/* wave 5 (N1, A19): a finished job's «تنزيل الكل» / «كل مهام القضية» / «احذف المهمة» — in the job view and the rail */
.agl-acts,.agr-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.agr-acts{padding:2px 0 6px;padding-inline-start:16px}
.agr-acts .b{min-height:32px}
.agl-acts .b,.agr-acts .b{min-height:36px}
.agl-del,.agr-del{color:color-mix(in srgb,var(--danger) 60%,var(--ink))}
.agl-del:hover,.agr-del:hover,.agl-del:focus-visible,.agr-del:focus-visible{background:var(--danger-soft)}
.agl-acts [aria-disabled="true"],.agr-acts [aria-disabled="true"]{opacity:.6;cursor:default;filter:saturate(.4)}
.ws-body:not(.with-files) .agr-acts{display:none}
@media (max-width:420px){ .agl-acts .b{flex:1 1 auto;justify-content:center} }
@media print{ .agl-acts,.agr-acts{display:none} }
@media (forced-colors:active){ .agl-del,.agr-del{color:ButtonText;border:1px solid ButtonText} }