/* Outrun Noir: social follow links (marketing footer, dashboard sidebar, docs side panel).
   Markup is generated by work/social/social_links.py (the URLs live there). Hairline square, cream icon (ink in light), orange on hover/focus.
   Each surface maps its own theme tokens, so light mode follows automatically. */
ul.social-links{--sl-fg:#F5F3EE;--sl-hover:#FF5500;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
ul.social-links li{margin:0;padding:0;list-style:none}
ul.social-links li::before{content:none}
ul.social-links a.social-link{display:inline-grid;place-items:center;width:36px;height:36px;margin:0;padding:0;border:1px solid color-mix(in srgb,var(--sl-fg) 26%,transparent);border-radius:0;background:none;color:var(--sl-fg);text-decoration:none;box-shadow:none;transition:color .2s,border-color .2s}
ul.social-links a.social-link svg{display:block;width:16px;height:16px;margin:0;flex:none}
ul.social-links a.social-link:hover,ul.social-links a.social-link:focus-visible{color:var(--sl-hover);border-color:var(--sl-hover);background:none}
ul.social-links a.social-link:focus-visible{outline:2px solid var(--sl-hover);outline-offset:2px}
@media (prefers-reduced-motion:reduce){ul.social-links a.social-link{transition:none}}

/* marketing footer (noir-landing / noir-theme tokens) */
footer.site ul.social-links{--sl-fg:var(--cream);--sl-hover:var(--orange);margin-top:22px}

/* dashboard sidebar, under the Telegram bot card (noir / noir-light tokens) */
.sidebar-bottom ul.social-links{--sl-fg:var(--text);--sl-hover:var(--accent);gap:6px;margin-top:12px}
.sidebar-bottom ul.social-links a.social-link{width:32px;height:32px}
/* short windows: keep the sidebar from scrolling (the bot card's subtitle hides, as refresh.css already does on tablets) */
@media (min-width:768px) and (max-height:820px){.sidebar-bottom{padding-top:16px}.sidebar-bottom .sidebar-bot small{display:none}.sidebar-bottom ul.social-links{margin-top:8px}.sidebar-bottom ul.social-links a.social-link{width:28px;height:28px}}

/* docs side panel, under "Open Bot for Key" (docs-noir tokens) */
body.noir-docs .toc-card ul.social-links{--sl-fg:var(--or-text);--sl-hover:var(--or-accent);gap:6px;margin-top:16px}
body.noir-docs .toc-card ul.social-links a.social-link{width:32px;height:32px}
body.noir-docs .toc-card ul.social-links a.social-link:focus-visible{outline-color:var(--or-accent)!important}