/* Needs you, at the top of Your sessions (Chris, 30 Oct: the look he approved, https://claude.ai/artifact/PSdfW7gdX2c7ZBxXAwUuog).
   Each session's row as everywhere else, its open tasks under it in the same card, and one main pot button. */
.need-group .need-cards { display: grid; gap: 10px; margin: 0 0 10px; }
.need-cards:empty { display: none; }
.need-item { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; }
.need-item .mine-row { border: 0; background: transparent; box-shadow: none; }
.need-body { display: grid; gap: 6px; padding: 0 14px 12px 20px; }
.need-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; font-size: 13.5px; color: var(--muted); }
.mine-pill.need-needs { background: var(--warn); color: #1c1407; }
.mine-pill.need-left { background: var(--gold); color: #1c1407; }
.mine-pill.need-cut { background: var(--stop); color: #1c0707; }
/* Its row says only its name, where and when: the pill below says how it stands. */
.need-item .mine-row-tag, .need-item .mine-row-meta .mine-pill { display: none; }
.need-tasks { list-style: none; margin: 0; padding: 0; display: grid; }
.need-tasks li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--line); font-size: 14px; }
.need-tasks li:first-child { border-top: 0; }
.need-task { min-width: 0; overflow-wrap: anywhere; }
.need-task small { display: block; color: var(--faint); font-size: 12px; }
button.need-x, button.need-more { min-height: 32px; padding: 4px 6px; background: none; border: 0; box-shadow: none; text-shadow: none; font: 600 12.5px var(--font); color: var(--faint); }
button.need-more { color: var(--gold); margin-right: auto; }
button.need-x.sure { color: var(--stop); }
.need-acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
/* The proposal card is dark glass in either theme (attach.css): its words stay light on it here too. */
.need-cards .work-proposal { color: #f3f1ed; }
.need-cards .work-proposal h4 { color: #f3f1ed; }
.need-cards .work-proposal-text, .need-cards .work-proposal .meta { color: #cfc6b8; }
.need-cards .work-proposal-kind { color: #e5af4f; }
/* A desk card shows its first lines; Read all opens the whole brief (work.js deskCard). */
.need-cards .work-proposal.open .work-proposal-text { max-height: none; -webkit-mask-image: none; mask-image: none; }
/* The studio's health, one quiet line under Needs you; a tap lists its faults (mine.js healthLine). */
.need-health-box { margin: -14px 0 18px; }
button.need-health { min-height: 32px; padding: 4px 2px; background: none; border: 0; box-shadow: none; text-shadow: none; font: 600 13px var(--font); color: var(--muted); }
button.need-health::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--ok); }
.need-health-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; }
.need-health-list li { padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); font-size: 14px; overflow-wrap: anywhere; }
.need-health-list small { display: block; color: var(--faint); font-size: 12px; }
.need-tasks li[hidden] { display: none; }
/* What a waiting session needs him to decide, as the delivery check read it (mine.js gateCard): the question, then the replies to tap. */
.mine-gate { display: grid; gap: 8px; margin: -2px 0 10px; padding: 10px 14px 12px 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
.mine-gate-q { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.mine-gate-replies { display: flex; flex-wrap: wrap; gap: 8px; }
.mine-gate-replies button { max-width: 100%; white-space: normal; text-align: left; }