/* ─────────────────────────────────────────────────────────────────────
   Shared work-card language — companion stylesheet to /work-cards.js
   (U1 of docs/plans/2026-07-30-001-feat-brief-pipeline-migration-plan.md).
   The .fl-wcard / .fl-idleb / .fl-lgcard / .fl-qcard card families, moved
   VERBATIM from team.html's floor <style> block — link this wherever the
   script is loaded. Every colour is a page variable (R19): the host page
   must define --bg-card/--bg-input/--border-dim/--border-glow/--accent/
   --accent-bg/--green/--green-bg/--red/--amber/--text-* and --font-mono.
   ───────────────────────────────────────────────────────────────────── */
/* Working cards (Queued+Working redesign 2026-07-29): the machine-card grid
   and the separate lane accordions MERGED into ONE card list — an agent and
   its live work share a .fl-wcard. .run reads ACCENT (liveness — the green
   done-and-healthy feel lives on .fl-lgcard.ok); idle agents carry NO card
   (they fold into the .fl-idleb strip below). */
.fl-wcard{background:var(--bg-card);border:1px solid var(--border-dim);border-radius:11px;padding:8px 10px;margin-bottom:7px;display:flex;gap:9px}
.fl-wcard.run{border-color:var(--accent);background:linear-gradient(180deg,var(--accent-bg),var(--bg-card))}
.fl-wcard.err{border-color:var(--red)} /* U7 tokens (see block comment) */
.fl-wav{width:28px;height:28px;border-radius:50%;flex:none;overflow:hidden;background:var(--bg-input);border:1px solid var(--border-glow);display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:10px;color:var(--accent);position:relative}
.fl-wav img{width:100%;height:100%;object-fit:cover}
.fl-wcard.run .fl-wav{border-color:var(--accent);color:var(--accent)}
.fl-wcard.run .fl-wav::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid var(--accent);opacity:.5;animation:flPulse 1.9s ease-out infinite}
@keyframes flPulse{0%{transform:scale(.85);opacity:.55}100%{transform:scale(1.28);opacity:0}}
@media (prefers-reduced-motion:reduce){.fl-wcard.run .fl-wav::after{animation:none}}
.fl-wbody{min-width:0;flex:1}
.fl-mn{font-size:12px;font-weight:700;display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--text-primary)}
.fl-mst{font-family:var(--font-mono,monospace);font-size:8.5px;letter-spacing:.05em;text-transform:uppercase;padding:1px 6px;border-radius:5px;background:var(--bg-input);color:var(--text-muted)}
.fl-mst.run{background:var(--accent-bg);color:var(--accent)}
.fl-mst.nosig{background:var(--amber-bg);color:var(--amber)}
.fl-mst.err{background:var(--red-bg);color:var(--red)} /* U7 tokens (see block comment) */
.fl-mtask{font-size:10.5px;color:var(--text-secondary);margin-top:3px;line-height:1.45;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* one compact line per working item ON the card (title + kind tag chip).
   Item 8 (Ore feedback batch): the line is a flex-wrap shell now — the
   .fl-wlbtn expand button + the .fl-copy button share the row, the
   .fl-lgbody drill-in wraps to the full width below. */
.fl-wline{display:flex;flex-wrap:wrap;align-items:center;margin-top:3px;min-width:0}
.fl-wlbtn{display:flex;flex:1 1 0;min-width:0;align-items:center;gap:6px;background:transparent;border:0;padding:0;cursor:pointer;font-family:inherit;color:inherit;text-align:left;font-size:inherit}
.fl-wtxt{font-size:10.5px;color:var(--text-secondary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* agentless work cards keep the bold-lede card language (redesign item 3) */
.fl-wlede{font-size:11.5px;font-weight:700;color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fl-wline .fl-lgtag,.fl-wline .fl-lgst,.fl-wline .fl-ls{flex:none}
/* the idle strip (redesign item 4): idle agents get NO cards — one folded
   row (the heartbeat fold's idiom) expanding to a mini-roster. NO SIGNAL
   rides the SAME strip but distinct (R14): muted row + dashed amber label —
   never drawn as resting. */
.fl-idleb{display:block;width:100%;text-align:left;background:transparent;border:0;border-top:1px dashed var(--border-dim);color:var(--text-muted);font-size:10.5px;cursor:pointer;margin-top:10px;padding:8px 0 2px;font-family:inherit}
.fl-idleb:hover{color:var(--accent)}
.fl-idlerow{display:flex;align-items:center;gap:7px;padding:3px 0;font-size:11px;color:var(--text-secondary)}
.fl-idlerow.nosig{opacity:.55}
.fl-nosiglbl{font-size:8.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--amber);border:1px dashed var(--amber);border-radius:5px;padding:0 5px;margin-left:auto;flex:none}
.fl-idleage{margin-left:auto;font-family:var(--font-mono,monospace);font-size:9.5px;color:var(--text-muted);flex:none}
/* amber stall word on Working card lines (was the accordion stat bit) */
.fl-ls{color:var(--amber);font-weight:700}
/* item 1 (Ore batch 2026-07-29): the work line's muted last-activity stamp —
   SECONDARY to the LIVE state by design (mono, small, muted). */
.fl-wage{flex:none;font-family:var(--font-mono,monospace);font-size:9.5px;color:var(--text-muted);white-space:nowrap}
/* quiet-thread fold (Ore's 4h ruling): the idle strip's exact treatment —
   its own class so the two folds toggle independently. Rows carry the small
   avatar + the shared work line + the last-heard age. */
.fl-quietb{display:block;width:100%;text-align:left;background:transparent;border:0;border-top:1px dashed var(--border-dim);color:var(--text-muted);font-size:10.5px;cursor:pointer;margin-top:10px;padding:8px 0 2px;font-family:inherit}
.fl-quietb:hover{color:var(--accent)}
.fl-quietbody[hidden]{display:none}
.fl-qtrow{display:flex;align-items:center;gap:7px;padding:3px 0;font-size:11px;color:var(--text-secondary)}
.fl-qtrow .fl-qtline{flex:1;min-width:0}
.fl-qtrow .fl-qtline .fl-wline{margin-top:0}
.fl-qtrow>.fl-idleage{margin-left:0}
/* Ledger CARDS (Completed-lane redesign, 2026-07-29): .fl-lgcard is the
   machine spine — avatar LEFT, body right, and the status slot (where a
   Working card shows a RUNNING badge) carries the KIND TAG. HEIGHT:
   ~3/5 of the old .fl-lg text rows — the ≤80-char bold headline is the
   whole card face (the detail moved into the drill-in), so 6px vertical
   padding + a one-line 11.5px title lands the card at roughly three-fifths
   of the old wrapped-text row blocks. GREEN LIVES HERE NOW: ok-health cards
   wear the old running green edge + tint — done-and-healthy is the
   success state (running is liveness and reads accent on .fl-wcard.run). */
/* Item 9: every card family is a flex-wrap shell — expand button + copy
   button share the top row (buttons never nest), the drill-in body wraps
   below at full width. */
.fl-lgcard{background:var(--bg-card);border:1px solid var(--border-dim);border-radius:11px;margin-bottom:7px;overflow:hidden;display:flex;flex-wrap:wrap;align-items:center}
.fl-lgcard.ok{border-color:var(--green);background:linear-gradient(180deg,var(--green-bg),var(--bg-card))}
.fl-lgcard.bad{border-color:var(--red)}
.fl-lgcard.warn{border-color:var(--amber)}
.fl-lgcbtn{display:flex;flex:1 1 0;min-width:0;align-items:center;gap:8px;text-align:left;background:transparent;border:0;padding:6px 9px;cursor:pointer;font-family:inherit;color:var(--text-primary)}
.fl-lgcbtn:hover{background:var(--bg-input)}
.fl-lgcavs{display:inline-flex;align-items:center;flex:none}
.fl-lgcav{width:24px;height:24px;border-radius:50%;flex:none;overflow:hidden;background:var(--bg-input);border:1px solid var(--border-glow);display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:9px;color:var(--accent)}
.fl-lgcard.ok .fl-lgcav{border-color:var(--green);color:var(--green)}
/* roster-chip minis: up to 3 small overlapping faces after the primary */
.fl-lgmini{width:15px;height:15px;border-radius:50%;flex:none;overflow:hidden;background:var(--bg-input);border:1.5px solid var(--bg-card);margin-left:-5px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:6.5px;color:var(--accent)}
.fl-lgcav img,.fl-lgmini img,.fl-lgav img{width:100%;height:100%;object-fit:cover}
.fl-lgcbody{flex:1;min-width:0;display:flex;align-items:center;gap:6px;flex-wrap:nowrap}
/* The headline renders FULL and clips via single-line ellipsis only on real
   overflow (the JS ~80 hard cut on ledes is gone — chips stay flex:none, the
   nowrap body row lets the min-width:0 headline shrink instead of wrapping) */
.fl-lgcn{font-size:11.5px;font-weight:700;line-height:1.35;color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* the KIND TAG rides the status slot — .fl-mst's exact idiom */
.fl-lgtag{font-family:var(--font-mono,monospace);font-size:8.5px;letter-spacing:.05em;text-transform:uppercase;padding:1px 6px;border-radius:5px;background:var(--bg-input);color:var(--text-muted);flex:none}
.fl-lgav{width:20px;height:20px;border-radius:50%;flex:none;overflow:hidden;background:var(--bg-input);border:1px solid var(--border-glow);display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:8px;color:var(--accent)}
.fl-lgn{background:var(--accent-bg);color:var(--accent);border-radius:999px;padding:1px 7px;font-size:8.5px;font-weight:800;letter-spacing:.03em;flex:none}
.fl-lgst{color:var(--red);font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.fl-lgcard.warn .fl-lgst{color:var(--amber)}
.fl-lgcar{color:var(--text-muted);margin-left:auto}
.fl-lgbody{flex-basis:100%;padding:2px 10px 8px 24px;border-top:1px dashed var(--border-dim)}
.fl-lgbody[hidden]{display:none}
.fl-lgdet{font-size:10.5px;color:var(--text-secondary);line-height:1.5;margin:4px 0 6px}
/* Item 7: the queued drill-in's meta line (timing · agents · kind · refs) */
.fl-qmeta{font-size:9.5px;color:var(--text-muted);font-family:var(--font-mono,monospace);margin-top:2px}
/* Item 9: the copy-for-chat button — quiet stroke icon, green 'Copied' flash.
   Compact: ~12px glyph in an ~18px hit area, and QUIET until the card is
   engaged — .35 opacity resting, full on card :hover/:focus-within (and on
   the button's own hover/focus/copied states, so keyboard users and the
   flash never lose it). The title= a11y label is unchanged.
   Review fix (2026-07-30): .copied is the RESOLVED-write state only. When the
   Clipboard API is absent or the write rejects, WorkCards.copyToClipboard
   flashes .copyfail instead — red, with a title= that says the copy failed and
   points at selecting the text. Colour is never the only signal: the title=
   swap carries the same word either way. */
.fl-copy{flex:none;background:transparent;border:0;color:var(--text-muted);cursor:pointer;width:18px;height:18px;padding:0;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;opacity:.35;transition:opacity .15s ease}
.fl-qcard:hover .fl-copy,.fl-qcard:focus-within .fl-copy,
.fl-wcard:hover .fl-copy,.fl-wcard:focus-within .fl-copy,
.fl-lgcard:hover .fl-copy,.fl-lgcard:focus-within .fl-copy,
.fl-copy:hover,.fl-copy:focus-visible,.fl-copy.copied,.fl-copy.copyfail{opacity:1}
.fl-copy:hover{color:var(--accent)}
.fl-copy svg{width:12px;height:12px}
.fl-copy.copied{color:var(--green)}
.fl-copy.copyfail{color:var(--red)}
/* Queued cards (Queued+Working redesign 2026-07-29): the card LANGUAGE of
   .fl-lgcard (avatar · bold lede · kind tag — same spine, same ~height) with
   the lane's own EMPHASIS: WHEN. The timing is the prominent right-side
   element — 'next 8pm' (scheduled) reads accent, 'waiting 2d' (arrived)
   reads muted. The avatar keeps the avatars-everywhere loop closed (old
   item 7 — the raw queued row's small face moved onto the card). */
.fl-qcard{background:var(--bg-card);border:1px solid var(--border-dim);border-radius:11px;margin-bottom:7px;display:flex;flex-wrap:wrap;align-items:center;overflow:hidden}
.fl-qcard.bad{border-color:var(--red)}
.fl-qcard.warn{border-color:var(--amber)}
/* Item 7: the card face is the expand button now (the ledger drill-in
   pattern) — same 6px 9px padding the old flat card carried. */
.fl-qcbtn{display:flex;flex:1 1 0;min-width:0;align-items:center;gap:8px;text-align:left;background:transparent;border:0;padding:6px 9px;cursor:pointer;font-family:inherit;color:var(--text-primary)}
.fl-qcbtn:hover{background:var(--bg-input)}
/* Item 7: the queued lede reads NORMAL weight (500) — Queued is the waiting
   lane, not the outcome lane; only .fl-lgcard's headline keeps 700. */
.fl-qcbtn>.fl-lgcn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.fl-qcard.warn .fl-lgst{color:var(--amber)}
.fl-qwhen{margin-left:auto;flex:none;font-family:var(--font-mono,monospace);font-size:9.5px;font-weight:700;color:var(--accent);white-space:nowrap}
.fl-qwhen.wait{color:var(--text-muted)}

/* ── Stat tiles (workflows U10 — WorkCards.statTile/statTiles) ────────
   The shared tile family: a responsive auto-fit row of value/label/sub
   tiles. Tone classes tint the VALUE only (the tile chrome stays house). */
.wc-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:18px}
.wc-tile{display:flex;flex-direction:column;gap:2px;background:var(--bg-card);border:1px solid var(--border-dim);border-radius:var(--radius,12px);padding:14px 16px;text-decoration:none;color:inherit;transition:border-color .15s}
a.wc-tile:hover{border-color:var(--border-glow)}
.wc-tile-v{font-family:var(--font-display,inherit);font-size:24px;font-weight:800;color:var(--text-primary);line-height:1.15}
.wc-tile-l{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.wc-tile-s{font-size:10.5px;color:var(--text-secondary)}
.wc-tile-ok .wc-tile-v{color:var(--green)}
.wc-tile-warn .wc-tile-v{color:var(--amber)}
.wc-tile-bad .wc-tile-v{color:var(--red)}
