/* Fixes on top of the old WordPress theme (docs/reports/SITE_AUDIT_2026-10-28.md) */

/* keyboard users can see where they are (the theme removes every focus outline) */
:focus-visible {
    outline: 2px solid #ffe234 !important;
    outline-offset: 3px;
}

/* the ticker and the merch rings stop moving for people who ask for less motion */
@media (prefers-reduced-motion: reduce) {
    .marquee_text,
    .kmerch-orbit {
        animation: none !important;
    }
}

/* "Coming Soon" is a label, not a link */
span.cta {
    cursor: default;
}

/* "Trade KANG on": one venue (Uniswap), centred (the theme grid had five columns) */
.powered-grid {
    grid-template-columns: minmax(0, 260px) !important;
    justify-content: center;
}
.powered-col img {
    width: auto !important;
    max-width: 100% !important;
    height: 56px;
    object-fit: contain;
}

/* top ticker: items as wide as their text, two identical halves scrolled by half for a seamless loop
   (the theme gave each item a fixed 10% slot, so longer text wrapped onto two lines) */
.top_bar .marquee_text {
    width: max-content !important;
    left: 0;
    animation: km-marquee 60s linear infinite !important;
}
.top_bar span {
    float: none !important;
    width: auto !important;
    flex: none;
    white-space: nowrap;
    padding-right: 2.5rem;
}
@keyframes km-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .top_bar .marquee_text {
        animation: none !important;
    }
}

/* Tokenomics on phones: the theme pushes the chart 120px down, on top of the numbers below it */
@media (max-width: 767px) {
  body div.chart-img img { top: 0; margin-top: 8px; margin-bottom: 24px; }
}

/* Phones: the Play-To-Earn boxer sits inside its own section instead of hanging over Ecosystem,
   the Ecosystem slides show their picture above the text, and the cards are solid enough to read */
@media (max-width: 768px) {
  body .discover-rhs { position: static; width: 70%; max-width: 240px; margin: 28px auto 0; }
  body .swiper-inner { display: flex; flex-direction: column; }
  body .swiper-inner .eco-img { display: block; position: static; order: -1; width: auto; max-width: 100%; height: 200px; object-fit: contain; margin: 0 auto 12px; }
  body .ecosystemSlider .discover-content { background: linear-gradient(22deg, rgba(58, 32, 128, 0.88) 30%, rgba(110, 72, 180, 0.88) 70%); }
}