/* Addendum 8: social presentation primitives. Market layout stays in style.css. */
.creator-avatar-host,.creator-badge-host{display:inline-flex;align-items:center;flex-shrink:0}
.creator-row{gap:6px}
.creator-link{flex:0 1 auto;min-width:0}
.creator-row>[data-ui=followBtn]{margin-left:2px;font-size:13px}
.sound-pill{position:absolute;z-index:7;right:76px;bottom:100px;display:flex;align-items:center;gap:6px;min-height:32px;padding:6px 10px;border:0;border-radius:999px;background:#0e0e1070;font:500 12px Inter,sans-serif;color:#fff;text-shadow:0 1px 3px #0008}
.sound-pill svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sound-pill[hidden]{display:none}
.plot-pro{position:absolute;z-index:8;right:48px;top:8px;width:28px;min-width:28px;height:28px;min-height:28px;touch-action:none}
.plot-pro svg{width:20px;height:20px;stroke-width:1.75}
.pro-view .plot-pro{display:none}
.refresh-indicator{position:absolute;top:calc(var(--safe-top,0px) + 70px);left:50%;transform:translateX(-50%);z-index:15;pointer-events:none;padding:7px 12px;border:0;border-radius:999px;background:var(--surface);font-size:12px;color:var(--text)}
.pull-refreshing .reel-preview{visibility:hidden}
@media(max-width:350px){.creator-row{gap:4px}.creator-link{font-size:12px}.creator-row>[data-ui=followBtn]{padding:0 9px;min-width:54px}.caption{left:calc(12px + var(--safe-left))}.social-rail{right:calc(8px + var(--safe-right));gap:5px}}
@media(prefers-reduced-motion:reduce){.sound-pill,.playback-indicator{transition:none}}
