/* AVAXPAD — gloss layer (v0.2): rounder geometry, lit top edges, glossy controls.
   Loaded last and unlayered, so it wins over the @layer utilities in site.css. */

:root {
  --r-card: 20px;
  --r-inner: 14px;
  --r-ctl: 12px;
  --edge-hi: rgba(255, 255, 255, .26);   /* specular top edge */
  --edge-lo: rgba(232, 65, 66, .42);     /* red rim light on the bottom edge */
  --sheen: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, 0) 42%);
}

/* ---------- rounder geometry ---------- */
.rounded-lg { border-radius: var(--r-card); }
.rounded-md { border-radius: var(--r-ctl); }
.rounded { border-radius: 10px; }
.rounded-\[3px\] { border-radius: 999px; }
[role='tablist'], .inline-flex.rounded-md.border.p-1 { border-radius: 999px; }
a.rounded-md.font-display, button.rounded-md.font-display { border-radius: 999px; }
.overflow-x-auto.rounded-lg { border-radius: var(--r-card); }

/* ---------- glossy edge: bright top rim fading to a red bottom rim ---------- */
.gloss { position: relative; isolation: isolate; }
.gloss::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(180deg, var(--edge-hi), rgba(255, 255, 255, .05) 26%, rgba(255, 255, 255, 0) 55%, var(--edge-lo));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 2;
  transition: opacity .25s;
}
.gloss::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--sheen);
  pointer-events: none;
  z-index: 1;
}
.gloss { box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(255, 255, 255, .06); }
.gloss-hot::before { --edge-hi: rgba(255, 255, 255, .34); --edge-lo: rgba(255, 95, 96, .75); }
a.gloss:hover::before { --edge-hi: rgba(255, 255, 255, .4); --edge-lo: rgba(255, 95, 96, .85); }
/* featured cards keep their red halo on top of the depth shadow */
.gloss.shadow-\[0_0_30px_rgb\(255_34_51\/0\.18\)\] { box-shadow: 0 0 34px rgba(232, 65, 66, .2), 0 18px 40px -22px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(255, 255, 255, .08); }
.gloss.shadow-\[0_0_30px_rgb\(255_34_51\/0\.18\)\]:hover { box-shadow: 0 0 46px rgba(232, 65, 66, .32), 0 22px 44px -22px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .1); }
a.gloss:hover { box-shadow: 0 0 26px rgba(232, 65, 66, .18), 0 22px 44px -20px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .08); }

/* ---------- token thumbnails: rounded glossy tiles ---------- */
.bg-gradient-to-br.from-neon-deep\/60 { border-radius: var(--r-inner); box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .05); }
.bg-gradient-to-br.from-neon-deep\/60::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(145deg, rgba(255, 255, 255, .26) 0%, rgba(255, 255, 255, .07) 30%, rgba(255, 255, 255, 0) 46%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -10px 18px -10px rgba(0, 0, 0, .55);
  pointer-events: none;
}

/* ---------- glossy buttons ---------- */
.bg-primary.border-neon-hot {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .30) 0%, rgba(255, 255, 255, .08) 48%, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, .14) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -2px 6px rgba(80, 0, 0, .35), 0 0 16px rgba(232, 65, 66, .45), 0 8px 18px -8px rgba(232, 65, 66, .6);
  text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
}
.bg-primary.border-neon-hot:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65), inset 0 -2px 6px rgba(80, 0, 0, .3), 0 0 26px rgba(232, 65, 66, .7), 0 10px 22px -8px rgba(232, 65, 66, .75); transform: translateY(-1px); }
.bg-primary.border-neon-hot:active { transform: translateY(0); }

/* outline / glass buttons */
.border-neon.bg-neon\/8, .bg-secondary.border {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .02) 50%, rgba(232, 65, 66, .06));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), inset 0 0 14px rgba(232, 65, 66, .18), 0 6px 16px -8px rgba(0, 0, 0, .8);
  backdrop-filter: blur(6px);
}
.border-neon.bg-neon\/8:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), inset 0 0 18px rgba(232, 65, 66, .3), 0 0 18px rgba(232, 65, 66, .35); transform: translateY(-1px); }

/* buy / sell action buttons */
#tradeBtn { border-radius: 999px; transition: transform .15s, box-shadow .2s, filter .2s; }
#tradeBtn.bg-success {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .42) 0%, rgba(255, 255, 255, .1) 48%, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, .12) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 -2px 6px rgba(0, 60, 30, .3), 0 0 18px rgba(61, 220, 151, .35), 0 10px 20px -10px rgba(61, 220, 151, .6);
}
#tradeBtn.bg-destructive {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .38) 0%, rgba(255, 255, 255, .08) 48%, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, .14) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), inset 0 -2px 6px rgba(80, 0, 0, .3), 0 0 18px rgba(255, 92, 92, .4), 0 10px 20px -10px rgba(255, 92, 92, .6);
}
#tradeBtn:hover { transform: translateY(-1px); filter: brightness(1.06); opacity: 1; }

/* header wallet button */
.wallet-adapter-button {
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .02) 50%, rgba(232, 65, 66, .10)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), inset 0 0 12px rgba(232, 65, 66, .25), 0 0 14px rgba(232, 65, 66, .3) !important;
  padding: 0 16px !important;
}
.wallet-adapter-button:not([disabled]):hover { background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(232, 65, 66, .2)) !important; }

/* ---------- tabs & toggles: glossy pills ---------- */
[role='tablist'] { background-image: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), inset 0 -8px 16px -12px rgba(0, 0, 0, .8); }
[role='tablist'] [data-state='active'], [data-range].bg-neon\/20, .rounded-\[3px\].bg-neon\/15 {
  background-image: linear-gradient(180deg, rgba(255, 110, 111, .42), rgba(232, 65, 66, .16) 55%, rgba(232, 65, 66, .24));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 0 14px rgba(232, 65, 66, .35);
  color: var(--foreground);
}
#ranges { background-image: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07); }
/* buy / sell switch */
[data-side].bg-success\/15 { background-image: linear-gradient(180deg, rgba(61, 220, 151, .22), rgba(61, 220, 151, .04)); }
[data-side].bg-destructive\/15 { background-image: linear-gradient(180deg, rgba(255, 92, 92, .24), rgba(255, 92, 92, .04)); }

/* nav: active item becomes a lit pill */
header nav a { border-radius: 999px; }
header nav a.shadow-\[inset_0_-2px_0_var\(--neon\)\] {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .09), rgba(232, 65, 66, .12));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -2px 0 var(--neon), 0 0 14px rgba(232, 65, 66, .22);
}

/* ---------- header: glass bar with a lit bottom seam ---------- */
header.sticky { background: linear-gradient(180deg, rgba(22, 7, 12, .88), rgba(7, 3, 10, .78)); backdrop-filter: blur(14px) saturate(1.3); border-bottom-color: transparent; }
header.sticky::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(232, 65, 66, .55) 20%, rgba(255, 255, 255, .35) 50%, rgba(232, 65, 66, .55) 80%, transparent); pointer-events: none; }

/* ticker: rounded capsule for the LIVE label */
.ticker-track a { padding: 2px 10px; border-radius: 999px; background: rgba(255, 255, 255, .025); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05); }

/* ---------- inputs: inset wells ---------- */
input.border-input, textarea.border-input { border-radius: var(--r-ctl); box-shadow: inset 0 2px 8px rgba(0, 0, 0, .45), inset 0 -1px 0 rgba(255, 255, 255, .04); }
input.border-input:focus-visible, textarea.border-input:focus-visible { box-shadow: inset 0 2px 8px rgba(0, 0, 0, .45), 0 0 0 3px rgba(232, 65, 66, .18), 0 0 18px rgba(232, 65, 66, .35); }
#quote { border-radius: var(--r-inner); box-shadow: inset 0 2px 10px rgba(0, 0, 0, .4); }
#presets button { border-radius: 999px; background-image: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, 0)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08); transition: box-shadow .2s, border-color .2s; }
#presets button:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 0 12px rgba(232, 65, 66, .3); }
.ap-drop { border-radius: var(--r-inner); background-image: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(232, 65, 66, .03)); }
.ap-drop img.ap-preview { border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 10px 22px -10px rgba(0, 0, 0, .8); }

/* ---------- badges & bars ---------- */
.rounded-full.border { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14); }
.border-success\/40.bg-success\/10 { background-image: linear-gradient(180deg, rgba(61, 220, 151, .18), rgba(61, 220, 151, .04)); }
[role='progressbar'].h-1 { height: 6px; box-shadow: inset 0 1px 2px rgba(0, 0, 0, .6); }
[role='progressbar'] > div { border-radius: 999px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 0 10px rgba(232, 65, 66, .6); }

/* stat tiles: the neon cap follows the rounder corner */
.absolute.inset-x-4.-top-px.h-0\.5 { left: 22px; right: 22px; border-radius: 999px; }

/* tables sit inside a rounded, glossy frame */
table thead { background-image: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0)); }

/* modal, toasts, mobile menu */
.ap-modal-card { border-radius: 22px; background-image: var(--sheen); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 60px rgba(232, 65, 66, .22), 0 30px 60px -20px rgba(0, 0, 0, .9); }
.ap-wallet-row { border-radius: 14px; background-image: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07); }
.ap-toast { border-radius: 999px; padding: 10px 18px; background-image: var(--sheen); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 24px rgba(232, 65, 66, .25); }
.ap-mnav { border-radius: 0 0 20px 20px; }
.ap-split { border-radius: 999px; height: 12px; }
.ap-split i { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35); }
.ap-split i:first-child { border-radius: 999px 0 0 999px; }
.ap-split i:last-child { border-radius: 0 999px 999px 0; }

@media (prefers-reduced-motion: reduce) {
  .bg-primary.border-neon-hot:hover, .border-neon.bg-neon\/8:hover, #tradeBtn:hover { transform: none; }
}