.app-dialog.is-persona-picker { width:min(820px,calc(100vw - 32px)); max-height:calc(var(--visible-height,100dvh) - 32px); }
.is-persona-picker .dialog-heading { padding:22px 26px 16px; }
.is-persona-picker .dialog-heading h2 { font-size:22px; }
.is-persona-picker .dialog-body { padding:0 26px 26px; overflow-y:auto; overscroll-behavior:contain; column-count:auto; column-width:auto; }
.is-persona-picker .dialog-footer,.is-persona-picker .dialog-pagination { display:none; }
.dialog-body .persona-picker-intro { margin:0 0 18px; color:#786858; font-size:13px; line-height:1.8; }
.persona-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.persona-card { display:grid; grid-template-columns:88px minmax(0,1fr); gap:14px; align-items:center; width:100%; min-height:144px; padding:12px; text-align:left; color:#3c3028; background:#fffaf13d; border:1px solid #967a5430; border-radius:8px; transition:background .18s,border-color .18s; }
.persona-card:not(:has(img)) { grid-template-columns:minmax(0,1fr); }
.persona-card:hover { background:#fffaf1b3; border-color:#967a5466; }
.persona-card:focus-visible { outline:2px solid #8d674a; outline-offset:2px; }
.persona-card[aria-pressed="true"] { border-color:#98704f; background:#fff8eeb3; }
.persona-portrait { display:block; width:88px; height:116px; border-radius:4px; object-fit:cover; object-position:50% 30%; mix-blend-mode:multiply; }
.persona-card-copy { min-width:0; }
.persona-card-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:3px 10px; }
.persona-card-name { font-size:19px; font-weight:500; line-height:1.5; letter-spacing:1px; }
.persona-card-selected { color:#8a6144; font-size:10px; white-space:nowrap; }
.persona-card-introduction { display:block; margin-top:6px; font-size:12px; line-height:1.8; color:#6e5e50; }
.persona-topics { display:flex; flex-wrap:wrap; gap:3px 8px; margin-top:9px; padding-top:7px; border-top:1px solid #967a5424; font-size:11px; line-height:1.6; color:#896849; }
.pwa-mode .app-dialog.is-persona-picker[open] { top:calc(var(--visible-top,0px) + 12px); height:auto; max-height:calc(var(--visible-height,100dvh) - 24px); }
.pwa-mode .is-persona-picker .dialog-body { flex:0 1 auto; height:auto; min-height:0; overflow-y:auto; column-count:auto; column-width:auto; }
@media(max-width:600px) {
  .app-dialog.is-persona-picker { width:calc(100vw - 24px); }
  .is-persona-picker .dialog-heading { padding:16px 16px 12px; }
  .is-persona-picker .dialog-heading h2 { font-size:20px; }
  .is-persona-picker .dialog-body { padding:0 14px 18px; }
  .dialog-body .persona-picker-intro { margin-bottom:14px; font-size:12px; }
  .persona-grid { gap:10px; }
  .persona-card { grid-template-columns:minmax(0,1fr); gap:8px; align-content:start; padding:10px; }
  .persona-portrait { width:100%; height:132px; object-position:50% 10%; }
  .persona-card-name { font-size:17px; letter-spacing:.5px; }
  .persona-card-introduction { font-size:12px; line-height:1.7; }
  .persona-topics { gap:2px 6px; margin-top:8px; padding-top:6px; font-size:10px; }
}
@media(max-width:350px) { .persona-portrait { height:110px; } .persona-card { padding:8px; } }
@media(prefers-reduced-motion:reduce) { .persona-card { transition:none; } }
