/* Tabs blend v2 (Nov 2, 2026). The main tab bar uses the site's own palette: dark cards, #2F3336 borders, and the same
   accent colors as the investigator cards (.c-blue/.c-teal/.c-coral/.c-amber/.c-sage/.c-plum, gold #E2BE6A).
   Each tab: solid accent dot + accent bar on top; hover lifts the tab; the open tab gets a tinted fill and a full accent border.
   The "On X now" pill uses the exact red LIVE badge from the live feed header (.xl-live in x-live.css).
   No box-shadow, text-shadow, filter, glow or halo anywhere. Layout and sizes unchanged.
   Linked after theme-k.css / unify-font.css on every page so it wins. */
html body .kbar{border-bottom:1px solid #2F3336!important;box-shadow:none!important}

.ktab[data-tab="about"]{--ac:#4A8FD9}
.ktab[data-tab="finds"]{--ac:#2BA39A}
.ktab[data-tab="hot"]{--ac:#F07F5E}
.ktab[data-tab="trivia"]{--ac:#E2BE6A}
.ktab[data-tab="board"]{--ac:#7DB356}
.ktab[data-tab="timelines"]{--ac:#B07AD6}

html body .ktab{
  background:linear-gradient(var(--ac,#E2BE6A),var(--ac,#E2BE6A)) top/100% 3px no-repeat,#121418!important;
  color:#D5DBE1!important;border:1px solid #2F3336!important;border-bottom:0!important;
  box-shadow:none!important;text-shadow:none!important;filter:none!important;
  transition:transform .18s cubic-bezier(.2,.8,.2,1),background-color .18s ease,border-color .18s ease,color .18s ease!important}
html body .ktab::before{background:var(--ac,#E2BE6A)!important;box-shadow:none!important;width:7px!important;height:7px!important}
html body .ktab:hover{
  background:linear-gradient(var(--ac),var(--ac)) top/100% 3px no-repeat,color-mix(in srgb,var(--ac) 12%,#121418)!important;
  color:#fff!important;border-color:color-mix(in srgb,var(--ac) 55%,#2F3336)!important;transform:translateY(1px)!important;
  box-shadow:none!important;filter:none!important}
html body .ktab:hover::before{background:var(--ac)!important}
html body .ktab:active{transform:translateY(4px)!important;box-shadow:none!important;filter:none!important}
html body .ktab[aria-current],html body .ktab[aria-current]:hover{
  background:linear-gradient(var(--ac),var(--ac)) top/100% 4px no-repeat,color-mix(in srgb,var(--ac) 26%,#0B0C0E)!important;
  color:#fff!important;border:1px solid var(--ac)!important;border-bottom:0!important;transform:none!important;box-shadow:none!important;filter:none!important}
html body .ktab[aria-current]::before{background:#fff!important;box-shadow:none!important}
html body .ktab:focus-visible{outline:2px solid var(--ac,#E2BE6A)!important;outline-offset:2px}
@media(prefers-reduced-motion:reduce){html body .ktab{transition:none!important}html body .ktab:hover{transform:translateY(5px)!important}}

/* "On X now" pill: the dot becomes the feed header's red LIVE badge (same size, color, font, white pulsing dot) */
html body .tx-btn .tx-dot{display:inline-flex!important;align-items:center;gap:5px;width:auto!important;height:16px!important;padding:0 6px;
  border-radius:4px!important;background:#F4212E!important;color:#fff;font-size:8px!important;letter-spacing:.08em!important;line-height:1!important;
  font-weight:400!important;animation:none!important;transform:none!important;opacity:1!important;box-shadow:none!important}
html body .tx-btn .tx-dot::before{content:"";width:5px;height:5px;border-radius:50%;background:#fff;flex:0 0 auto;animation:xlPulse 1.6s ease-in-out infinite}
html body .tx-btn .tx-dot::after{content:"LIVE"}
@keyframes xlPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.25;transform:scale(.7)}}
@media(prefers-reduced-motion:reduce){html body .tx-btn .tx-dot::before{animation:none}}

/* Tabs fit (Nov 2, 2026): the six tabs never fit the 1240px header with the long labels, so "Official Timelines" ran off the
   right edge at 1280-1920px. Desktop now uses the short labels ("What's Hot", "Timelines") at every width; the long label stays
   in the page for screen readers (visually hidden instead of display:none). Slightly tighter gap below 1280px. Look unchanged. */
@media(min-width:760px){
  html body .ktab .kt-l{display:inline!important;position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
  html body .ktab .kt-m{display:inline!important}
  html body .ktab .kt-s{display:none!important}
}
@media(min-width:760px) and (max-width:1279px){html body .ktabs-l{gap:4px!important;padding-left:8px!important}}
/* RECAP-TAB */.ktab[data-tab="recap"]{--ac:#E0719E}@media(min-width:760px) and (max-width:1279px){html body .kbar-in{gap:12px!important}html body .ktab,html body .ktab[aria-current]{padding:0 7px!important;font-size:12px!important;gap:4px!important}html body .ktabs-l{gap:3px!important;padding-left:4px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none}html body .ktabs-l::-webkit-scrollbar{display:none}}