/* 平台入口共用尺寸，沿用冰蓝与奶油黄。 */
.social-follow { width:min(100%,390px); margin:26px auto 0; }
.social-links { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
.social-entry { display:block; min-width:0; }
.social-link { display:flex; flex-direction:column; align-items:center; gap:10px; width:100%; padding:2px 0; border:0; background:none; color:#63737c; text-decoration:none; cursor:pointer; }
.social-icon { display:flex; align-items:center; justify-content:center; width:54px; height:54px; border:1px solid rgba(255,255,255,.95); border-radius:18px; background:rgba(255,255,255,.85); box-shadow:0 5px 15px #6077850b,inset 0 1px 0 #fff; transition:transform .22s ease,background .22s ease,box-shadow .22s ease; }
.social-icon img { width:28px; height:28px; object-fit:contain; }
.social-link--xhs .social-icon img { width:44px; }
.social-label { font-size:12px; font-weight:500; line-height:1.5; white-space:nowrap; }
.social-link:hover .social-icon,.social-link:focus-visible .social-icon { transform:translateY(-4px); background:#fff; box-shadow:0 9px 22px #60778519; }
.social-link:hover .social-label { color:#37424b; }
.social-link:focus-visible,.social-panel :is(button,a):focus-visible { outline:3px solid #9dc7db; outline-offset:4px; border-radius:14px; }
.social-follow--footer { width:min(100%,430px); margin-top:30px; }
.social-follow--footer .social-icon { width:60px; height:60px; border-radius:20px; }
.social-follow--footer .social-label { font-size:13px; }
.social-popover { position:fixed; z-index:110; width:min(288px,calc(100vw - 24px)); }
.social-popover.social-float-enter-active { transition:opacity .22s ease-out,transform .22s cubic-bezier(.22,1,.36,1); }
.social-popover.social-float-leave-active { transition:opacity .16s ease-in,transform .16s ease-in; pointer-events:none; }
.social-popover.social-float-enter-from,.social-popover.social-float-leave-to { opacity:0; transform:translateY(6px); }
.social-panel { position:relative; padding:26px; border:1px solid #ffffffd9; border-radius:28px; background:#fffcf7; color:#3d4d57; text-align:center; box-shadow:0 26px 80px #20394b26,0 2px 8px #20394b08; font-family:'Noto Sans SC',sans-serif; }
.social-close { position:absolute; right:10px; top:10px; display:flex; align-items:center; justify-content:center; width:44px; height:44px; border:0; border-radius:50%; background:transparent; color:#73828a; font-size:22px; cursor:pointer; transition:background .2s,color .2s; }
.social-close:hover { background:#edece580; color:#405562; }
.social-panel h3 { display:flex; align-items:center; justify-content:center; gap:7px; margin:0 0 22px; font-size:17px; font-weight:600; line-height:1.4; }
.social-panel h3 img { width:20px; height:20px; object-fit:contain; }
.social-qr-frame { position:relative; width:216px; aspect-ratio:1; max-width:100%; margin:0 auto 20px; overflow:hidden; border:10px solid white; border-radius:22px; background:white; box-shadow:0 0 0 1px #e8eceb,0 8px 20px #4d646509; }
.social-qr { display:block; width:100%; height:auto; margin:0; }
/* 界面聚焦抖音码，img/ 中保留完整原图。 */
.social-qr-frame--douyin { border-color:#b48645; background:#b48645; }
.social-qr-frame--douyin .social-qr { position:absolute; width:162.07%; max-width:none; height:auto; left:-31.03%; top:-29.31%; }
.social-account-name { margin:0 0 22px; font-size:14px; font-weight:600; line-height:1.6; letter-spacing:.01em; user-select:text; overflow-wrap:anywhere; }
.social-panel-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.social-panel-actions :is(button,a) { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:48px; padding:10px; border:0; border-radius:15px; font-size:13px; font-weight:600; cursor:pointer; text-decoration:none; transition:transform .18s,filter .18s; }
.social-panel-actions :is(button,a):hover { transform:translateY(-2px); filter:brightness(.97); }
.social-copy { background:#f5e6bc; color:#786342; }
.social-open { background:#3f535d; color:white; box-shadow:0 4px 12px #3f535d12; }
.social-copy-status { margin:10px 0 0; color:#64747e; font-size:11px; line-height:1.6; }
.social-popover .social-panel { padding:22px 22px 18px; max-height:inherit; overflow:auto; border-radius:24px; }
.social-popover .social-panel h3 { font-size:17px; margin:0 0 15px; }
.social-popover .social-qr-frame { width:204px; margin-bottom:14px; }
.social-popover .social-panel-actions,.social-popover .social-copy-status { display:none; }
.social-popover .social-account-name { margin-bottom:0; }
.social-modal { position:fixed; inset:0; z-index:120; display:flex; align-items:center; justify-content:center; padding:20px; }
.social-modal-backdrop { position:absolute; inset:0; background:#40566355; backdrop-filter:blur(9px); }
.social-modal .social-panel { width:min(400px,100%); max-height:calc(100dvh - 40px); overflow:auto; padding:30px 28px 22px; animation:social-reveal .25s ease-out; }
.social-modal .social-qr-frame { width:clamp(190px,32dvh,260px); }
.social-modal .social-account-name { font-size:14px; }
.hero-gallery-action { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:13px 30px; border-radius:999px; background:#f5ce53; color:#4d4e43; font-weight:600; box-shadow:0 6px 18px #c5a3371a; transition:transform .2s,box-shadow .2s; }
.hero-gallery-action:hover { transform:translateY(-2px); box-shadow:0 9px 24px #c5a33729; }
@keyframes social-reveal { from { opacity:0; transform:translateY(10px) scale(.97); } to { opacity:1; transform:none; } }
@media (max-width:639px) {
  .social-follow { width:min(100%,332px); margin-top:23px; }
  .social-links { gap:8px; }
  .social-icon { width:50px; height:50px; border-radius:17px; }
  .social-label { font-size:11px; }
  .social-follow--footer .social-icon { width:54px; height:54px; border-radius:18px; }
  .social-follow--footer .social-label { font-size:12px; }
  .social-modal .social-panel { padding:28px 23px 20px; }
}
@media (max-width:359px) {
  .social-links { gap:6px; }
  .social-icon,.social-follow--footer .social-icon { width:44px; height:44px; border-radius:15px; }
  .social-link--xhs .social-icon img { width:38px; }
  .social-label,.social-follow--footer .social-label { font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
  .social-icon,.social-panel-actions :is(button,a),.hero-gallery-action,
  .social-popover.social-float-enter-active,.social-popover.social-float-leave-active { transition:none; }
  .social-popover.social-float-enter-from,.social-popover.social-float-leave-to { transform:none; }
  .social-modal .social-panel { animation:none; }
}