.group-profile-backdrop { position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center; padding:24px; background:#091a3b80; backdrop-filter:blur(8px); }
.aona-app .group-profile[role=dialog] {
  --profile-bg:#fffef9; --profile-ink:#0b163d; --profile-muted:#627da9; --profile-line:#dbe3ef;
  --profile-pill:#eaf1ff; --profile-pill-text:#244993; --profile-highlight:#dbe7ff;
  display:flex; flex-direction:column; width:100%; max-width:560px; max-height:calc(100dvh - 48px);
  overflow:hidden; border:1px solid #e4e8ef; border-radius:23px; background:var(--profile-bg);
  color:var(--profile-ink); box-shadow:0 22px 80px #07173830;
}
.aona-app .group-profile-dark[role=dialog] {
  --profile-bg:#08132f; --profile-ink:#fffaf0; --profile-muted:#9ab3df; --profile-line:#294676;
  --profile-pill:#132b58; --profile-pill-text:#f7f6ee; --profile-highlight:#1b3b72;
  color-scheme:dark; border-color:#31539a; background:var(--profile-bg) url('../assets/images/group-profile-night-surface.webp') center/cover;
  box-shadow:inset 0 0 0 1000px #07122a55,0 22px 80px #02091c55;
}
.group-profile-scroll { overflow-y:auto; overscroll-behavior:contain; min-height:0; scrollbar-width:thin; scrollbar-color:var(--profile-line) transparent; }
.group-profile-scroll::-webkit-scrollbar { width:5px; }
.group-profile-scroll::-webkit-scrollbar-thumb { background:var(--profile-line); border-radius:999px; }
.group-profile-scroll::-webkit-scrollbar-button { display:none; }
.group-profile-topbar { display:flex; justify-content:flex-end; height:44px; padding:12px 12px 0; }
.group-profile-close { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; border:0; border-radius:50%; background:transparent; color:var(--profile-muted); }
.group-profile-close:hover { background:var(--profile-pill); color:var(--profile-ink); }
.group-profile-content { padding:10px 22px 0; text-align:center; }
.group-profile-identity { position:relative; display:flex; justify-content:center; min-height:152px; margin-bottom:19px; }
.group-profile-avatar { display:block; width:152px; height:152px; flex-shrink:0; object-fit:cover; border-radius:50%; padding:5px; border:2px solid #c3d9f7; background:var(--profile-bg); }
.group-profile-save { position:absolute; right:0; top:20px; display:flex; align-items:center; justify-content:center; gap:7px; min-height:44px; border:1px solid #c4d6f4; border-radius:999px; padding:10px 16px; background:transparent; color:#47638e; font-size:13px; }
.group-profile-save:hover,.group-profile-save[aria-pressed=true] { background:var(--profile-pill); color:var(--profile-pill-text); }
.group-profile-category { margin:0 0 9px; font-size:12px; font-weight:650; letter-spacing:.25em; text-transform:uppercase; color:#6a98da; }
.aona-app .group-profile[role=dialog] h2 { max-width:100%; margin:0 auto; font-size:39px; font-weight:650; line-height:1.14; letter-spacing:-1.1px; overflow-wrap:anywhere; text-wrap:balance; }
.group-profile-meta { display:flex; justify-content:center; flex-wrap:wrap; gap:6px 12px; margin-top:11px; font-size:14px; line-height:1.5; color:var(--profile-muted); overflow-wrap:anywhere; }
.group-profile-description { margin:15px auto 18px; font-size:15px; line-height:1.65; white-space:pre-line; overflow-wrap:anywhere; text-wrap:pretty; }
.group-profile-tags { display:flex; justify-content:center; flex-wrap:wrap; gap:7px 10px; margin:0 0 22px; }
.group-profile-tags button { min-height:36px; max-width:100%; border:1px solid transparent; border-radius:999px; padding:8px 15px; background:var(--profile-pill); color:var(--profile-pill-text); font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.group-profile-tags button:hover { background:var(--profile-highlight); }
.group-profile-engagement { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 12px; padding:12px 0; border-block:1px solid var(--profile-line); }
.group-profile-votes { display:flex; align-items:center; gap:2px; }
.group-profile-votes button { display:flex; align-items:center; justify-content:center; gap:7px; min-width:60px; min-height:44px; padding:8px; border:0; border-radius:9px; background:transparent; color:var(--profile-ink); font-size:13px; }
.group-profile-votes button:first-child svg { color:#ae741d; }
.group-profile-votes button:last-child svg { color:#e83d5d; }
.group-profile-votes button[aria-pressed=true],.group-profile-votes button:hover { background:var(--profile-pill); }
.group-profile-vote-divider { flex-shrink:0; height:16px; width:1px; margin-inline:7px; background:var(--profile-line); }
.group-profile-utilities { display:flex; align-items:center; gap:3px; }
.group-profile-share,.group-profile-copy { display:flex; align-items:center; justify-content:center; gap:7px; min-height:44px; border:0; border-radius:9px; padding:8px; background:transparent; color:#47638e; font-size:13px; }
.group-profile-share:hover,.group-profile-copy:hover { background:var(--profile-pill); }
.group-profile-footer { flex-shrink:0; padding:14px 22px 21px; }
.group-profile-join { display:flex; align-items:center; justify-content:center; gap:14px; width:100%; min-height:58px; border:0; border-radius:12px; padding:14px 18px; color:#fff; background:#123eae; font-size:15px; font-weight:650; }
.group-profile-join:hover { background:#0b3198; }
.group-profile-note { margin:13px 0 0; color:var(--profile-muted); text-align:center; font-size:11px; line-height:1.6; }
.group-profile-dark .group-profile-identity { min-height:140px; margin-bottom:15px; }
.group-profile-dark .group-profile-avatar { width:140px; height:140px; padding:0; border:5px solid #294f9c; }
.group-profile-dark .group-profile-category { color:#adcfff; }
.aona-app .group-profile-dark[role=dialog] h2 { max-width:310px; font-size:40px; font-weight:600; line-height:1.08; letter-spacing:.1px; }
.group-profile-dark .group-profile-topbar { height:36px; }
.group-profile-dark .group-profile-meta { margin-top:14px; }
.group-profile-dark .group-profile-description { max-width:320px; margin-top:14px; }
.group-profile-dark .group-profile-save { border-color:#6288d4; color:#fffaf0; }
.group-profile-dark .group-profile-tags { margin-bottom:14px; }
.group-profile-dark .group-profile-tags button { min-height:34px; padding:5px 14px; border-color:#315394; font-size:12px; }
.group-profile-dark .group-profile-engagement { border-bottom:0; padding-block:11px 2px; }
.group-profile-dark .group-profile-share,.group-profile-dark .group-profile-copy { color:#d0def8; }
.group-profile-dark .group-profile-votes button:first-child svg { color:#efb644; }
.group-profile-dark .group-profile-join { color:#0b163d; background:#fff5e7; min-height:50px; }
.group-profile-dark .group-profile-join:hover { background:#fffdf5; }
.group-profile-dark .group-profile-footer { padding-top:12px; padding-bottom:18px; }
@media(max-width:600px) {
  .group-profile-backdrop { padding:12px; }
  .aona-app .group-profile[role=dialog] { max-height:calc(100dvh - 24px); border-radius:22px; }
  .group-profile-content { padding-inline:18px; }
  .group-profile-identity { min-height:112px; margin-bottom:18px; }
  .group-profile-avatar { width:112px; height:112px; padding:4px; }
  .group-profile-save { right:0; top:0; padding:9px 11px; font-size:12px; }
  .group-profile-save svg { width:16px; }
  .aona-app .group-profile[role=dialog] h2 { font-size:32px; letter-spacing:-.7px; }
  .group-profile-category { font-size:10px; }
  .group-profile-meta { font-size:11px; }
  .group-profile-description { font-size:13px; }
  .group-profile-tags { gap:7px; margin-bottom:18px; }
  .group-profile-tags button { min-height:44px; padding:8px 12px; font-size:10px; }
  .group-profile-engagement { gap:4px; }
  .group-profile-votes { gap:0; }
  .group-profile-votes button { min-width:49px; padding:7px 5px; font-size:11px; }
  .group-profile-vote-divider { margin-inline:4px; }
  .group-profile-share,.group-profile-copy { gap:5px; padding:7px 5px; font-size:11px; }
  .group-profile-footer { padding:12px 18px 18px; }
  .group-profile-note { font-size:10px; }
  .group-profile-dark .group-profile-tags button { min-height:44px; }
  .group-profile-dark .group-profile-identity { min-height:112px; }
  .group-profile-dark .group-profile-avatar { width:112px; height:112px; }
  .aona-app .group-profile-dark[role=dialog] h2 { max-width:280px; font-size:36px; }
}
@media(max-width:360px) {
  .group-profile-save { padding:9px; }
  .group-profile-save svg { display:none; }
  .group-profile-utilities { gap:0; }
  .group-profile-share,.group-profile-copy { gap:4px; padding-inline:3px; font-size:10px; }
}
