/* My invites. Wears the conference: only --brand-* and neutrals, loaded on /participate/. */
.mi button { touch-action: manipulation; }
.mi { display: grid; gap: 20px; min-width: 0; }
.mi-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px; }
.mi-head h2 { margin: 0 0 4px; }
.mi-head p { margin: 0; max-width: 62ch; line-height: 1.5; }
.mi-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.mi-status { min-height: 22px; margin: -8px 0 -8px; font-size: 14px; font-weight: 600; }
.mi-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin: 0; }
.mi-tile { padding: 16px 18px; border: 1px solid #e0e3e8; border-radius: 14px; background: #fff; }
.mi-tile dt { font-size: 13px; color: #59616c; }
.mi-tile dd { margin: 2px 0 0; font-size: 24px; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.mi-tile dd.is-unknown { margin-top: 6px; font-size: 16px; font-weight: 600; }
.mi-tile p { margin: 6px 0 0; font-size: 13px; line-height: 1.4; color: #59616c; }
.mi-share h3, .mi-list-head h3, .mi-empty h3 { margin: 0 0 8px; }
.mi-share-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid #edf0f4; }
.mi-share-row > div { min-width: 0; }
.mi-share-row button { flex: 0 0 auto; }
.mi-share-label { margin: 0; font-size: 13px; color: #59616c; }
.mi-share-value { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
.mi-share-help { margin: 2px 0 0; font-size: 13px; line-height: 1.4; color: #59616c; }
.mi-messages { margin-top: 12px; }
.mi-messages summary { padding: 10px 0; cursor: pointer; font-weight: 600; }
.mi-message { margin-top: 12px; padding: 14px 16px; border-radius: 12px; background: #f5f6f8; }
.mi-message h4 { margin: 0 0 6px; font-size: 14px; }
.mi-message p { margin: 0 0 10px; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.mi-list-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
.mi-headline { margin: 0; font-size: 14px; color: #59616c; }
.mi-search { flex: 0 1 280px; min-width: 200px; }
.mi-search input { width: 100%; padding: 0 12px; border: 1px solid #cfd4db; border-radius: 10px; background: #fff; }
.mi-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mi-warning { margin: 0; padding: 10px 14px; border-radius: 10px; background: #fff4e0; font-size: 14px; }
.mi-counts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.mi-count { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 2px; width: 100%; height: 100%; min-height: 68px; padding: 10px 12px; text-align: left; }
.mi-count span { font-size: 12px; font-weight: 500; line-height: 1.25; color: #59616c; }
.mi-count strong { font-size: 20px; font-variant-numeric: tabular-nums; }
.mi-board { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; align-items: start; }
.mi-column { min-width: 0; padding: 12px; border-radius: 14px; background: #edf0f4; }
.mi-column h3 { display: flex; justify-content: space-between; gap: 8px; margin: 0 0 10px; font-size: 14px; }
.mi-column ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.mi-column-empty { margin: 0; font-size: 13px; line-height: 1.4; color: #59616c; }
.mi-more { width: 100%; margin-top: 10px; }
.mi-person { display: grid; gap: 6px; padding: 12px; border: 1px solid #e0e3e8; border-radius: 12px; background: #fff; min-width: 0; }
.mi-person p { margin: 0; }
.mi-person-top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 8px; }
.mi-person-top strong { font-size: 14px; overflow-wrap: anywhere; min-width: 0; }
.mi-chip { padding: 1px 8px; border-radius: 999px; background: #edf0f4; font-size: 12px; white-space: nowrap; }
.mi-contact { font-size: 12px; color: #59616c; overflow-wrap: anywhere; }
.mi-used { width: fit-content; padding: 2px 8px; border-radius: 999px; background: #e3f4e8; font-size: 12px; font-weight: 600; }
.mi-next { font-size: 13px; line-height: 1.4; }
.mi-ticks { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 6px; }
.mi-tick { min-height: 44px; padding: 0 8px; font-size: 13px; white-space: nowrap; }
.mi-tick.is-on { background: var(--brand-text, #202225); border-color: var(--brand-text, #202225); color: #fff; }
.mi-tick.is-on:hover { background: var(--brand-text, #202225); }
.mi-person-more { display: flex; justify-content: space-between; gap: 4px; }
.mi-quiet { min-height: 44px; padding: 0 4px; border: 0; background: transparent; font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; color: #59616c; }
.mi-quiet:hover { background: transparent; color: var(--brand-text, #202225); }
.mi-empty { display: grid; gap: 8px; justify-items: start; }
.mi-empty p { margin: 0; line-height: 1.5; }
.mi-empty-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.mi-foot { display: flex; justify-content: flex-end; }
.mi-more-list { display: grid; gap: 12px; margin: 8px 0 0; padding: 0; list-style: none; }
.mi-more-list li { display: grid; grid-template-columns: 130px minmax(0, 1fr); align-items: center; gap: 12px; font-size: 13px; line-height: 1.4; color: #59616c; }
.mi-more-list .mi-tick { color: var(--brand-text, #202225); }
.mi-more-list .mi-tick.is-on { color: #fff; }
.mi-more-list .mi-tick:disabled { opacity: 1; cursor: default; }
.mi-skeleton { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; }
.mi-skeleton span { height: 104px; border-radius: 14px; background: #e6e9ee; }
.mi-privacy { margin: 6px 0 0 !important; font-size: 14px; color: #59616c; }
/* Dragging a person to another column. The drag itself is /shared/kanban-drag.js. */
.mi-person[data-kanban-draggable="true"] { cursor: grab; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.mi-column { transition: background-color 120ms ease; }
.mi-column.is-kanban-drop-target { background: color-mix(in srgb, var(--brand-link, #176d86) 12%, #edf0f4); box-shadow: inset 0 0 0 2px var(--brand-link, #176d86); }
.mi-person.is-kanban-dragging { opacity: .38; outline: 2px dashed color-mix(in srgb, var(--brand-link, #176d86) 60%, transparent); outline-offset: -2px; }
.mi-person.is-kanban-armed { box-shadow: 0 0 0 2px var(--brand-link, #176d86); transform: scale(.985); transition: transform 120ms ease, box-shadow 120ms ease; }
html.is-kanban-dragging, html.is-kanban-dragging * { cursor: grabbing !important; -webkit-user-select: none !important; user-select: none !important; }
[data-kanban-live] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mi-refused { padding: 6px 10px; border-radius: 10px; background: #fff4e0; font-size: 13px; line-height: 1.4; }
.mi-person.is-landed { animation: mi-land 180ms cubic-bezier(.23, 1, .32, 1); }
@keyframes mi-land { from { transform: scale(.97); opacity: .7; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .mi-column, .mi-person.is-kanban-armed { transition: none; } .mi-person.is-landed { animation: none; } }
@media (max-width: 1180px) {
  .mi-board { grid-template-columns: 1fr; }
  .mi-column.is-empty { display: none; }
  .mi-column ul { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
}
@media (max-width: 640px) {
  .mi-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mi-counts li:last-child { grid-column: 1 / -1; }
  .mi-column ul { grid-template-columns: 1fr; }
  .mi-head-actions { width: 100%; }
  .mi-head-actions button { flex: 1 1 0; }
  .mi-search { flex: 1 1 100%; }
  .mi-more-list li { grid-template-columns: 1fr; }
}
