/* ==========================================================================
   Scarnox pixel theme — bright crimson + gold, arcade textures.
   Loaded LAST on every page; overrides base/page styles.
   ========================================================================== */
:root {
  --bg: #110407;
  --bg-2: #170609;
  --surface: #1a070b;
  --surface-2: #230a10;
  --surface-3: #2e0d15;
  --line: rgba(255, 120, 135, 0.09);
  --line-2: rgba(255, 120, 135, 0.16);
  --line-3: rgba(255, 120, 135, 0.28);
  --red: #ff3346;
  --red-2: #e3122c;
  --red-3: #8f0c20;
  --red-soft: rgba(255, 51, 70, 0.14);
  --red-glow: rgba(255, 51, 70, 0.45);
  --gold: #ffc83d;
  --gold-2: #e8921c;
  --gold-soft: rgba(255, 200, 61, 0.13);
  --pixel: "Jersey 10", "Geist", system-ui, sans-serif;
  --pixel-sm: "Silkscreen", "Geist Mono", monospace;
  --radius-sm: 3px;
  --radius: 4px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body {
  background-image:
    radial-gradient(1000px 560px at 80% -10%, rgba(255, 40, 60, 0.22), transparent 62%),
    radial-gradient(800px 480px at -10% 6%, rgba(200, 20, 45, 0.16), transparent 60%),
    radial-gradient(700px 400px at 50% 110%, rgba(255, 170, 40, 0.06), transparent 60%);
}

/* ---------- Pixel display type ---------- */
h1, h2, .px-font,
.qcard-amount .n, .qcard-price .p, .tier-amt .n, .tier-price .p, .stat .v, .calc-out .big, .calc-range output,
.amt-input, .amt-price .p, .pack .am, .cobar .m, .cobar .tot b, .idrow .amt b, .method .p, .sum .r.total b,
.kpi .v, .od-hero h1, .od-stats .v, .kv .r.tot b, .pay-amount .v, .live-top h3, .packs-head h2 {
  font-family: var(--pixel) !important;
  letter-spacing: 0.01em !important;
  font-weight: 400 !important;
  line-height: .95;
}
/* Jersey 10 is condensed — scale it up */
.hero h1 { font-size: clamp(60px, 8vw, 104px) !important; }
.section-head h2 { font-size: clamp(44px, 5.4vw, 64px) !important; }
.cta h2 { font-size: clamp(44px, 5.6vw, 68px) !important; }
.co-head h1 { font-size: clamp(48px, 6vw, 72px) !important; }
.page-head h1 { font-size: clamp(40px, 4.4vw, 54px) !important; }
.od-hero h1 { font-size: clamp(52px, 6vw, 76px) !important; }
.qcard-amount .n { font-size: 108px !important; }
.qcard-price .p, .tier-price .p { font-size: 34px !important; }
.tier-amt .n { font-size: 72px !important; }
.stat .v { font-size: 50px !important; }
.calc-out .big { font-size: 54px !important; }
.calc-range output { font-size: 32px !important; }
.amt-input { font-size: clamp(120px, 15vw, 190px) !important; }
.amt-price .p { font-size: 58px !important; }
.pack .am { font-size: 50px !important; }
.cobar .m { font-size: 48px !important; }
.cobar .tot b { font-size: 34px !important; }
.idrow .amt b { font-size: 28px !important; }
.method .p { font-size: 26px !important; }
.sum .r.total b, .kv .r.tot b { font-size: 48px !important; }
.kpi .v { font-size: 48px !important; }
.od-stats .v { font-size: 38px !important; }
.pay-amount .v { font-size: 64px !important; }
.live-top h3 { font-size: 30px !important; }
.packs-head h2 { font-size: 40px !important; }
.hero h1 { line-height: 1.02; }
.hero h1 .soft, .section-head h2 .soft, .page-head h1 .soft, .od-hero h1 .soft { color: var(--gold); }
.amt-input, .qcard-amount .n, .tier-amt .n, .pack .am, .od-hero h1 { text-shadow: 0 4px 0 rgba(110, 10, 24, .9); }
.hero h1 { text-shadow: 0 5px 0 rgba(110, 10, 24, .85); }
.section-head h2, .co-head h1, .page-head h1, .cta h2 { text-shadow: 0 3px 0 rgba(110, 10, 24, .85); }

.logo img { height: 30px; width: auto; image-rendering: pixelated; }
.logo img.mark { width: 30px; }

.eyebrow { color: var(--gold); font-family: var(--pixel-sm); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.eyebrow::before { background: var(--gold); box-shadow: 8px 0 0 var(--red); margin-right: 8px; border-radius: 0; }

/* ---------- Buttons: bracketed + pixel arrow (Radium style) ---------- */
.btn { border-radius: 3px; }
.btn-primary {
  background: linear-gradient(180deg, #ff5a68 0%, #ff3346 45%, #d3102b 100%);
  border: 1px solid rgba(255, 200, 200, .35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -2px 0 rgba(90, 0, 15, .35), 0 8px 24px -8px var(--red-glow);
  overflow: visible;
  text-shadow: 0 1px 0 rgba(90, 0, 15, .45);
}
.btn-primary:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -2px 0 rgba(90, 0, 15, .35), 0 14px 34px -8px rgba(255, 51, 70, .7); }
.btn-primary::before {
  content: ""; position: absolute; inset: -6px; pointer-events: none;
  --c: rgba(255, 220, 220, .75);
  background:
    linear-gradient(var(--c), var(--c)) top left / 8px 1.5px,
    linear-gradient(var(--c), var(--c)) top left / 1.5px 8px,
    linear-gradient(var(--c), var(--c)) top right / 8px 1.5px,
    linear-gradient(var(--c), var(--c)) top right / 1.5px 8px,
    linear-gradient(var(--c), var(--c)) bottom left / 8px 1.5px,
    linear-gradient(var(--c), var(--c)) bottom left / 1.5px 8px,
    linear-gradient(var(--c), var(--c)) bottom right / 8px 1.5px,
    linear-gradient(var(--c), var(--c)) bottom right / 1.5px 8px;
  background-repeat: no-repeat;
  transition: inset .3s var(--ease-out), opacity .3s;
  opacity: .7;
}
.btn-primary:hover::before { inset: -9px; opacity: 1; }
.btn-primary::after { overflow: hidden; }
.btn-primary { isolation: isolate; }
.btn-primary .shine { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; pointer-events: none; }
.btn-primary .shine::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.4), transparent); transform: skewX(-20deg); transition: left .7s var(--ease-out); }
.btn-primary:hover .shine::after { left: 130%; }
.btn-primary::after { display: none; }
.px-arrow {
  display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: -8px; margin-left: 4px;
  background: #fff; border-radius: 2px; color: var(--red-2);
  box-shadow: inset 0 -2px 0 rgba(0,0,0,.12);
  transition: transform .3s var(--ease-out);
}
.btn-lg .px-arrow { width: 30px; height: 30px; margin-right: -12px; }
.px-arrow svg { width: 12px !important; height: 12px !important; image-rendering: pixelated; }
.btn-primary:hover .px-arrow { transform: translateX(2px); }
.btn-primary:hover .px-arrow svg { animation: px-nudge .6s steps(2) infinite; }
@keyframes px-nudge { 50% { transform: translateX(2px); } }

.btn-secondary { background: rgba(255, 255, 255, .04); border-color: var(--line-3); }

/* ---------- Glowing top edge on cards (Radium frame accent) ---------- */
.card, .box, .kpis, .stats, .packs, .shell {
  background-image:
    linear-gradient(90deg, transparent 0%, transparent 45%, rgba(255, 51, 70, .55) 80%, #ff6b3d 100%),
    linear-gradient(180deg, var(--surface-2), var(--surface));
  background-size: 100% 2px, 100% 100%;
  background-repeat: no-repeat;
}

/* ---------- Heat panels: bright gradient + texture + glyphs ---------- */
.heat, .shell-l {
  position: relative; isolation: isolate;
  background:
    radial-gradient(130% 110% at 0% 0%, #ff3a4a 0%, #d41530 22%, #8a0c1f 48%, #3a0610 74%, #170508 100%) !important;
}
.heat::after, .shell-l::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: var(--noise); opacity: .09; mix-blend-mode: overlay;
}
.heat > *:not(canvas), .shell-l > *:not(canvas) { position: relative; z-index: 1; }
.shell-l h3, .heat h3 { color: #fff; }

/* Thick textured frame (Radium dashboard boxes) */
.frame {
  position: relative; padding: 7px; border-radius: 5px;
  background:
    linear-gradient(100deg, #2a080e 0%, #4a0d18 45%, #8f1424 75%, #ff4a3a 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.frame::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background-image: var(--noise); opacity: .18; mix-blend-mode: overlay; pointer-events: none; }
.frame > .frame-in { position: relative; background: #140508; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.04); }

/* ---------- Sparkles (from the logo) ---------- */
.sparkle {
  position: absolute; width: 14px; height: 14px; pointer-events: none; z-index: 2;
  image-rendering: pixelated;
  animation: twinkle var(--t, 2.6s) steps(4) infinite;
  animation-delay: var(--dl, 0s);
}
.sparkle svg { width: 100%; height: 100%; }
@keyframes twinkle {
  0%, 100% { opacity: 0; transform: scale(.4); }
  40%, 60% { opacity: 1; transform: scale(1); }
}

/* ---------- Pixel badges / chips ---------- */
.badge { border-radius: 3px; }
.badge::before { border-radius: 0; }
.chip-icon { border-radius: 4px; }
.chip-icon.hot { color: #fff; background: linear-gradient(180deg, #ff5a68, #d3102b); border-color: rgba(255,200,200,.35); box-shadow: inset 0 1px 0 rgba(255,255,255,.3); }
.kbd { border-radius: 3px; }
.input { border-radius: 4px; }
.seg, .seg button { border-radius: 3px; }

/* ---------- Pixel progress / stripes ---------- */
.px-bar { height: 12px; display: grid; grid-auto-flow: column; gap: 2px; }
.px-bar i { background: rgba(255,255,255,.08); }
.px-bar i.on { background: linear-gradient(180deg, #ff6b78, #e3122c); box-shadow: inset 0 -2px 0 rgba(90,0,15,.4); }

/* hero quote card becomes a heat panel */
.qcard {
  border-radius: 6px !important;
  background: radial-gradient(130% 100% at 0% 0%, #ff3a4a 0%, #c81430 25%, #6e0a1a 55%, #1d060b 85%) !important;
  border-color: rgba(255, 160, 160, .25) !important;
}
.qcard::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background-image: var(--noise); opacity: .1; mix-blend-mode: overlay; pointer-events: none; }
.qcard > * { position: relative; z-index: 1; }
.qrow { background: rgba(10, 2, 4, .45) !important; border-color: rgba(255,180,180,.12) !important; border-radius: 4px !important; }
.qtrack { border-radius: 0 !important; height: 8px !important; background: rgba(0,0,0,.35) !important; }
.qtrack .fill { border-radius: 0 !important; background: linear-gradient(90deg, #fff, #ffe0b0) !important; }
.qtrack .knob { border-radius: 2px !important; box-shadow: 0 0 0 4px rgba(255,255,255,.2), 0 4px 10px rgba(0,0,0,.4) !important; }
.qticks span.on { color: #fff; background: rgba(0,0,0,.35); padding: 0 4px; }
.float-card { border-radius: 5px !important; }

/* stats strip: gold numbers */
.stat .v { color: #fff; }


/* tiers featured */
.tier.featured {
  background: radial-gradient(130% 100% at 0% 0%, rgba(255,58,74,.55) 0%, rgba(200,20,48,.3) 30%, transparent 70%), linear-gradient(180deg, var(--surface-2), var(--surface)) !important;
  border-color: rgba(255,90,100,.5) !important;
}

/* range inputs: white pixel knob */
input[type="range"].range { border-radius: 0 !important; height: 8px !important; background: linear-gradient(90deg, #fff 0%, #ffe0b0 var(--p, 0%), rgba(255,255,255,.12) var(--p, 0%)) !important; }
input[type="range"].range::-webkit-slider-thumb { border-radius: 2px !important; width: 22px !important; height: 22px !important; background: #fff !important; box-shadow: 0 0 0 5px rgba(255,255,255,.18), 0 6px 14px rgba(0,0,0,.5) !important; }

/* CTA band */
.cta { border-radius: 8px !important; background: radial-gradient(90% 130% at 50% 0%, #ff3a4a 0%, #b01229 30%, #4a0812 65%, #170508 100%) !important; border-color: rgba(255,140,140,.3) !important; }
.cta p { color: rgba(255, 230, 232, .85); }
.cta .eyebrow { color: #fff; }
.hero-sparks { position: absolute; inset: 0 0 10% 0; pointer-events: none; z-index: 0; }
.hero { overflow: hidden; }
.tier-name, .pack .nm, .label, .od-stats .k, .side-label, .pal-group, .step-n, .qticks, .deliv-head .label {
  font-family: var(--pixel-sm) !important; font-size: 11px !important; letter-spacing: .06em !important; text-transform: uppercase;
}
.hero h1 { line-height: .86 !important; }
.section-head h2, .cta h2, .co-head h1 { line-height: .92 !important; }
.pack .nm { flex-wrap: wrap; gap: 4px 8px !important; }
.pack .nm em { white-space: nowrap; }
.hero-sparks { left: 48%; }
@keyframes px-pulse { 50% { background: rgba(255, 51, 70, .45); } }
.heat > .sparkle, .shell-l > .sparkle, .cta > .sparkle { position: absolute !important; }
.box-head h2 { font-family: var(--font) !important; font-size: 16px !important; font-weight: 600 !important; letter-spacing: -.01em !important; line-height: 1.3 !important; text-shadow: none !important; }
.pack .nm em { position: absolute; top: 8px; right: 8px; font-size: 9px !important; padding: 2px 5px; border-radius: 2px; background: var(--red-soft); border: 1px solid rgba(255,90,100,.3); color: #ff8692; letter-spacing: .04em; }

/* ===== Pokémon pack cards (checkout) ===== */
.packs { overflow: visible !important; }
.pack { display: flex !important; flex-direction: column; align-items: flex-start; gap: 2px; padding: 16px 18px 18px !important; cursor: pointer; overflow: hidden; }
.pk-stage {
  position: relative; align-self: stretch; height: 104px; margin: 0 -18px 10px; display: grid; place-items: end center;
  background: radial-gradient(60% 34% at 50% 92%, rgba(255, 51, 70, .32), transparent 70%), radial-gradient(80% 90% at 50% 100%, rgba(255,255,255,.04), transparent 70%);
  border-bottom: 1px solid var(--line);
}
.pk-stage::after { content: ""; position: absolute; bottom: 8px; left: 50%; width: 70px; height: 10px; transform: translateX(-50%); border-radius: 50%; background: rgba(0,0,0,.45); filter: blur(3px); }
.pk { position: relative; z-index: 1; image-rendering: pixelated; margin-bottom: 10px; max-height: 92px; width: auto; transform-origin: 50% 100%; transition: transform .35s var(--ease-out), filter .35s; filter: drop-shadow(0 0 0 transparent); }
.pack:hover .pk { transform: scale(1.1); }
.pack.on .pk { transform: scale(1.12); filter: drop-shadow(0 0 10px rgba(255, 90, 100, .6)); }
.pack.on .pk-stage { background: radial-gradient(60% 40% at 50% 92%, rgba(255, 51, 70, .6), transparent 72%), radial-gradient(80% 90% at 50% 100%, rgba(255,200,61,.08), transparent 70%); }
.pk-tag { position: absolute; top: 10px; right: 10px; z-index: 2; font-family: var(--pixel); font-size: 15px; line-height: 1; padding: 3px 7px; border-radius: 3px; color: #1a0508; background: var(--gold); box-shadow: 0 2px 0 rgba(90, 40, 0, .5); }
.pk-tag.hot { background: #ff3346; color: #fff; box-shadow: 0 2px 0 rgba(90, 0, 15, .6); }
.pk-name { font-family: var(--pixel); font-size: 24px; line-height: 1; color: #fff; letter-spacing: .01em; }
.pk-amt { font-family: var(--pixel); font-size: 40px; line-height: .9; color: var(--gold); text-shadow: 0 3px 0 rgba(110, 10, 24, .85); margin: 4px 0 8px; }
.pk-amt small { font-size: 18px; color: rgba(255, 200, 61, .7); margin-left: 2px; }
.pk-price { font-weight: 600; font-size: 15px; color: var(--text); }
.pk-price s { color: var(--dim); font-weight: 400; font-size: 12px; margin-left: 4px; }
.pk-per { font-size: 12px; color: var(--dim); }
.pk-per em { font-style: normal; color: #ff8692; margin-left: 4px; }

/* ===== Pokémon tier cards (landing) ===== */
.tier { overflow: hidden; }
.tier-top { position: relative; z-index: 1; }
.tier-name { font-family: var(--pixel) !important; font-size: 30px !important; letter-spacing: .01em !important; text-transform: none !important; color: #fff !important; line-height: 1; }
.tier-sprite { position: absolute; right: 14px; top: 46px; height: 112px; width: 120px; display: grid; place-items: end center; pointer-events: none; }
.tier-sprite::before { content: ""; position: absolute; bottom: 0; left: 50%; width: 110px; height: 28px; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(255, 51, 70, .35), transparent); }
.tier-sprite img { position: relative; image-rendering: pixelated; transform: scale(1.15); transform-origin: 50% 100%; transition: transform .4s var(--ease-out); }
.tier:hover .tier-sprite img { transform: scale(1.3); }

/* ===== payment cards: glass, no logo tiles ===== */
.method { background: rgba(255, 255, 255, .045) !important; border-color: rgba(255, 255, 255, .1) !important; }
.method:hover { background: rgba(255, 255, 255, .075) !important; border-color: rgba(255, 255, 255, .22) !important; }
.method.on { background: rgba(255, 255, 255, .12) !important; }
.method .ic { background: none !important; border: 0 !important; box-shadow: none !important; }
.ic-upi svg { width: 60px !important; height: 26px !important; }
.ic-paypal svg { width: 34px !important; height: 34px !important; filter: drop-shadow(0 2px 4px rgba(0, 48, 135, .6)); }
.ic-coins svg { width: 26px !important; height: 26px !important; margin-left: -9px; box-shadow: 0 0 0 2px rgba(40, 8, 14, .9) !important; }
.coinmark svg { width: 22px; height: 22px; display: block; }
.m-extra { gap: 6px; }

/* ===== pack cards: 6 across, moderate crisp sprites ===== */
.pk-stage { height: 124px !important; }
.pk { max-height: none !important; margin-bottom: 14px !important; transform: scale(var(--s, 1)) !important; }
.pack:hover .pk { transform: scale(calc(var(--s, 1) * 1.08)) !important; }
.pack.on .pk { transform: scale(calc(var(--s, 1) * 1.1)) !important; }
.pk-name { font-size: 27px !important; }
.pk-amt { font-size: 46px !important; }
.pk-amt small { font-size: 20px !important; }
.pk-price { font-size: 16px !important; }
.pk-price s { font-size: 12.5px !important; }
.pk-per { font-size: 12.5px !important; }

/* landing tier sprites bigger */
.tier-sprite { height: 150px !important; width: 160px !important; top: 30px !important; right: 6px !important; }
.tier-sprite::before { width: 140px !important; height: 34px !important; }
.tier-sprite img { transform: scale(calc(var(--s, 1) * 1.15)) !important; margin-bottom: 8px; }
.tier:hover .tier-sprite img { transform: scale(calc(var(--s, 1) * 1.25)) !important; }

.ic-paypal svg { width: 36px !important; height: 36px !important; filter: drop-shadow(0 0 1px rgba(255,255,255,.75)) drop-shadow(0 3px 6px rgba(0,0,0,.4)) !important; }

/* raster logo (user's artwork) */
.logo img { height: 46px !important; width: auto; image-rendering: auto !important; filter: drop-shadow(0 2px 6px rgba(0,0,0,.35)); }
.nav .logo img { height: 58px !important; }
.side .logo img { height: 52px !important; }
.co-top .logo img { height: 50px !important; }
.d-top .logo img { height: 40px !important; }
.footer .logo img { height: 60px !important; }
.auth-art .logo img { height: 52px !important; }
.auth-art .coin { image-rendering: auto !important; filter: drop-shadow(0 20px 30px rgba(0,0,0,.45)) !important; }
@media (max-width: 560px) { .nav .logo img, .co-top .logo img { height: 36px !important; } }

/* restock form */
.restock { display: grid; gap: 12px; padding: 18px; border-radius: 8px; border: 1px solid rgba(255,200,61,.35); background: linear-gradient(135deg, rgba(255,200,61,.12), rgba(255,51,70,.08)); max-width: 560px; }
.restock-txt b { display: block; font-family: var(--pixel); font-size: 26px; font-weight: 400; color: var(--gold); line-height: 1; margin-bottom: 4px; }
.restock-txt span { color: var(--muted); font-size: 14px; }
.restock-row { display: flex; gap: 8px; }
.restock-row .input { flex: 1; height: 44px; }
.restock-row .btn { height: 44px; }
.co-head .restock { margin: 22px auto 0; text-align: left; }
@media (max-width: 520px) { .restock-row { flex-direction: column; } }
.rcpt { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line); }
.rcpt .input { height: 44px; }
.rcpt p { font-size: 12.5px; margin-top: 6px; }

/* login perks */
.auth-perks { list-style: none; padding: 0; margin: 20px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.auth-perks li { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 4px; background: rgba(255,255,255,.02); transition: border-color .2s; }
.auth-perks li:hover { border-color: rgba(255,255,255,.14); }
.auth-perks span { display: grid; place-items: center; width: 24px; height: 24px; margin-bottom: 8px; border-radius: 6px; color: #ff6b78; background: rgba(255,51,70,.1); border: 1px solid rgba(255,51,70,.22); }
.auth-perks svg { width: 13px; height: 13px; display: block; }
.auth-perks b { font-size: 12.5px; color: var(--text); font-weight: 600; letter-spacing: -.005em; }
.auth-perks small { font-size: 11.5px; color: var(--dim); line-height: 1.4; }
@media (max-width: 480px) { .auth-perks { grid-template-columns: 1fr; } }

/* login: browse offers card */
.auth-offers { position: relative; display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 4px; overflow: hidden; isolation: isolate;
  background: linear-gradient(100deg, #2a080e 0%, #4a0d18 50%, #8f1424 85%, #c81e2c 100%);
  border: 1px solid rgba(255,140,150,.28); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 30px -14px rgba(255,51,70,.6);
  transition: transform .25s var(--ease-out, ease), box-shadow .25s, border-color .25s; }
.auth-offers::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--noise); opacity: .16; mix-blend-mode: overlay; }
.auth-offers::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 30%, rgba(255,220,160,.14) 45%, transparent 60%); transform: translateX(-100%); transition: transform .8s ease; }
.auth-offers:hover { transform: translateY(-1px); border-color: rgba(255,200,61,.45); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 14px 34px -12px rgba(255,51,70,.75); }
.auth-offers:hover::after { transform: translateX(100%); }
.ao-mons { display: flex; flex: none; }
.ao-mons img { width: 38px; height: 38px; object-fit: contain; image-rendering: pixelated; margin-left: -2px; filter: drop-shadow(0 3px 4px rgba(0,0,0,.55)); }
.ao-mons img:first-child { margin-left: -4px; width: 30px; }
.ao-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ao-txt b { font-size: 15px; color: #fff; font-weight: 600; }
.ao-txt small { font-size: 12px; color: #ffd27a; }
.ao-go { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 3px; background: #fff; color: #c81e2c; box-shadow: inset 0 -2px 0 rgba(0,0,0,.12); transition: transform .25s; }
.ao-go svg { width: 12px; height: 12px; }
.auth-offers:hover .ao-go { transform: translateX(3px); }