:root {
  --platform-brand: #64748b;
  --platform-brand-ring: rgba(100, 116, 139, 0.22);
  --platform-brand-surface: rgba(100, 116, 139, 0.12);
  --platform-brand-surface-strong: rgba(100, 116, 139, 0.16);
  --platform-brand-foreground: var(--platform-brand);
}

[data-platform-accent="platform-all"],
.network-filter-btn--platform-all,
.public-platform-pill--platform-all {
  --platform-brand: #10b981;
  --platform-brand-ring: rgba(16, 185, 129, 0.25);
  --platform-brand-surface: rgba(16, 185, 129, 0.12);
  --platform-brand-surface-strong: rgba(16, 185, 129, 0.18);
}

[data-platform-accent="platform-instagram"],
.network-filter-btn--platform-instagram,
.public-platform-pill--platform-instagram {
  --platform-brand: #e4405f;
  --platform-brand-ring: rgba(228, 64, 95, 0.28);
  --platform-brand-surface: rgba(228, 64, 95, 0.12);
  --platform-brand-surface-strong: rgba(228, 64, 95, 0.18);
}

[data-platform-accent="platform-tiktok"],
.network-filter-btn--platform-tiktok,
.public-platform-pill--platform-tiktok {
  --platform-brand: #111111;
  --platform-brand-ring: rgba(17, 17, 17, 0.2);
  --platform-brand-surface: rgba(17, 17, 17, 0.08);
  --platform-brand-surface-strong: rgba(17, 17, 17, 0.14);
}

[data-platform-accent="platform-telegram"],
.network-filter-btn--platform-telegram,
.public-platform-pill--platform-telegram {
  --platform-brand: #229ed9;
  --platform-brand-ring: rgba(34, 158, 217, 0.24);
  --platform-brand-surface: rgba(34, 158, 217, 0.12);
  --platform-brand-surface-strong: rgba(34, 158, 217, 0.18);
}

[data-platform-accent="platform-youtube"],
.network-filter-btn--platform-youtube,
.public-platform-pill--platform-youtube {
  --platform-brand: #ff0000;
  --platform-brand-ring: rgba(255, 0, 0, 0.2);
  --platform-brand-surface: rgba(255, 0, 0, 0.1);
  --platform-brand-surface-strong: rgba(255, 0, 0, 0.16);
}

[data-platform-accent="platform-facebook"],
.network-filter-btn--platform-facebook,
.public-platform-pill--platform-facebook {
  --platform-brand: #1877f2;
  --platform-brand-ring: rgba(24, 119, 242, 0.22);
  --platform-brand-surface: rgba(24, 119, 242, 0.11);
  --platform-brand-surface-strong: rgba(24, 119, 242, 0.17);
}

[data-platform-accent="platform-twitter-x"],
.network-filter-btn--platform-twitter-x,
.public-platform-pill--platform-twitter-x {
  --platform-brand: #111111;
  --platform-brand-ring: rgba(17, 17, 17, 0.22);
  --platform-brand-surface: rgba(17, 17, 17, 0.08);
  --platform-brand-surface-strong: rgba(17, 17, 17, 0.14);
}

[data-platform-accent="platform-reddit"],
.network-filter-btn--platform-reddit,
.public-platform-pill--platform-reddit {
  --platform-brand: #ff4500;
  --platform-brand-ring: rgba(255, 69, 0, 0.24);
  --platform-brand-surface: rgba(255, 69, 0, 0.12);
  --platform-brand-surface-strong: rgba(255, 69, 0, 0.18);
}

[data-platform-accent="platform-apple"],
.network-filter-btn--platform-apple,
.public-platform-pill--platform-apple {
  --platform-brand: #111111;
  --platform-brand-ring: rgba(17, 17, 17, 0.22);
  --platform-brand-surface: rgba(17, 17, 17, 0.08);
  --platform-brand-surface-strong: rgba(17, 17, 17, 0.14);
}

[data-platform-accent="platform-steam"],
.network-filter-btn--platform-steam,
.public-platform-pill--platform-steam {
  --platform-brand: #171a21;
  --platform-brand-ring: rgba(23, 26, 33, 0.22);
  --platform-brand-surface: rgba(23, 26, 33, 0.08);
  --platform-brand-surface-strong: rgba(23, 26, 33, 0.14);
}

[data-platform-accent="platform-xbox"],
.network-filter-btn--platform-xbox,
.public-platform-pill--platform-xbox {
  --platform-brand: #107c10;
  --platform-brand-ring: rgba(16, 124, 16, 0.24);
  --platform-brand-surface: rgba(16, 124, 16, 0.12);
  --platform-brand-surface-strong: rgba(16, 124, 16, 0.18);
}

[data-platform-accent="platform-kick"],
.network-filter-btn--platform-kick,
.public-platform-pill--platform-kick {
  --platform-brand: #53fc18;
  --platform-brand-ring: rgba(83, 252, 24, 0.24);
  --platform-brand-surface: rgba(83, 252, 24, 0.14);
  --platform-brand-surface-strong: rgba(83, 252, 24, 0.2);
}

[data-platform-accent="platform-discord"],
.network-filter-btn--platform-discord,
.public-platform-pill--platform-discord {
  --platform-brand: #5865f2;
  --platform-brand-ring: rgba(88, 101, 242, 0.24);
  --platform-brand-surface: rgba(88, 101, 242, 0.12);
  --platform-brand-surface-strong: rgba(88, 101, 242, 0.18);
}

[data-platform-accent="platform-spotify"],
.network-filter-btn--platform-spotify,
.public-platform-pill--platform-spotify {
  --platform-brand: #1db954;
  --platform-brand-ring: rgba(29, 185, 84, 0.24);
  --platform-brand-surface: rgba(29, 185, 84, 0.12);
  --platform-brand-surface-strong: rgba(29, 185, 84, 0.18);
}

[data-platform-accent="platform-soundcloud"],
.network-filter-btn--platform-soundcloud,
.public-platform-pill--platform-soundcloud {
  --platform-brand: #ff5500;
  --platform-brand-ring: rgba(255, 85, 0, 0.24);
  --platform-brand-surface: rgba(255, 85, 0, 0.12);
  --platform-brand-surface-strong: rgba(255, 85, 0, 0.18);
}

[data-platform-accent="platform-linkedin"],
.network-filter-btn--platform-linkedin,
.public-platform-pill--platform-linkedin {
  --platform-brand: #0a66c2;
  --platform-brand-ring: rgba(10, 102, 194, 0.24);
  --platform-brand-surface: rgba(10, 102, 194, 0.12);
  --platform-brand-surface-strong: rgba(10, 102, 194, 0.18);
}

[data-platform-accent="platform-quora"],
.network-filter-btn--platform-quora,
.public-platform-pill--platform-quora {
  --platform-brand: #b92b27;
  --platform-brand-ring: rgba(185, 43, 39, 0.24);
  --platform-brand-surface: rgba(185, 43, 39, 0.12);
  --platform-brand-surface-strong: rgba(185, 43, 39, 0.18);
}

[data-platform-accent="platform-twitch"],
.network-filter-btn--platform-twitch,
.public-platform-pill--platform-twitch {
  --platform-brand: #9146ff;
  --platform-brand-ring: rgba(145, 70, 255, 0.24);
  --platform-brand-surface: rgba(145, 70, 255, 0.12);
  --platform-brand-surface-strong: rgba(145, 70, 255, 0.18);
}

[data-platform-accent="platform-snapchat"],
.network-filter-btn--platform-snapchat,
.public-platform-pill--platform-snapchat {
  --platform-brand: #facc15;
  --platform-brand-ring: rgba(250, 204, 21, 0.26);
  --platform-brand-surface: rgba(250, 204, 21, 0.16);
  --platform-brand-surface-strong: rgba(250, 204, 21, 0.22);
}

[data-platform-accent="platform-vimeo"],
.network-filter-btn--platform-vimeo,
.public-platform-pill--platform-vimeo {
  --platform-brand: #1ab7ea;
  --platform-brand-ring: rgba(26, 183, 234, 0.24);
  --platform-brand-surface: rgba(26, 183, 234, 0.12);
  --platform-brand-surface-strong: rgba(26, 183, 234, 0.18);
}

[data-platform-accent="platform-pinterest"],
.network-filter-btn--platform-pinterest,
.public-platform-pill--platform-pinterest {
  --platform-brand: #e60023;
  --platform-brand-ring: rgba(230, 0, 35, 0.24);
  --platform-brand-surface: rgba(230, 0, 35, 0.12);
  --platform-brand-surface-strong: rgba(230, 0, 35, 0.18);
}

[data-platform-accent="platform-threads"],
.network-filter-btn--platform-threads,
.public-platform-pill--platform-threads {
  --platform-brand: #111111;
  --platform-brand-ring: rgba(17, 17, 17, 0.22);
  --platform-brand-surface: rgba(17, 17, 17, 0.08);
  --platform-brand-surface-strong: rgba(17, 17, 17, 0.14);
}

[data-platform-accent="platform-whatsapp"],
.network-filter-btn--platform-whatsapp,
.public-platform-pill--platform-whatsapp {
  --platform-brand: #25d366;
  --platform-brand-ring: rgba(37, 211, 102, 0.24);
  --platform-brand-surface: rgba(37, 211, 102, 0.12);
  --platform-brand-surface-strong: rgba(37, 211, 102, 0.18);
}

[data-platform-accent="platform-dribbble"],
.network-filter-btn--platform-dribbble,
.public-platform-pill--platform-dribbble {
  --platform-brand: #ea4c89;
  --platform-brand-ring: rgba(234, 76, 137, 0.24);
  --platform-brand-surface: rgba(234, 76, 137, 0.12);
  --platform-brand-surface-strong: rgba(234, 76, 137, 0.18);
}

[data-platform-accent="platform-kwai"],
.network-filter-btn--platform-kwai,
.public-platform-pill--platform-kwai {
  --platform-brand: #ff6b00;
  --platform-brand-ring: rgba(255, 107, 0, 0.24);
  --platform-brand-surface: rgba(255, 107, 0, 0.12);
  --platform-brand-surface-strong: rgba(255, 107, 0, 0.18);
}

[data-platform-accent="platform-shopee"],
.network-filter-btn--platform-shopee,
.public-platform-pill--platform-shopee {
  --platform-brand: #ee4d2d;
  --platform-brand-ring: rgba(238, 77, 45, 0.24);
  --platform-brand-surface: rgba(238, 77, 45, 0.12);
  --platform-brand-surface-strong: rgba(238, 77, 45, 0.18);
}

[data-platform-accent="platform-vkontakte"],
.network-filter-btn--platform-vkontakte,
.public-platform-pill--platform-vkontakte {
  --platform-brand: #0077ff;
  --platform-brand-ring: rgba(0, 119, 255, 0.24);
  --platform-brand-surface: rgba(0, 119, 255, 0.12);
  --platform-brand-surface-strong: rgba(0, 119, 255, 0.18);
}

[data-platform-accent="platform-website"],
.network-filter-btn--platform-website,
.public-platform-pill--platform-website {
  --platform-brand: #16a34a;
  --platform-brand-ring: rgba(22, 163, 74, 0.24);
  --platform-brand-surface: rgba(22, 163, 74, 0.12);
  --platform-brand-surface-strong: rgba(22, 163, 74, 0.18);
}

[data-platform-accent="platform-other"],
.network-filter-btn--platform-other,
.public-platform-pill--platform-other {
  --platform-brand: #64748b;
  --platform-brand-ring: rgba(100, 116, 139, 0.24);
  --platform-brand-surface: rgba(100, 116, 139, 0.12);
  --platform-brand-surface-strong: rgba(100, 116, 139, 0.18);
}

.platform-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  flex: 0 0 auto;
  border-radius: 0;
  background: transparent;
  color: var(--platform-brand);
  box-shadow: none;
}

.platform-brand-mark i {
  font-size: 1rem;
  line-height: 1;
}

body.panel-auth-client #neworder-entry-form .neworder-picker-badge[data-platform-accent],
body.panel-auth #neworder-entry-form .neworder-picker-badge[data-platform-accent],
body.panel-auth-admin #neworder-entry-form .neworder-picker-badge[data-platform-accent] {
  background: transparent;
  color: var(--platform-brand);
  box-shadow: none;
  border-radius: 0;
}

.platform-brand-mark--sm {
  width: auto;
  height: auto;
  flex-basis: auto;
}

.platform-brand-mark--sm i {
  font-size: 0.96rem;
}

.platform-brand-mark--md {
  width: auto;
  height: auto;
  flex-basis: auto;
}

.platform-brand-mark--md i {
  font-size: 1.08rem;
}

.platform-label-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  min-width: 0;
}

.platform-label-inline > span:last-child {
  min-width: 0;
}

body.panel-auth-client .network-filter-btn[class*="network-filter-btn--platform-"],
body.panel-auth .network-filter-btn[class*="network-filter-btn--platform-"],
body.panel-auth-admin .network-filter-btn[class*="network-filter-btn--platform-"],
.public-platform-pill[class*="public-platform-pill--platform-"] {
  border-color: var(--platform-brand-ring);
}

body.panel-auth-client .network-filter-btn[class*="network-filter-btn--platform-"]:hover,
body.panel-auth .network-filter-btn[class*="network-filter-btn--platform-"]:hover,
body.panel-auth-admin .network-filter-btn[class*="network-filter-btn--platform-"]:hover,
.public-platform-pill[class*="public-platform-pill--platform-"]:hover {
  border-color: var(--platform-brand);
  box-shadow: 0 10px 24px -18px color-mix(in srgb, var(--platform-brand) 34%, transparent);
}

body.panel-auth-client .network-filter-btn[class*="network-filter-btn--platform-"].active,
body.panel-auth .network-filter-btn[class*="network-filter-btn--platform-"].active,
body.panel-auth-admin .network-filter-btn[class*="network-filter-btn--platform-"].active,
.public-platform-pill[class*="public-platform-pill--platform-"].active {
  background: color-mix(in srgb, var(--platform-brand) 8%, transparent);
  border-color: var(--platform-brand);
}

.service-directory-summary-main,
.service-directory-main,
.public-service-group-title,
.public-service-row-copy,
.dashboard-service-row-title,
.neworder-saved-item-copy strong {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}

.service-directory-summary-mark,
.service-directory-platform-mark,
.public-service-group-mark {
  align-self: flex-start;
  margin-top: 0.06rem;
}

.service-directory-main {
  min-width: 0;
}

.service-directory-copy,
.public-service-row-copy,
.neworder-saved-item-copy {
  min-width: 0;
}

.service-directory-copy strong,
.public-service-row-copy strong,
.neworder-saved-item-copy strong,
.dashboard-service-row-title {
  min-width: 0;
}
