/* écran 08 — Intervenants et invitations ; « Qui voit quoi » */
.iv-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 420px; align-items: start; min-height: 100vh; }
.iv-main { padding: 28px 32px 48px; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.iv-head .sup { font-size: 12.5px; color: var(--muted); }
.iv-head h1 { font-weight: 500; font-size: 30px; margin-top: 4px; }
.iv-list { overflow: hidden; }
.iv-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) 170px minmax(0, 1.1fr) 120px; gap: 14px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--line-soft-2); }
.iv-row.clickable { cursor: pointer; } .iv-row.clickable:hover { background: var(--surface-2); }
.iv-row.sel { background: var(--select); box-shadow: inset 3px 0 0 var(--blue); align-items: start; }
.iv-row.inv { background: var(--surface-2); }
.iv-name .n { font-size: 14.5px; font-weight: 600; } .iv-name .m { font-size: 12.5px; color: var(--meta); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; }
.iv-role { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; } .iv-role > span:last-child { font-size: 11.5px; color: var(--meta); }
.iv-sees { font-size: 13px; line-height: 1.45; color: var(--text-2); }
.iv-state { text-align: right; font-size: 12.5px; color: var(--muted); } .iv-state.wait { color: var(--wait-fg); }
.iv-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.iv-revoked, .iv-tip { padding: 11px 20px; font-size: 12.5px; color: var(--meta); }
.iv-revoked { border-bottom: 1px solid var(--line-soft-2); }
.mx { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); font-size: 13px; }
.mx-h { padding: 10px 14px; font-size: 11px; text-transform: uppercase; letter-spacing: .07em; color: var(--label); font-weight: 700; border-bottom: 1px solid var(--line-soft); }
.mx-h:first-child { padding-left: 20px; }
.mx-l { padding: 11px 20px; border-bottom: 1px solid var(--line-soft-2); font-weight: 500; }
.mx-c { display: flex; gap: 8px; align-items: baseline; padding: 11px 14px; border-bottom: 1px solid var(--line-soft-2); color: var(--steel); }
.mx-c .off { color: var(--faint); }
.mx-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; transform: translateY(-1px); }
.mx-dot.y { background: var(--steel); } .mx-dot.p { background: #fff; border: 2px solid var(--steel); } .mx-dot.n { background: #fff; border: 1.5px solid var(--faint-3); }
.iv-panel { position: sticky; top: 0; min-height: 100vh; background: var(--surface); border-left: 1px solid var(--line); padding: 28px 28px 40px; }
.with-admin .iv-panel { top: 38px; min-height: calc(100vh - 38px); }
.iv-panel h2 { font-weight: 500; font-size: 26px; margin-bottom: 20px; }
.iv-roles { display: flex; flex-direction: column; gap: 8px; }
.iv-rc { display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start; text-align: left; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; }
.iv-rc b { display: block; font-size: 14.5px; font-weight: 600; color: var(--ink); } .iv-rc span span { display: block; font-size: 13px; line-height: 1.45; color: var(--muted); margin-top: 2px; }
.iv-rc em { display: block; font-style: normal; font-size: 12px; line-height: 1.45; color: var(--wait-fg); margin-top: 6px; }
.iv-rc .radio { width: 15px; height: 15px; border-radius: 50%; border: 1.5px solid var(--faint-3); margin-top: 2px; background: #fff; }
.iv-rc.on { border-color: var(--blue); background: var(--select); box-shadow: 0 0 0 1px var(--blue); } .iv-rc.on .radio { border: 4.5px solid var(--blue); }
.iv-rc.dis { cursor: not-allowed; background: var(--surface-2); } .iv-rc.dis b { color: var(--muted); }
.iv-summary { margin: 4px 0 16px; padding: 12px 14px; border-radius: 10px; background: var(--soft-2); font-size: 13px; line-height: 1.55; color: var(--text-2); }
.iv-approve { border-color: var(--wait-dot); }
.iv-client { max-width: 1120px; }
.iv-lead { font-size: 19px; line-height: 1.6; color: var(--text-2); max-width: 64ch; margin: -8px 0 22px; }
.iv-safe { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px; border-radius: 12px; background: var(--soft); font-size: 13.5px; line-height: 1.5; color: var(--text-2); }
@media (max-width: 1180px) { .iv-wrap { grid-template-columns: minmax(0, 1fr); } .iv-panel { position: static; min-height: 0; border-left: 0; border-top: 1px solid var(--line); } }
@media (max-width: 860px) {
  .iv-main { padding: 18px 16px 32px; }
  .iv-row { grid-template-columns: 36px minmax(0, 1fr); } .iv-role, .iv-sees, .iv-state { grid-column: 2; text-align: left; }
  .mx { font-size: 12px; grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(0, 1fr)); } .mx-l, .mx-c, .mx-h { padding: 9px 8px; } .mx-h:first-child { padding-left: 8px; }
}

/* invitation par le propriétaire, dans « Qui voit quoi » : le panneau devient une carte */
.iv-owner-invite .iv-panel { position: static; min-height: 0; border: 1px solid var(--line); border-radius: 12px; }