:root { --glyx-invite-fill: color-mix(in srgb, var(--ui-accent, #00e0a4) 90%, black); --glyx-invite-hover: color-mix(in srgb, var(--ui-accent, #00e0a4) 85%, black); }
a.btn-primary[href^="https://add.glyx.pl"],
#spanel-addbot-link,
.spanel-server-action.is-add { background: var(--glyx-invite-fill); }
a.btn-primary[href^="https://add.glyx.pl"]:is(:hover, :focus-visible),
#spanel-addbot-link:is(:hover, :focus-visible),
.spanel-server-action.is-add:is(:hover, :focus-visible) { background: var(--glyx-invite-hover); }
/* One brand target: icon and wordmark always move together. */
.glyx-brand { display: inline-flex; align-items: center; flex: 0 0 auto; padding: 0; margin: 0; gap: 0; line-height: 1; text-decoration: none; perspective: 700px; }
.glyx-brand > .glyx-brand-mark { display: block; width: 164px; height: 58px; max-width: 100%; object-fit: cover; transform: translate3d(0,0,0); transform-origin: center; filter: none; transition: transform .28s cubic-bezier(.2,.8,.2,1); user-select: none; -webkit-user-drag: none; }
@media (hover: hover) and (pointer: fine) {
  .glyx-brand:is(:hover,:focus-visible) > .glyx-brand-mark { transform: translate3d(var(--brand-x,0px),var(--brand-y,-1px),0) rotateX(var(--brand-rx,0deg)) rotateY(var(--brand-ry,0deg)) scale(1.035); }
}
.glyx-brand:active > .glyx-brand-mark { transform: scale(.98); transition-duration: .12s; }
.site-footer .glyx-brand > .glyx-brand-mark { width: 123px; height: 44px; }
nav .glyx-brand > .glyx-brand-mark { width: 140px; height: 50px; }
.panel-navbar .glyx-brand > .glyx-brand-mark { width: 150px; height: 54px; }
.docs-mobile-bar .glyx-brand > .glyx-brand-mark { width: 120px; height: 43px; }
.sidebar .glyx-brand > .glyx-brand-mark,.navigation-dialog .glyx-brand > .glyx-brand-mark { width: 167px; height: 60px; }
html[data-sidebar-collapsed=true] #sidebar .glyx-brand > .glyx-brand-mark { width: 56px; height: 28px; }
html[data-ui-motion="reduced"] .glyx-brand > .glyx-brand-mark { transition: none; transform: none; }
@media (max-width: 640px) {
  .glyx-brand > .glyx-brand-mark { width: 142px; height: 50px; }
  nav .glyx-brand > .glyx-brand-mark { width: 122px; height: 43px; }
  .panel-navbar .glyx-brand > .glyx-brand-mark { width: 128px; height: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  .glyx-brand > .glyx-brand-mark { transition: none; }
  .glyx-brand:is(:hover,:focus-visible,:active) > .glyx-brand-mark { transform: none; }
}