/* The Grove's quieter desktop reading surface and a compact NFT keepsake. */
@media (min-width:768px) {
  /* Leave room for a guest's introduction and its full-width call to action. */
  .hh-live[data-live-page="social"] .grove-layout:has(.hh-guest) {
    grid-template-columns:minmax(220px,.8fr) minmax(0,2.2fr) minmax(250px,1fr);
  }
  .hh-live[data-live-page="social"] .hh-identity.hh-guest { padding:32px 14px 20px!important; }
  .hh-live[data-live-page="social"] .hh-guest .grove-profile-bio {
    max-width:23ch;line-height:1.7;overflow-wrap:normal;text-wrap:pretty;
  }
  .hh-live[data-live-page="social"] .hh-guest .button {
    min-width:0;min-height:42px;padding:10px 12px;gap:8px;line-height:1.35;white-space:normal;
  }
  .hh-live[data-live-page="social"] .hh-guest .button svg { width:16px;height:16px;flex:0 0 16px; }
  .hh-live[data-live-page="social"] .hh-guest small { max-width:20ch;margin-inline:auto;line-height:1.45; }
  .hh-live[data-live-page="social"] .hh-feed { gap:10px; }
  .hh-live[data-live-page="social"] .grove-post.hh-post {
    padding:19px 21px;
    border:1px solid #667f6b24;
    border-radius:15px;
    background:linear-gradient(130deg,#ffffffa8,#f5f9f4d9);
    box-shadow:inset 0 1px 0 #ffffffce,0 7px 18px #14311c0b;
  }
  html[data-theme="dark"] .hh-live[data-live-page="social"] .grove-post.hh-post {
    border-color:#cfe6d521;
    background:linear-gradient(135deg,#213c31a8 0%,#10241edb 28%,#091a17e8 100%);
    box-shadow:inset 0 1px 0 #d6f0d00e,0 9px 21px #0000001c;
  }
  .hh-live[data-live-page="social"] .hh-post .post-copy { margin-top:11px;line-height:1.68; }
  .hh-live[data-live-page="social"] .hh-post .post-actions {
    margin-top:16px;
    padding-top:8px;
    border-top:1px solid #78947727;
  }
  html[data-theme="dark"] .hh-live[data-live-page="social"] .hh-post .post-actions { border-top-color:#d3e8d219; }
  .hh-live[data-live-page="social"] .hh-join-prompt {
    min-height:68px;
    border-color:#789a7940;
    background:linear-gradient(110deg,#f2f9eead,#ffffffb8);
    box-shadow:inset 0 1px 0 #ffffffb0,0 6px 18px #12371a0b;
  }
  html[data-theme="dark"] .hh-live[data-live-page="social"] .hh-join-prompt {
    border-color:#b6d7b233;
    background:linear-gradient(112deg,#223c30c4,#0b201bc9 70%);
    box-shadow:inset 0 1px 0 #d9f4dc16,0 7px 22px #00000020;
  }
  .hh-live[data-live-page="social"] .hh-join-prompt .button {
    min-height:42px;
    padding:8px 19px;
    border:1px solid #75976f79;
    border-radius:12px;
    background:linear-gradient(145deg,#f8fff2a8,#d9ebd138);
    color:#213b2b;
    box-shadow:inset 0 1px 0 #ffffff95;
    font-size:12px;
    font-weight:580;
    white-space:nowrap;
  }
  html[data-theme="dark"] .hh-live[data-live-page="social"] .hh-join-prompt .button {
    border-color:#b8d7b057;
    background:linear-gradient(130deg,#b2e7961e,#ffffff05);
    color:#edf5e9;
    box-shadow:inset 0 1px 0 #e4f7e416;
  }
  .hh-live[data-live-page="social"] .hh-join-prompt .button:is(:hover,:focus-visible) {
    border-color:#8fbb78;
    background:linear-gradient(135deg,#e3f5d6,#c6e5b2);
    color:#193620;
  }
  html[data-theme="dark"] .hh-live[data-live-page="social"] .hh-join-prompt .button:is(:hover,:focus-visible) {
    background:linear-gradient(135deg,#386340,#213d31);
    color:#f2f8ee;
  }
}

@media (min-width:768px) and (max-width:1200px) {
  .hh-live[data-live-page="social"] .grove-layout:has(.hh-guest) { grid-template-columns:220px minmax(0,1fr); }
}

/* Living medallion: the art is a keepsake, with one quiet route to its full view. */
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-attachment {
  display:grid;grid-template-columns:100px minmax(0,1fr) auto;align-items:center;gap:18px;
  width:min(100%,540px);margin:16px 0 0;padding:13px 16px 13px 13px;
  overflow:hidden;border:1px solid #8ba77b55;border-radius:72px 20px 20px 72px;
  background:linear-gradient(110deg,#dfebd2,#f5f9ef 72%);
  box-shadow:inset 0 1px 0 #ffffffb0,0 5px 18px #233b2008;
}
html[data-theme="dark"] :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-attachment {
  border-color:#8aa5753d;background:linear-gradient(110deg,#263d28,#102219 65%,#0d1c16);
  box-shadow:inset 0 1px 0 #d6efd00c,0 6px 20px #00000012;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-visual {
  position:relative;min-width:0;width:100px;aspect-ratio:1;padding:4px;
  border:1px solid #77985c70;border-radius:50%;background:linear-gradient(145deg,#d8e9bd,#74915f);
  box-shadow:0 0 0 3px #83a46820,0 7px 16px #071a1620;
}
html[data-theme="dark"] :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-visual {
  background:linear-gradient(145deg,#c7dca6,#68884b);border-color:#b8d39375;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-visual .hh-nft-artwork {
  width:100%;height:100%;aspect-ratio:1;border:0;border-radius:50%;overflow:hidden;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork>img { object-fit:cover!important; }
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity {
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:7px;min-width:0;padding:0;text-align:left;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity .hh-nft-kicker {
  display:block;margin:0;color:#4c6b36;font-size:9px;line-height:1.5;font-weight:650;
  letter-spacing:.13em;text-transform:uppercase;
}
html[data-theme="dark"] :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity .hh-nft-kicker { color:#bcdb9f; }
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity strong {
  color:var(--hh-text);font-family:Georgia,'Times New Roman',serif;font-size:24px;
  font-weight:400;line-height:1.12;letter-spacing:-.035em;overflow-wrap:anywhere;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity .hh-nft-meta {
  display:block;margin:0;color:var(--hh-muted);font-size:11px;line-height:1.5;overflow-wrap:anywhere;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open {
  display:grid;place-items:center;width:44px;height:44px;border-radius:14px;
  border:1px solid #6f8f5740;background:linear-gradient(145deg,#ffffff80,#9bb87f12);
  color:#4b683b;text-decoration:none;
  box-shadow:inset 0 1px 0 #ffffffb0,0 3px 9px #18351908;
}
html[data-theme="dark"] :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open {
  border-color:#b7d59c30;background:linear-gradient(145deg,#c2dfa614,#0a181428);
  color:#c5dda9;box-shadow:inset 0 1px 0 #e3f7cd12,0 3px 9px #00000010;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open svg {
  display:block;width:19px;height:19px;fill:none;stroke:currentColor;
  stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-45deg);
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open:hover {
  border-color:#79995899;background:#b5ce9340;color:#294b24;
}
html[data-theme="dark"] :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open:hover {
  border-color:#c1df9566;background:#b8dc9220;color:#e1efca;
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open:focus-visible { outline:2px solid #85ad62;outline-offset:3px; }
@media(prefers-reduced-motion:no-preference) {
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open { transition:background .18s,border-color .18s,color .18s; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open svg { transition:transform .18s; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-open:hover svg { transform:translate(1px,-1px) rotate(-45deg); }
}
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork .hh-art-placeholder { gap:3px;padding:10px;font-size:10px;line-height:1.25; }
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork .hh-art-placeholder>svg { width:20px!important;height:20px!important; }
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork .hh-art-placeholder>button { min-height:30px;padding:3px 6px;font-size:10px; }
:is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork[data-art-state=error] .hh-art-placeholder>svg { display:none; }
@media(max-width:767px) {
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-attachment {
    grid-template-columns:76px minmax(0,1fr) auto;gap:12px;width:100%;margin-top:12px;
    padding:11px 12px 11px 11px;border-radius:58px 17px 17px 58px;
  }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-visual { width:76px;padding:3px; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity { gap:5px;padding:0; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity strong { font-size:21px; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity .hh-nft-kicker { font-size:8px;letter-spacing:.09em; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity .hh-nft-meta { font-size:10px; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork .hh-art-placeholder { padding:5px;font-size:9px; }
}
@media(max-width:380px) {
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-attachment { grid-template-columns:64px minmax(0,1fr) auto;gap:9px;padding:10px; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-visual { width:64px; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-identity strong { font-size:19px; }
  :is(.hh-live,.hh-live[data-live-page="social"]) .hh-nft-artwork[data-art-state=error] [data-art-label] { display:none; }
}