
/* BADDGES HUB 2.24 - compact header view previews.
   This is loaded after theme.css so the selected state changes border/text only. */
.header-start {display:flex;align-items:center;justify-self:start;gap:16px;min-width:0;white-space:nowrap}
.header-start .brand {grid-area:unset;justify-self:auto;flex:none}
.topbar {grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:clamp(12px,1.5vw,28px)}

/* Reset legacy view-switcher styles: one compact pair beside the wordmark. */
.topbar #view-tabs.view-switcher{
  --mini-bg:rgba(14,18,28,.96);display:flex;flex:none;align-items:center;justify-content:center;
  width:auto;max-width:none;height:51px;margin:0;padding:4px;gap:5px;
  border:1px solid #394456;border-radius:17px;
  background:linear-gradient(180deg,rgba(20,26,39,.94),rgba(10,14,24,.97));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 7px 20px rgba(0,0,0,.16);
  overflow:visible;
}
.topbar #view-tabs button{
  display:flex;position:relative;align-items:center;justify-content:flex-start;flex:none;
  width:107px;min-width:0;height:40px;margin:0;padding:4px 7px;gap:7px;
  border-radius:12px;border:1.5px solid #30394a;
  background:var(--mini-bg)!important;color:#bac4d5!important;
  box-shadow:none!important;text-shadow:none!important;filter:none;
  font-size:12px;font-weight:800;letter-spacing:-.01em;
  transform:none;transition:border-color .18s,color .18s,box-shadow .18s;
}
.topbar #view-tabs button[data-view="schedule"]{width:112px}
.topbar #view-tabs button::before{display:none!important}
.topbar #view-tabs button .view-divider{display:none}
.topbar #view-tabs button .view-preview{
  flex:none;display:grid;place-items:center;width:31px;height:31px;min-width:31px;
  margin:0;padding:0;border-radius:9px;
  border:1px solid rgba(140,105,209,.36);
  background:linear-gradient(180deg,rgba(83,57,144,.45),rgba(30,35,62,.55));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.topbar #view-tabs button .mini-card-stack {position:relative;width:22px;height:22px;transform:none}
.topbar #view-tabs button .mini-card{position:absolute;display:block;border-radius:4px;border:1px solid rgba(169,113,255,.42);background:linear-gradient(140deg,#653bba,#2b284b);box-shadow:none}
.topbar #view-tabs button .mini-card-back{left:0;top:5px;width:16px;height:16px;opacity:.45}
.topbar #view-tabs button .mini-card-mid{left:3px;top:3px;width:17px;height:18px;opacity:.72}
.topbar #view-tabs button .mini-card-front{left:6px;top:0;width:17px;height:19px;padding:3px 2px;gap:2px;display:flex;flex-direction:column;opacity:1}
.topbar #view-tabs button .mini-card-art{display:block;width:100%;height:7px;border-radius:2px;background:linear-gradient(125deg,#9f6fff,#dc9bfa);clip-path:polygon(0 100%,20% 40%,43% 80%,67% 12%,100% 100%)}
.topbar #view-tabs button .mini-card-line{display:block;width:100%;height:2px;border-radius:2px;background:#aea3d2}
.topbar #view-tabs button .mini-card-line.short{width:65%}
.topbar #view-tabs button .mini-agenda{display:block;position:relative;width:21px;height:23px;padding:5px 3px 2px;border-radius:5px;border:1px solid #9672d1;background:#37265e;box-shadow:none;transform:none}
.topbar #view-tabs button .mini-agenda-rings::before,.topbar #view-tabs button .mini-agenda-rings::after{content:"";position:absolute;top:-4px;width:3px;height:7px;border-radius:4px;background:#d9b0ff}
.topbar #view-tabs button .mini-agenda-rings::before{left:4px}.topbar #view-tabs button .mini-agenda-rings::after{right:4px}
.topbar #view-tabs button .mini-agenda-row{display:block;position:relative;height:4px;margin-top:2px;padding:0}
.topbar #view-tabs button .mini-agenda-row::before{content:"";position:absolute;left:0;top:0;width:3px;height:3px;border-radius:1px;background:#8b93ad}
.topbar #view-tabs button .mini-agenda-row.purple::before{background:#ca90ff}
.topbar #view-tabs button .mini-agenda-row.green::before{background:#4af2a0}
.topbar #view-tabs button .mini-agenda-row::after{content:"";position:absolute;left:5px;right:0;top:1px;height:2px;border-radius:2px;background:#9b92bd}
.topbar #view-tabs button .view-label{position:relative;z-index:1;white-space:nowrap;font-size:12px;line-height:1;letter-spacing:-.02em}

/* Selected and hover stay the SAME fill; accents use only border + label. */
.topbar #view-tabs[data-scope="twitch"] button:is(.selected,:hover,:focus-visible){
  border-color:#b477ff!important;color:#d5a9ff!important;
  box-shadow:0 0 0 1px rgba(169,96,255,.22),0 0 16px rgba(169,96,255,.10)!important;
}
.topbar #view-tabs[data-scope="kick"] button:is(.selected,:hover,:focus-visible){
  border-color:#38df8a!important;color:#73f5aa!important;
  box-shadow:0 0 0 1px rgba(52,226,124,.20),0 0 16px rgba(52,226,124,.10)!important;
}
.topbar #view-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
  border:1.5px solid transparent!important;
  background:linear-gradient(var(--mini-bg),var(--mini-bg)) padding-box,linear-gradient(110deg,#b26cff,#35e787) border-box!important;
  color:#f0e4ff!important;box-shadow:0 0 15px rgba(157,90,246,.10),0 0 15px rgba(52,226,124,.08)!important;
}
.topbar #view-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible) .view-label{
  background:linear-gradient(90deg,#d9b5ff,#9ef3c2);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
/* Inactive returns to quiet border without fading away its preview icon. */
.topbar #view-tabs button:not(.selected):not(:hover):not(:focus-visible){border-color:#30394a!important;color:#bac4d5!important;box-shadow:none!important}

/* Each platform navigation link ALWAYS owns its accent, regardless of selected page. */
body .topbar .header-nav .nav-link[data-page="twitch"]:is(:hover,:focus-visible,.active){
  color:#c991ff!important;border-color:#a960ff!important;
  box-shadow:0 0 0 1px rgba(169,96,255,.22),0 9px 23px rgba(169,96,255,.16),0 0 18px rgba(169,96,255,.12)!important;
}
body .topbar .header-nav .nav-link[data-page="kick"]:is(:hover,:focus-visible,.active){
  color:#57f79f!important;border-color:#36e887!important;
  box-shadow:0 0 0 1px rgba(52,226,124,.20),0 9px 23px rgba(52,226,124,.13),0 0 18px rgba(52,226,124,.10)!important;
}
body .topbar .header-nav .nav-link[data-page="all"]:is(:hover,:focus-visible,.active){
  border:1px solid transparent!important;
  background:linear-gradient(100deg,#191326,#12221d) padding-box,linear-gradient(110deg,#a960ff,#34e27c) border-box!important;
  box-shadow:0 0 0 1px rgba(169,96,255,.10),0 9px 22px rgba(52,226,124,.10)!important;
}

/* Clearer boundaries in the LIGHT theme; not a colored selected fill. */
html[data-theme="light"] .topbar #view-tabs.view-switcher{
  --mini-bg:#fff;background:linear-gradient(180deg,#fff,#f5f7fc)!important;
  border:1.5px solid #9baac2!important;box-shadow:0 5px 16px rgba(45,62,99,.14)!important;
}
html[data-theme="light"] .topbar #view-tabs button{
  border:1.5px solid #aab8cd!important;color:#33435a!important;
  background:#fff!important;box-shadow:none!important;
}
html[data-theme="light"] .topbar #view-tabs button .view-preview{
  background:linear-gradient(180deg,#e9e2f8,#eceef7);border:1px solid #b4a4d1;
}
html[data-theme="light"] .topbar #view-tabs[data-scope="twitch"] button:is(.selected,:hover,:focus-visible){border-color:#8b3fd2!important;color:#6a27a6!important;box-shadow:0 0 0 1px rgba(154,72,216,.14)!important}
html[data-theme="light"] .topbar #view-tabs[data-scope="kick"] button:is(.selected,:hover,:focus-visible){border-color:#169e56!important;color:#086f3a!important;box-shadow:0 0 0 1px rgba(17,155,78,.13)!important}
html[data-theme="light"] .topbar #view-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
  border:1.5px solid transparent!important;
  background:linear-gradient(#fff,#fff) padding-box,linear-gradient(110deg,#9351d2,#19ae65) border-box!important;
  box-shadow:0 0 0 1px rgba(116,91,170,.12)!important;
}
html[data-theme="light"] .topbar #view-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible) .view-label{
  background:linear-gradient(90deg,#7130b3,#147d4a);-webkit-background-clip:text;background-clip:text;
}
html[data-theme="light"] .topbar #view-tabs button:not(.selected):not(:hover):not(:focus-visible){border-color:#aab8cd!important;color:#33435a!important}
html[data-theme="light"] body .topbar .header-nav .nav-link[data-page="twitch"]:is(:hover,:focus-visible,.active){color:#6c29b1!important;border-color:#8b47d6!important;box-shadow:0 0 0 1px rgba(139,71,214,.15),0 8px 20px rgba(139,71,214,.12)!important}
html[data-theme="light"] body .topbar .header-nav .nav-link[data-page="kick"]:is(:hover,:focus-visible,.active){color:#08763b!important;border-color:#18ae5a!important;box-shadow:0 0 0 1px rgba(24,174,90,.13),0 8px 20px rgba(24,174,90,.10)!important}
html[data-theme="light"] body .topbar .header-nav .nav-link[data-page="all"]:is(:hover,:focus-visible,.active){background:linear-gradient(90deg,#f5ecff,#e6faee) padding-box,linear-gradient(100deg,#9753e3,#24ad64) border-box!important}

/* Existing responsive header is updated to place the new left-side cluster correctly. */
@media(max-width:1520px){
  .topbar{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand actions" "nav nav";row-gap:12px}
  .topbar .header-start{grid-area:brand;justify-self:start}
  .topbar .header-nav{grid-area:nav;justify-self:center}
  .topbar .top-actions{grid-area:actions;justify-self:end}
}
@media(max-width:950px){
  .topbar{grid-template-columns:minmax(0,1fr);grid-template-areas:"brand" "nav" "actions";justify-items:center}
  .topbar .header-start{grid-area:brand;justify-self:center}
  .topbar .header-nav{grid-area:nav;justify-self:center}
  .topbar .top-actions{grid-area:actions;justify-self:center;max-width:100%;flex-wrap:wrap;justify-content:center}
}
@media(max-width:560px){
  .topbar .header-start{flex-wrap:wrap;justify-content:center;gap:9px;max-width:100%}
  .topbar #view-tabs.view-switcher{height:44px}
  .topbar #view-tabs button{height:34px;width:101px;padding:3px 5px;gap:5px}
  .topbar #view-tabs button[data-view="schedule"]{width:104px}
  .topbar #view-tabs button .view-preview{width:27px;height:27px;min-width:27px}
  .topbar .header-nav{width:100%}
}
@media(prefers-reduced-motion:reduce){.topbar #view-tabs button{transition:none}}


/* v1.4 — no outer group container. Only independent Cards / Agenda controls.
   Strong specificity also overrides the original light-theme wrapper rules. */
html .topbar #view-tabs.view-switcher,
html[data-theme="light"] .topbar #view-tabs.view-switcher{
  display:flex!important;gap:6px!important;align-items:center!important;
  width:auto!important;height:auto!important;max-width:none!important;
  padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;outline:0!important;
  background:transparent!important;background-image:none!important;
  box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  overflow:visible!important;
}
@media(max-width:560px){
  html .topbar #view-tabs.view-switcher,
  html[data-theme="light"] .topbar #view-tabs.view-switcher{height:auto!important;padding:0!important}
}


/* BADDGES 1.6 — platform-aware icons, stronger contrast, defined shadows. */
.topbar #view-tabs[data-scope="kick"] {
 --view-accent:#46eb97;
 --view-accent-soft:rgba(40,212,117,.25);
 --view-preview-bg:linear-gradient(180deg,rgba(20,97,62,.48),rgba(13,45,40,.72));
}
.topbar #view-tabs[data-scope="twitch"] {
 --view-accent:#b684ff;
 --view-accent-soft:rgba(169,96,255,.25);
 --view-preview-bg:linear-gradient(180deg,rgba(91,55,150,.48),rgba(36,27,69,.73));
}
.topbar #view-tabs[data-scope="all"]{
 --view-accent:#c09bfa;
 --view-accent-soft:rgba(149,90,228,.24);
 --view-preview-bg:linear-gradient(125deg,rgba(85,48,144,.46),rgba(14,78,54,.39));
}
.topbar #view-tabs button .view-preview{
 background:var(--view-preview-bg)!important;
 border-color:var(--view-accent-soft)!important;
 box-shadow:0 2px 8px rgba(0,0,0,.17),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
/* Recolor each part of both miniature icons, not just their outer box. */
.topbar #view-tabs[data-scope="kick"] button .mini-card{
 background:linear-gradient(135deg,#207d50,#123c36)!important;
 border-color:#50eb9a!important;
}
.topbar #view-tabs[data-scope="kick"] button .mini-card-art{background:linear-gradient(125deg,#39f0a5,#a3ffce)!important}
.topbar #view-tabs[data-scope="kick"] button .mini-card-line{background:#9ff5bc!important}
.topbar #view-tabs[data-scope="kick"] button .mini-agenda{
 background:#164d36!important;border-color:#44e18d!important
}
.topbar #view-tabs[data-scope="kick"] button .mini-agenda-rings::before,
.topbar #view-tabs[data-scope="kick"] button .mini-agenda-rings::after{background:#54f4a6!important}
.topbar #view-tabs[data-scope="kick"] button .mini-agenda-row::before{background:#50ef99!important}
.topbar #view-tabs[data-scope="kick"] button .mini-agenda-row::after{background:#8be3af!important}
.topbar #view-tabs[data-scope="twitch"] button .mini-agenda-row.green::before{background:#ad74fc!important}
.topbar #view-tabs button{box-shadow:0 4px 10px rgba(0,0,0,.12)!important}
.topbar #view-tabs button:is(.selected,:hover,:focus-visible){
 box-shadow:0 0 0 1px var(--view-accent-soft),0 2px 14px var(--view-accent-soft)!important;
}
/* The selector never fills with solid platform color, including light mode. */
html[data-theme="light"] .topbar #view-tabs button{
 background:#fff!important;border-color:#8b9db6!important;
 box-shadow:0 3px 9px rgba(40,60,95,.17),0 0 0 1px rgba(47,73,111,.07)!important;
 color:#344158!important;
}
html[data-theme="light"] .topbar #view-tabs button .view-preview{
 background:var(--view-preview-bg)!important;
 border-color:var(--view-accent-soft)!important;
 box-shadow:0 2px 8px rgba(53,61,90,.16)!important;
}
html[data-theme="light"] .topbar #view-tabs[data-scope="twitch"] button:is(.selected,:hover,:focus-visible){
 border-color:#8b43d2!important;color:#68269d!important;
 box-shadow:0 0 0 1px rgba(139,67,210,.25),0 5px 17px rgba(139,67,210,.22),0 0 12px rgba(139,67,210,.12)!important;
}
html[data-theme="light"] .topbar #view-tabs[data-scope="kick"] button:is(.selected,:hover,:focus-visible){
 border-color:#10985a!important;color:#086e40!important;
 box-shadow:0 0 0 1px rgba(16,152,90,.23),0 5px 17px rgba(16,152,90,.20),0 0 12px rgba(16,152,90,.12)!important;
}
html[data-theme="light"] .topbar #view-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
 background:linear-gradient(#fff,#fff) padding-box,linear-gradient(105deg,#8c40d8,#15a85d) border-box!important;
 box-shadow:0 0 0 1px rgba(146,98,199,.19),0 5px 18px rgba(76,151,109,.14)!important;
}
/* Stronger shadows for every badge, including Global mini cards. */
body .badge-card.twitch{border-color:rgba(183,111,255,.64);box-shadow:0 16px 38px rgba(0,0,0,.38),0 0 0 1px rgba(183,111,255,.15) inset,0 0 20px rgba(169,96,255,.075)}
body .badge-card.kick{border-color:rgba(52,226,124,.54);box-shadow:0 16px 38px rgba(0,0,0,.38),0 0 0 1px rgba(52,226,124,.13) inset,0 0 20px rgba(52,226,124,.07)}
body .badge-card.twitch:hover,body .global-card.twitch:hover{border-color:#b77bff;box-shadow:0 23px 49px rgba(0,0,0,.41),0 0 25px rgba(169,96,255,.20),0 0 0 1px rgba(183,111,255,.15) inset}
body .badge-card.kick:hover,body .global-card.kick:hover{border-color:#39ea8c;box-shadow:0 23px 49px rgba(0,0,0,.41),0 0 25px rgba(52,226,124,.16),0 0 0 1px rgba(52,226,124,.15) inset}
body .global-card.twitch{border-color:rgba(183,111,255,.55);box-shadow:0 11px 22px rgba(0,0,0,.22),0 0 16px rgba(169,96,255,.07)}
body .global-card.kick{border-color:rgba(52,226,124,.48);box-shadow:0 11px 22px rgba(0,0,0,.22),0 0 16px rgba(52,226,124,.07)}
html[data-theme="light"] body .badge-card.twitch,html[data-theme="light"] body .global-card.twitch{border-color:#a566df;box-shadow:0 11px 25px rgba(84,51,133,.18),0 0 0 1px rgba(142,80,201,.12)}
html[data-theme="light"] body .badge-card.kick,html[data-theme="light"] body .global-card.kick{border-color:#49b67c;box-shadow:0 11px 25px rgba(28,114,66,.15),0 0 0 1px rgba(49,157,94,.12)}
html[data-theme="light"] body .badge-card.twitch:hover,html[data-theme="light"] body .global-card.twitch:hover{border-color:#873bcf;box-shadow:0 16px 32px rgba(115,57,180,.23),0 0 15px rgba(156,77,231,.16)}
html[data-theme="light"] body .badge-card.kick:hover,html[data-theme="light"] body .global-card.kick:hover{border-color:#15965b;box-shadow:0 16px 32px rgba(34,128,74,.21),0 0 15px rgba(32,197,108,.13)}
/* Details: standalone clickable category with image, platform accent, and safe wrap. */
.detail-fact-category-link{
 display:inline-flex;align-items:center;gap:10px;width:max-content;max-width:100%;
 min-height:44px;padding:6px 12px;border:1px solid rgba(183,111,255,.65);
 border-radius:12px;color:#d9b1ff;background:rgba(169,96,255,.065);
 text-decoration:none;box-shadow:0 5px 16px rgba(169,96,255,.095);
 transition:border-color .18s,color .18s,box-shadow .18s;
}
.detail-fact-category-link:hover,.detail-fact-category-link:focus-visible{
 color:#f7eaff;border-color:#c18aff;box-shadow:0 0 20px rgba(169,96,255,.19);
}
.detail-fact-category-image,.detail-fact-category-icon{width:30px;height:30px;flex:none;object-fit:cover;border-radius:7px}
.detail-fact-category-icon{display:grid;place-items:center;background:rgba(169,96,255,.14);font-size:18px}
.detail-fact-category-name{min-width:0;overflow-wrap:anywhere;text-decoration:underline;text-underline-offset:3px}
.detail-fact-category-arrow{margin-left:4px;flex:none}
.detail-hero.kick~.detail-body .detail-fact-category-link{border-color:rgba(52,226,124,.62);background:rgba(52,226,124,.06);color:#8dffc1;box-shadow:0 5px 16px rgba(52,226,124,.08)}
.detail-hero.kick~.detail-body .detail-fact-category-link:hover{border-color:#3ff399;color:#c1ffdc;box-shadow:0 0 20px rgba(52,226,124,.18)}
html[data-theme="light"] .detail-fact-category-link{color:#702ead;background:#f8f1ff;border-color:#a365df;box-shadow:0 5px 15px rgba(133,83,186,.13)}
html[data-theme="light"] .detail-hero.kick~.detail-body .detail-fact-category-link{color:#086d3b;background:#edf9f1;border-color:#30a96b;box-shadow:0 5px 15px rgba(36,147,88,.13)}
@media(prefers-reduced-motion:reduce){.badge-card,.global-card,.detail-fact-category-link{transition:none!important}}


/* v1.9 — view buttons adapt to longer translated labels. */
.topbar #view-tabs button{width:auto!important;min-width:96px!important;max-width:164px!important;padding:4px 10px!important;gap:8px!important;flex:0 1 auto!important}
.topbar #view-tabs button[data-view="schedule"]{width:auto!important;min-width:108px!important}
.topbar #view-tabs button .view-label{display:block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(10px,.72vw,12px)!important;line-height:1.05!important}
@media(max-width:700px){.topbar #view-tabs button{min-width:84px!important;max-width:132px!important;padding:3px 8px!important}.topbar #view-tabs button[data-view="schedule"]{min-width:92px!important}.topbar #view-tabs button .view-label{font-size:10px!important}}
@media(max-width:560px){.topbar #view-tabs button{min-width:78px!important;max-width:124px!important}.topbar #view-tabs button[data-view="schedule"]{min-width:88px!important}}


/* v2.0.10 — mixed Kick/Twitch filters: gradient ONLY on border and lettering.
   This sheet loads AFTER theme.css and intentionally overrides its old filled pills. */
html #cost-tabs[data-scope="all"] button,
html #schedule-cost-tabs[data-scope="all"] button{position:relative;isolation:isolate;}
html #cost-tabs[data-scope="all"] button .mixed-filter-text,
html #schedule-cost-tabs[data-scope="all"] button .mixed-filter-text{position:relative;z-index:1;display:inline-block;}
html #cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible),
html #schedule-cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
 --mixed-inner:#0d121e;
 --mixed-line:linear-gradient(90deg,#b85bff 0%,#a34dff 43%,#55f2af 57%,#20df7c 100%);
 background:linear-gradient(var(--mixed-inner),var(--mixed-inner)) padding-box,var(--mixed-line) border-box!important;
 background-clip:padding-box,border-box!important;
 -webkit-background-clip:padding-box,border-box!important;
 border:1.6px solid transparent!important;
 color:inherit!important;
 -webkit-text-fill-color:currentColor!important;
 text-shadow:none!important;
 box-shadow:inset 1.5px 0 0 rgba(184,91,255,.25),inset -1.5px 0 0 rgba(32,223,124,.20),0 0 19px rgba(159,79,248,.14),0 0 18px rgba(32,223,124,.11)!important;
}
html #cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible) .mixed-filter-text,
html #schedule-cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible) .mixed-filter-text{
 background:linear-gradient(90deg,#d398ff 0%,#bb88ff 46%,#75f0bb 54%,#47eca3 100%) text!important;
 background-clip:text!important;-webkit-background-clip:text!important;
 -webkit-text-fill-color:transparent!important;color:transparent!important;
 font-weight:800;
}
html #cost-tabs[data-scope="all"] button.selected,
html #schedule-cost-tabs[data-scope="all"] button.selected{border-width:2px!important;
 box-shadow:0 0 0 1px rgba(181,89,255,.16),0 0 21px rgba(159,79,248,.19),0 0 21px rgba(32,223,124,.16)!important;}
html #cost-tabs[data-scope="all"] button.selected::after,
html #schedule-cost-tabs[data-scope="all"] button.selected::after{
 content:"";position:absolute;inset:2.2px;border-radius:inherit;pointer-events:none;
 border:1px solid transparent;
 background:linear-gradient(var(--mixed-inner),var(--mixed-inner)) padding-box,
 linear-gradient(90deg,rgba(194,102,255,.67),rgba(176,91,255,.55) 43%,rgba(82,250,173,.55) 57%,rgba(32,223,124,.67)) border-box;
}
html[data-theme="light"] #cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible),
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible){
 --mixed-inner:#fff;
 background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#ad40ef 0%,#9f38ed 43%,#22c97b 57%,#0ba85b 100%) border-box!important;
 box-shadow:0 7px 17px rgba(108,84,156,.14),0 0 14px rgba(177,72,239,.13),0 0 14px rgba(15,179,103,.11)!important;
}
html[data-theme="light"] #cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible) .mixed-filter-text,
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button:is(.selected,:hover,:focus-visible) .mixed-filter-text{
 background:linear-gradient(90deg,#7921c0 0%,#8622d8 46%,#079c57 54%,#087740 100%) text!important;
 background-clip:text!important;-webkit-background-clip:text!important;
}
html[data-theme="light"] #cost-tabs[data-scope="all"] button.selected::after,
html[data-theme="light"] #schedule-cost-tabs[data-scope="all"] button.selected::after{
 background:linear-gradient(#fff,#fff) padding-box,
 linear-gradient(90deg,rgba(165,54,230,.46),rgba(149,57,232,.42) 43%,rgba(18,190,115,.44) 57%,rgba(14,163,87,.50)) border-box;
}
