/* One finish card for every create (js/ui/finish-card.js, review L4,
   2026-10-17). The meeting's share step uses the same .fc-* look. */
.fc { display: flex; flex-direction: column; gap: 12px; }
.fc-head { display: flex; align-items: flex-start; gap: 12px; }
.fc-tick { flex: none; width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: var(--primary-50, #f0fdfa); color: var(--primary-600, #0d9488); font-size: 22px; }
.fc-words { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fc-heading { margin: 0; font-size: 18px; font-weight: 800; color: var(--text-primary, #0f172a); }
.fc-sub { margin: 0; font-size: 13.5px; color: var(--text-secondary, #475569); }
/* One finish (2026-10-21): the state in one word, what happens next in one line. */
.fc-state { display: inline-block; vertical-align: middle; margin-left: 0; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 700;
  background: var(--primary-50, #f0fdfa); border: 1px solid var(--primary-200, #99f6e4); color: var(--primary-800, #115e59); }
.fc-next { margin: 2px 0 0; font-size: 13.5px; color: var(--text-primary, #0f172a); }
body.dark-mode .fc-state { background: rgba(20, 184, 166, 0.14); border-color: #0f766e; color: #ccfbf1; }
body.dark-mode .fc-next { color: var(--slate-200, #e2e8f0); }
.fc-link { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--slate-200, #e2e8f0); background: var(--slate-50, #f8fafc); min-width: 0; }
.fc-url { display: block; font-family: ui-monospace, Consolas, monospace; font-size: 13px; color: var(--text-primary, #0f172a);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fc-copy { min-height: 48px; width: 100%; justify-content: center; font-weight: 700; }
.fc-copy.is-copied { background: var(--primary-700, #0f766e); }
.fc-row { display: flex; flex-wrap: wrap; gap: 8px; }
.fc-row > .btn { flex: 1 1 140px; min-height: 44px; justify-content: center; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.fc-more[hidden] { display: none; }
.fc-done { align-self: center; min-height: 44px; font-weight: 700; }
body.dark-mode .fc-link { background: var(--slate-800, #1e293b); border-color: var(--slate-600, #475569); }
body.dark-mode .fc-heading, body.dark-mode .fc-url { color: var(--slate-100, #f1f5f9); }
body.dark-mode .fc-tick { background: rgba(20, 184, 166, 0.14); color: #5eead4; }
/* The meeting's share step, on the same card (session-board-modal.js). */
#temp-group-modal .temp-group-share-actions.fc-row .btn { flex: 1 1 140px; }
#temp-group-modal .temp-group-more { margin-top: 4px; border-top: 1px solid var(--slate-200, #e2e8f0); padding-top: 8px; }
#temp-group-modal .temp-group-more > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer;
  font-weight: 700; color: var(--primary-700, #0f766e); list-style: none; }
#temp-group-modal .temp-group-more > summary::-webkit-details-marker { display: none; }
#temp-group-modal .temp-group-more > summary::after { content: "▾"; margin-left: 6px; font-size: 12px; }
#temp-group-modal .temp-group-more[open] > summary::after { content: "▴"; }
#temp-group-modal .temp-group-share-filled { margin: 4px 0 0; font-size: 13.5px; color: var(--text-secondary, #475569); }
#temp-group-modal .temp-group-title-change { min-height: 44px; margin: 0; padding: 0 4px; border: 0; background: none;
  font: inherit; font-weight: 700; color: var(--primary-700, #0f766e); text-decoration: underline; cursor: pointer; }
#temp-group-modal .temp-group-title-edit { display: flex; gap: 8px; align-items: center; }
#temp-group-modal .temp-group-title-edit input { flex: 1 1 auto; min-height: 44px; font-size: 16px; }