/* Amepad — recolor the site's brand accent into Solana's signature gradient
   (teal/green #14F195 -> purple #9945FF). Pure CSS override: safe against Next.js
   hydration since it never touches the DOM or React-managed attributes.
   Trading semantics (long=green #14F195, short=red #FF3858 via --ph-long/--ph-short)
   are deliberately left untouched — that's a buy/sell convention, not brand color. */

:root {
  --solana-grad: linear-gradient(135deg, #14F195 0%, #8752f3 55%, #9945FF 100%);
  /* keep --primary usable as a flat fallback color where a gradient can't render
     (box-shadows, some borders) — pick the purple end so solid-color spots read as
     "the other half" of the gradient rather than plain green everywhere */
  --primary: #9945FF;
  --ring: #9945FF;
}

/* ---- no Telegram button anywhere (nav icon + the one inside the slide-out menu
   panel) — matched by aria-label and by href so it's covered everywhere it appears,
   present or future. !important wins over any inline style the page's own JS
   re-asserts on its own render tick. ---- */
a[aria-label="Telegram"],
a[title="Telegram"],
a[href*="t.me/"] {
  display: none !important;
}

/* ---- no ticker listings anywhere — the scrolling "floy-ticker" strip (every other
   tradeable symbol) is reused as-is on markets/leaderboard/portfolio/stake and every
   /trade/* page, so one rule clears it everywhere. ---- */
.floy-ticker {
  display: none !important;
}
/* its wrapping row (edge fade gradients + hover-pause container) collapses to an
   empty strip once the ticker itself is gone — hide that too so no dead space is
   left behind. */
.floy-ticker,
.floy-ticker-row,
div:has(> .floy-ticker) {
  display: none !important;
}
/* on markets/leaderboard/portfolio/stake/trade pages the strip sits inside a
   28px "Popular" sub-header bar; hiding only the strip leaves that bar visible
   with an orphaned "Popular" label and nothing under it, so hide the whole bar
   by its distinctive height+border+background combo. */
.h-\[28px\].border-t.bg-\[\#070B0A\] {
  display: none !important;
}

/* ---- no DEX screener link (nav icon labeled "$FLOYDEX") ---- */
a[href*="dexscreener.com"] {
  display: none !important;
}

/* ---- the featured blog-post card's hero illustration was a generic placeholder
   wireframe car (no real image was ever set for that post on the live CMS) — it
   read as random/confusing next to the token copy. rename.js swaps its SVG markup
   for an original wireframe token/coin-stack graphic (matching the site's own
   thin-line illustration style, e.g. the wireframe globe elsewhere on the page)
   instead of leaving the slot empty. Recolor it to the brand gradient like
   everything else that used the old flat green. ---- */
.s5-insights-featured-art-img svg [data-amepad-art] {
  stroke: url(#amepad-solana-grad);
}

/* ---- homepage "insight card" that flags the ticker lineup gets hidden via
   [data-amepad-hide] set by rename.js (matching its heading text — it shares a
   generic .s5-headline-card class with sibling cards we want to keep). ---- */
[data-amepad-hide] {
  display: none !important;
}

/* ---- text: gradient fill via background-clip ---- */
.text-primary,
.text-\[\#14F195\],
.hover\:text-\[\#14F195\]:hover {
  background-image: var(--solana-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
.hover\:decoration-\[\#14F195\]:hover {
  text-decoration-color: #9945FF !important;
}

/* ---- backgrounds: gradient fill ---- */
.bg-primary,
.bg-\[\#14F195\] {
  background-image: var(--solana-grad) !important;
  background-color: transparent !important;
}

/* ---- borders / rings: solid purple (gradient borders are a CSS pain and this
   keeps the second brand color visible on outlined elements) ---- */
.border-\[\#14F195\] {
  border-color: #9945FF !important;
}
.ring-\[\#14F195\] {
  --tw-ring-color: #9945FF !important;
}

/* ---- nav logo mark: real two-tone gradient fill (SVG), not text-clip ---- */
.s5-nav-logo-img path {
  fill: url(#amepad-solana-grad) !important;
}

/* ---- nav wordmark "AMEPAD": give it the gradient too ---- */
.s5-nav-logo-text {
  background-image: var(--solana-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* ---- hero headline ("Tokenized / Perps / Reimagined.") and the big slash/operator
   glyphs next to it: these are custom .s5-* classes with the color hardcoded in the
   compiled CSS (no Tailwind utility to hook), so they need their own gradient rule.
   The page renders each LETTER as its own child span (.s5-chr) for the reveal
   animation, so the parent itself has no direct text to clip a background against —
   clipping only the parent renders nothing at all. Target the letter spans instead.
   No background-attachment:fixed anywhere in this block: several ancestors
   (.s5-hero-title-wrap, .s5-op-row) carry their own static `transform`, and a
   `transform` on ANY ancestor changes the containing block fixed backgrounds resolve
   against — the fixed gradient then paints relative to the wrong box, showing up as
   a small stray colored rectangle over the first letter of each line. Each letter
   just paints its own slice of the gradient instead of windowing into one
   viewport-wide sweep — a fair trade for not glitching. */
.s5-hero-intel,
.s5-hero-op,
.s5-hero-slash,
.s5-hero-intel .s5-chr,
.s5-hero-op .s5-chr,
.s5-hero-slash .s5-chr {
  background-image: var(--solana-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* ---- everything else on the site that hardcodes the old brand green (#14F195) in
   color / background / border / box-shadow — generated from every such rule in the
   compiled CSS, so this is a full sweep, not a guess at which components exist.
   Flat purple rather than gradient-text here: many of these aren't text at all
   (dots, icons, borders, scrollbar, box-shadow glows) and background-clip:text only
   renders against actual glyphs — applying it to a non-text element just makes that
   element invisible. Solid purple is the safe, universal choice for the remainder. ---- */
.s5-scrollbar-track{background:#9945FF1f!important}
.s5-scrollbar-thumb{background:#9945FF!important}
.s5-page{color:#9945FF!important}
.s5-menu-pill{color:#9945FF!important}
.s5-nav-social{color:#9945FF!important}
.s5-nav-token{color:#9945FF!important}
.s5-footer-socials a{color:#9945FF!important}
.s5-footer-token{color:#9945FF!important}
.s5-menu-close{color:#9945FF8c!important}
.s5-menu-close:hover{color:#9945FF!important}
.s5-menu-nav-link{color:#9945FF!important}
.s5-menu-nav-link:hover{color:#9945FF!important}
.s5-menu-connect-btn{background:#9945FF!important}
.s5-hero-tagline{color:#9945FF!important}
.s5-live-pill{color:#9945FF!important}
.s5-live-dot{background:#9945FF!important}
.s5-live-dot:after{background:#9945FF!important}
.s5-live-label{color:#9945FFa6!important}
.s5-headline-card:hover .s5-card-arrow{color:#9945FF!important}
.s5-stats-title{color:#9945FF!important}
.s5-stats-item{color:#9945FF80!important}
.s5-stats-item--active{color:#9945FF!important}
.s5-stats-dot--active{background:#9945FF!important}
.s5-stats-dot--active{box-shadow:0 0 8px #9945FF99!important}
.s5-right-cta .s5-explore-text{color:#9945FF!important}
.s5-arrow-icon{color:#9945FF!important}
.s5-explore-text{color:#9945FF!important}
.s5-arrow-btn{color:#9945FF!important}
.s5-solution-card:hover{color:#9945FF!important}
.s5-solution-card:hover .s5-solution-name{color:#9945FF!important}
.s5-solution-card:hover .s5-solution-desc{color:#9945FF!important}
.s5-solution-card:hover .s5-explore-btn{color:#9945FF!important}
.s5-solution-card:hover .s5-explore-btn{border-color:#9945FF80!important}
.s5-insights-featured-cat{color:#9945FF!important}
.s5-insights-featured-title{color:#9945FF!important}
.s5-insights-featured-date{color:#9945FF8c!important}
.s5-insights-featured-desc{color:#9945FFa6!important}
.s5-readmore-btn{color:#9945FF!important}
.s5-readmore-btn{border:1.5px solid #9945FF66!important}
.s5-readmore-btn:hover{color:#9945FF!important}
.s5-readmore-btn:hover{border-color:#9945FF!important}
.s5-insights-grid{background:#9945FF!important}
.s5-insight-card{background:#9945FF!important}
.s5-cta-title{color:#9945FF!important}
.s5-cta-bracket{color:#9945FF!important}
.s5-cta-input{color:#9945FF!important}
.s5-cta-input:focus{border-color:#9945FF!important}
.s5-cta-input::placeholder{color:#9945FF6b!important}
.s5-continue-btn{color:#9945FF!important}
.s5-continue-btn{border:1.5px solid #9945FF80!important}
.s5-continue-btn:hover{background:#9945FF1a!important}
.s5-continue-btn:hover{border-color:#9945FF!important}
.s5-cta-contact-label{color:#9945FF80!important}
.s5-cta-contact-val{color:#9945FF!important}
.s5-cta-contact-val-sm{color:#9945FF!important}
.s5-footer{color:#9945FF!important}
.s5-footer-signup-label{color:#9945FF!important}
.s5-footer-signup-field{color:#9945FF!important}
.s5-footer-signup-field::placeholder{color:#9945FF!important}
.s5-footer-subscribe-btn{color:#9945FF!important}
.s5-footer-subscribe-btn{border:1.5px solid #9945FF73!important}
.s5-footer-subscribe-btn:hover{color:#9945FF!important}
.s5-footer-subscribe-btn:hover{background:#9945FF1f!important}
.s5-footer-subscribe-btn:hover{border-color:#9945FF!important}
.s5-footer-panel{color:#9945FF!important}
.s5-footer-logo{color:#9945FF!important}
.s5-footer-col-h{color:#9945FF!important}
.s5-footer-col-list li{color:#9945FF!important}
.s5-footer-col-list li a{color:#9945FF!important}
.s5-footer-ca a{color:#9945FF!important}
.border-\[\#14F195\]{border-color:#9945FF!important}
.border-\[\#14F195\]\/20{border-color:#9945FF33!important}
.border-\[\#14F195\]\/35{border-color:#9945FF59!important}
.border-\[\#14F195\]\/40{border-color:#9945FF66!important}
.border-\[\#14F195\]\/50{border-color:#9945FF80!important}
.bg-\[\#14F195\]{background-color:#9945FF!important}
.bg-\[\#14F195\]\/10{background-color:#9945FF1a!important}
.bg-\[\#14F195\]\/12{background-color:#9945FF1f!important}
.bg-\[\#14F195\]\/15{background-color:#9945FF26!important}
.bg-\[\#14F195\]\/20{background-color:#9945FF33!important}
.bg-\[\#14F195\]\/80{background-color:#9945FFcc!important}
.bg-\[\#14F195\]\/\[0\.04\]{background-color:#9945FF0a!important}
.bg-\[\#14F195\]\/\[0\.06\]{background-color:#9945FF0f!important}
.bg-\[\#14F195\]\/\[0\.07\]{background-color:#9945FF12!important}
.bg-\[\#14F195\]\/\[0\.08\]{background-color:#9945FF14!important}
.bg-\[rgba\(20\,241\,149\,0\.16\)\]{background-color:#9945FF29!important}
.text-\[\#14F195\]{color:#9945FF!important}
.decoration-\[\#14F195\]\/30{text-decoration-color:#9945FF4d!important}
.ring-\[\#14F195\]{--tw-ring-color:#9945FF!important}
.group-hover\:text-\[\#14F195\]:is(:where(.group):hover *){color:#9945FF!important}
.group-active\:bg-\[\#14F195\]:is(:where(.group):active *){background-color:#9945FF!important}
.hover\:bg-\[\#14F195\]\/40:hover{background-color:#9945FF66!important}
.hover\:text-\[\#14F195\]:hover{color:#9945FF!important}
.hover\:decoration-\[\#14F195\]:hover{color:#9945FF!important}
.focus\:border-\[\#14F195\]\/35:focus{border-color:#9945FF59!important}
.focus\:border-\[\#14F195\]\/40:focus{border-color:#9945FF66!important}
.desk-lev-slider:active::-webkit-slider-thumb{box-shadow:0 0 0 3px #9945FF33!important}
.desk-lev-slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px #9945FF33!important}
.desk-lev-slider:active::-moz-range-thumb{box-shadow:0 0 0 3px #9945FF33!important}
.desk-lev-slider:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px #9945FF33!important}
::-webkit-scrollbar-thumb:hover{background:#9945FF!important}
.floy-live-dot{background:#9945FF!important}
.desk-tab.is-on:after{background:#9945FF!important}
.desk-long{color:#9945FF!important}
.desk-btn-long{background:#9945FF!important}