.who-pack-preview { min-width:0; min-height:110px; margin-top:12px; font-size:.8rem; }
.who-pack-samples { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.who-pack-samples figure { min-width:0; margin:0; padding:5px; border:1px solid var(--who-border,var(--line,#ddd)); border-radius:6px; text-align:center; }
.who-pack-samples img { display:block; width:100%; height:64px; object-fit:contain; margin-bottom:5px; }
.who-pack-samples figcaption { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; line-height:1.3; }
.who-pack-samples .is-text { min-height:98px; display:grid; align-items:center; }
.who-pack-samples .is-text figcaption { -webkit-line-clamp:4; }
.who-pack-preview > button { display:block; margin-top:8px; padding:8px; border:1px solid var(--who-border,var(--line,#ddd)); border-radius:6px; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.who-pack-credits { margin-top:8px; font-size:.75rem; overflow-wrap:anywhere; }
.who-pack-credits summary { cursor:pointer; }
.who-pack-credits a { color:inherit; text-decoration:underline; }
.community-card > .who-pack-preview { grid-column:1 / -1; }
@media (max-width:480px) {
  .who-pack-samples { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  .who-pack-samples > figure:nth-child(n+4) { display:none; }
  .who-pack-samples figure { padding:3px; }
  .who-pack-samples img { height:54px; }
}

.who-board-preview { width:min(880px,calc(100vw - 28px)); max-height:calc(100dvh - 32px); margin:auto; padding:0; border:1px solid var(--who-border,var(--line,#ddd)); border-radius:8px; background:var(--who-panel,var(--surface,#fff)); color:var(--who-ink,var(--text,#1a202c)); font:inherit; }
.who-board-preview[open] { display:flex; flex-direction:column; }
.who-board-preview::backdrop { background:rgba(0,0,0,.6); }
.who-board-preview header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px; border-bottom:1px solid var(--who-border,var(--line,#ddd)); }
.who-board-preview h2 { margin:0; font:800 1.2rem/1.4 'Nunito',sans-serif; overflow-wrap:anywhere; min-width:0; }
.who-board-preview button { min-height:44px; padding:8px 12px; border:1px solid var(--who-border,var(--line,#ddd)); border-radius:6px; color:inherit; background:transparent; font:700 .85rem/1.4 'Nunito',sans-serif; cursor:pointer; flex-shrink:0; }
.who-board-preview button:hover { background:var(--who-soft,var(--surface-2,#eee)); }
.who-board-preview button:focus-visible { outline:2px solid var(--who-accent,var(--accent)); outline-offset:2px; }
.who-board-preview-content { overflow:auto; overscroll-behavior:contain; padding:16px; margin:0; min-height:110px; }
.who-pack-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); align-items:stretch; gap:12px; }
.who-pack-grid figure { margin:0; padding:8px; border:1px solid var(--who-border,var(--line,#ddd)); border-radius:6px; min-width:0; text-align:center; }
.who-pack-grid img { display:block; width:100%; height:128px; object-fit:contain; margin-bottom:8px; }
.who-pack-grid figcaption { font-size:.9rem; line-height:1.4; overflow-wrap:anywhere; }
.who-pack-grid .is-text { display:grid; place-items:center; min-height:112px; }
@media (max-width:480px) {
  .who-board-preview header { gap:12px; padding:12px; }
  .who-board-preview-content { padding:12px; }
  .who-pack-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
}