/* ========================================================================
   EMBERNETWORK — SELLAUTH NATIVE HERO
   Pega este archivo en Assets/custom.css.
   NO requiere tocar script.js.
   ======================================================================== */

:root {
  --ember-sa-orange: #ff5b24;
  --ember-sa-orange-hot: #ff321e;
  --ember-sa-orange-soft: #ff9857;
  --ember-sa-text: #f7f2ed;
  --ember-sa-muted: rgba(244,239,234,.78);
  --ember-sa-ease: cubic-bezier(.2,.8,.2,1);
}

.ember-sa-hero,
.ember-sa-hero * {
  box-sizing: border-box;
}

.ember-sa-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  min-height: clamp(790px, calc(100vh - 58px), 940px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #09090c;
  color: var(--ember-sa-text);
  border-bottom: 1px solid rgba(255,255,255,.05);
}

/* ---------- FONDO ---------- */

.ember-sa-bg {
  position: absolute;
  inset: -25px;
  z-index: -6;
  background-image:
    linear-gradient(
      180deg,
      rgba(20,5,5,.24) 0%,
      rgba(12,4,5,.08) 34%,
      rgba(8,5,7,.22) 66%,
      rgba(7,7,10,.69) 100%
    ),
    var(--ember-sa-background);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  filter: saturate(.96) contrast(1.03) brightness(.74);
  transform: scale(1.05);
  transition: transform .22s linear;
  will-change: transform;
}

.ember-sa-overlay {
  position: absolute;
  inset: 0;
  z-index: -5;
  pointer-events: none;
  background:
    radial-gradient(
      circle at 50% 42%,
      rgba(255,116,58,.04),
      transparent 52%
    ),
    linear-gradient(
      90deg,
      rgba(6,7,10,.36),
      rgba(6,7,10,.05) 32%,
      rgba(6,7,10,.03) 68%,
      rgba(6,7,10,.27)
    );
}

.ember-sa-vignette {
  position: absolute;
  inset: 0;
  z-index: -4;
  pointer-events: none;
  box-shadow:
    inset 0 90px 100px rgba(0,0,0,.14),
    inset 0 -170px 150px rgba(0,0,0,.39),
    inset 80px 0 100px rgba(0,0,0,.13),
    inset -80px 0 100px rgba(0,0,0,.10);
}

.ember-sa-water {
  position: absolute;
  left: 50%;
  bottom: 2%;
  z-index: -3;
  width: min(74vw,1080px);
  height: 250px;
  transform: translateX(-50%);
  pointer-events: none;
  opacity: .62;
  filter: blur(30px);
  background:
    radial-gradient(
      ellipse,
      rgba(255,93,34,.12),
      rgba(255,58,25,.05) 35%,
      transparent 72%
    );
  animation: emberSaWater 6.5s ease-in-out infinite alternate;
}

@keyframes emberSaWater {
  from {
    opacity: .48;
    transform: translateX(-50%) scale(.96,.90);
  }

  to {
    opacity: .73;
    transform: translateX(-50%) scale(1.05,1.05);
  }
}

/* ---------- PETALOS ---------- */

.ember-sa-petals {
  position: absolute;
  inset: 0;
  z-index: 7;
  overflow: hidden;
  pointer-events: none;
}

.ember-sa-petal {
  position: absolute;
  top: -12vh;
  width: var(--petal-size,10px);
  height: calc(var(--petal-size,10px) * .62);
  opacity: var(--petal-opacity,.6);
  border-radius: 80% 0 80% 0;
  background:
    linear-gradient(
      135deg,
      rgba(255,210,216,.95),
      rgba(219,62,78,.88)
    );
  filter: blur(var(--petal-blur,0px));
  box-shadow: 0 0 8px rgba(235,70,85,.14);
  animation:
    emberSaPetalFall var(--petal-duration,14s) linear infinite,
    emberSaPetalSway 5s ease-in-out infinite alternate;
  animation-delay: var(--petal-delay,0s);
}

@keyframes emberSaPetalFall {
  from {
    top: -12vh;
    transform: translate3d(0,0,0) rotate(0);
  }

  to {
    top: 112vh;
    transform:
      translate3d(var(--petal-drift,80px),0,0)
      rotate(460deg);
  }
}

@keyframes emberSaPetalSway {
  from { margin-left: -18px; }
  to { margin-left: 18px; }
}

/* ---------- CENTRO ---------- */

.ember-sa-copy {
  position: relative;
  z-index: 10;
  width: min(920px,57vw);
  padding: 92px 12px 250px;
  text-align: center;
  transition: transform .24s var(--ember-sa-ease);
}

.ember-sa-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 17px;
  margin-bottom: 18px;
  border: 1px solid rgba(255,90,34,.26);
  border-radius: 13px;
  background:
    linear-gradient(
      rgba(25,12,12,.76),
      rgba(12,10,13,.72)
    );
  color: var(--ember-sa-orange-soft);
  font-size: .77rem;
  font-weight: 800;
  letter-spacing: .055em;
  text-transform: uppercase;
  backdrop-filter: blur(11px);
  box-shadow:
    0 10px 30px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.04);
}

.ember-sa-badge-icon {
  color: var(--ember-sa-orange);
  font-size: 1.02rem;
  text-shadow: 0 0 12px rgba(255,90,34,.3);
}

.ember-sa-title {
  margin: 0 !important;
  font-family:
    Impact,
    Haettenschweiler,
    "Arial Narrow Bold",
    "Arial Black",
    sans-serif !important;
  font-size: clamp(3.7rem,4.7vw,5.25rem) !important;
  font-weight: 900 !important;
  line-height: .91 !important;
  letter-spacing: .008em !important;
  text-transform: uppercase;
  color: #f0efed !important;
  text-shadow:
    0 5px 0 rgba(50,50,54,.70),
    0 8px 18px rgba(0,0,0,.54);
}

.ember-sa-title-white,
.ember-sa-title-fire {
  display: block;
  white-space: nowrap;
}

.ember-sa-title-fire {
  background:
    linear-gradient(
      #ff7641,
      #ed4326 43%,
      #bd2417
    );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  filter:
    drop-shadow(0 6px 0 rgba(82,14,10,.68))
    drop-shadow(0 0 9px rgba(255,80,30,.09));
  animation: emberSaTitle 3.4s ease-in-out infinite alternate;
}

@keyframes emberSaTitle {
  to {
    filter:
      drop-shadow(0 6px 0 rgba(82,14,10,.68))
      drop-shadow(0 0 18px rgba(255,80,30,.24));
  }
}

.ember-sa-subtitle {
  max-width: 710px;
  margin: 22px auto 0 !important;
  color: var(--ember-sa-muted) !important;
  font-size: clamp(1rem,1.16vw,1.1rem) !important;
  line-height: 1.56 !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.46);
}

/* ---------- BOTONES LATERALES ---------- */

.ember-sa-cta {
  position: absolute;
  top: 46.5%;
  z-index: 12;
  width: clamp(215px,16.5vw,275px);
  min-height: 68px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  overflow: hidden;
  border: 1px solid rgba(255,92,37,.46);
  border-radius: 14px;
  background:
    linear-gradient(
      rgba(18,13,15,.79),
      rgba(8,9,12,.86)
    );
  color: #fff !important;
  text-decoration: none !important;
  font-size: .92rem;
  font-weight: 800;
  letter-spacing: .02em;
  backdrop-filter: blur(12px);
  box-shadow:
    0 16px 40px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.035);
  transform: translateY(-50%);
  transition:
    transform .24s var(--ember-sa-ease),
    border-color .24s,
    box-shadow .24s var(--ember-sa-ease);
}

.ember-sa-cta-reviews {
  left: clamp(28px,3.1vw,56px);
}

.ember-sa-cta-products {
  right: clamp(28px,3.1vw,56px);
}

.ember-sa-cta:hover {
  border-color: rgba(255,128,73,.88);
  box-shadow:
    0 0 19px rgba(255,86,32,.22),
    0 0 42px rgba(255,52,26,.10),
    0 18px 48px rgba(0,0,0,.31);
  transform: translateY(-50%) translateY(-3px);
}

.ember-sa-cta-icon,
.ember-sa-arrow {
  color: var(--ember-sa-orange);
  text-shadow: 0 0 13px rgba(255,90,34,.30);
}

.ember-sa-arrow {
  font-size: 1.35rem;
  transition: transform .2s var(--ember-sa-ease);
}

.ember-sa-cta:hover .ember-sa-arrow {
  transform: translateX(5px);
}

/* ---------- SERVER CARD ---------- */

.ember-sa-server {
  position: absolute;
  right: clamp(28px,3.2vw,56px);
  bottom: 178px;
  z-index: 13;
  width: clamp(230px,16.3vw,280px);
  padding: 18px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 15px;
  background:
    linear-gradient(
      rgba(24,13,14,.84),
      rgba(15,11,13,.88)
    );
  backdrop-filter: blur(13px);
  box-shadow:
    0 18px 48px rgba(0,0,0,.29),
    0 0 24px rgba(255,80,30,.05);
}

.ember-sa-status {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: #65e683;
  font-size: .78rem;
  font-weight: 800;
}

.ember-sa-status-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #32d363;
  box-shadow: 0 0 10px rgba(50,211,99,.48);
  animation: emberSaOnline 1.9s ease-in-out infinite;
}

@keyframes emberSaOnline {
  50% {
    box-shadow:
      0 0 13px rgba(50,211,99,.75),
      0 0 23px rgba(50,211,99,.18);
  }
}

.ember-sa-ip {
  margin-bottom: 12px;
  overflow: hidden;
  color: #f8f3ef;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .94rem;
  font-weight: 700;
}

.ember-sa-copy-ip {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 43px;
  border: 1px solid rgba(255,116,62,.34);
  border-radius: 9px;
  background: linear-gradient(135deg,#a92716,#8e1f12);
  color: #fff;
  font-size: .82rem;
  font-weight: 800;
  cursor: pointer;
  box-shadow:
    0 0 14px rgba(255,76,30,.12),
    inset 0 1px 0 rgba(255,255,255,.07);
  transition:
    transform .2s var(--ember-sa-ease),
    filter .2s,
    box-shadow .2s;
}

.ember-sa-copy-ip:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
  box-shadow:
    0 0 18px rgba(255,76,30,.24),
    0 0 34px rgba(255,50,25,.1);
}

/* ---------- BENEFICIOS ---------- */

.ember-sa-benefits {
  position: absolute;
  left: 50%;
  bottom: 56px;
  z-index: 11;
  width: min(930px,58vw);
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 13px;
  transform: translateX(-50%);
}

.ember-sa-benefit {
  position: relative;
  overflow: hidden;
  min-height: 128px;
  padding: 15px 12px 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background:
    linear-gradient(
      rgba(18,14,17,.74),
      rgba(9,10,13,.79)
    );
  text-align: center;
  backdrop-filter: blur(11px);
  box-shadow:
    0 16px 38px rgba(0,0,0,.22);
  transform-style: preserve-3d;
  transition:
    transform .22s var(--ember-sa-ease),
    border-color .22s,
    box-shadow .22s;
}

.ember-sa-benefit::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: 0;
  height: 2px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--ember-sa-orange),
      transparent
    );
  box-shadow: 0 0 13px rgba(255,90,34,.22);
}

.ember-sa-benefit:hover {
  border-color: rgba(255,93,38,.30);
  box-shadow:
    0 20px 48px rgba(0,0,0,.29),
    0 0 22px rgba(255,83,30,.08);
}

.ember-sa-benefit-icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin: 0 auto 8px;
  color: var(--ember-sa-orange-soft);
  font-size: 1.2rem;
}

.ember-sa-benefit strong {
  display: block;
  margin-bottom: 5px;
  color: #fff4ec;
  font-size: .73rem;
  line-height: 1.16;
}

.ember-sa-benefit small {
  display: block;
  color: rgba(225,221,216,.67);
  font-size: .68rem;
  line-height: 1.34;
}

/* ---------- SCROLL ---------- */

.ember-sa-scroll {
  position: absolute;
  left: 50%;
  bottom: 10px;
  z-index: 14;
  display: flex;
  align-items: center;
  gap: 11px;
  transform: translateX(-50%);
  color: rgba(225,222,216,.62);
  font-size: .65rem;
  letter-spacing: .10em;
  pointer-events: none;
}

.ember-sa-line {
  width: 26px;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.48)
    );
}

.ember-sa-line-reverse {
  transform: scaleX(-1);
}

.ember-sa-mouse {
  position: relative;
  width: 19px;
  height: 30px;
  border: 1px solid rgba(255,255,255,.58);
  border-radius: 10px;
}

.ember-sa-mouse::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 50%;
  width: 3px;
  height: 6px;
  border-radius: 3px;
  background: var(--ember-sa-orange);
  transform: translateX(-50%);
  animation: emberSaMouse 1.5s ease-in-out infinite;
}

@keyframes emberSaMouse {
  from {
    opacity: 0;
    transform: translate(-50%,0);
  }

  35%,70% {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate(-50%,9px);
  }
}

/* ---------- ENTRADA ---------- */

.ember-sa-enter {
  opacity: 0;
  transform: translateY(24px);
  filter: blur(4px);
  transition:
    opacity .8s var(--ember-sa-ease),
    transform .8s var(--ember-sa-ease),
    filter .8s;
}

.ember-sa-ready .ember-sa-enter {
  opacity: 1;
  transform: none;
  filter: none;
}

.ember-sa-ready .ember-sa-badge {
  transition-delay: .05s;
}

.ember-sa-ready .ember-sa-title {
  transition-delay: .12s;
}

.ember-sa-ready .ember-sa-subtitle {
  transition-delay: .2s;
}

/* ---------- CLICK FX ---------- */

.ember-sa-ripple {
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  pointer-events: none;
  background: rgba(255,255,255,.48);
  box-shadow:
    0 0 13px rgba(255,115,65,.62),
    0 0 30px rgba(255,50,25,.32);
  transform: translate(-50%,-50%) scale(0);
  animation: emberSaRipple .58s ease-out forwards;
}

@keyframes emberSaRipple {
  to {
    opacity: 0;
    transform: translate(-50%,-50%) scale(15);
  }
}

.ember-sa-spark {
  position: fixed;
  z-index: 2147483645;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  pointer-events: none;
  background: #ff9b59;
  box-shadow:
    0 0 8px #ff5b27,
    0 0 18px rgba(255,48,24,.55);
  animation: emberSaSpark .58s ease-out forwards;
}

@keyframes emberSaSpark {
  from {
    opacity: 1;
    transform: translate(-50%,-50%);
  }

  to {
    opacity: 0;
    transform:
      translate(-50%,-50%)
      translate(var(--spark-x),var(--spark-y))
      scale(.15);
  }
}

/* ---------- RESPONSIVE ---------- */

@media (min-width: 1700px) {
  .ember-sa-copy {
    width: 980px;
  }

  .ember-sa-title {
    font-size: 5.15rem !important;
  }

  .ember-sa-benefits {
    width: 960px;
  }
}

@media (min-width: 1181px) and (max-width: 1450px) {
  .ember-sa-copy {
    width: min(820px,56vw);
  }

  .ember-sa-title {
    font-size: clamp(3.45rem,4.45vw,4.25rem) !important;
  }

  .ember-sa-cta {
    width: clamp(195px,15.8vw,235px);
  }

  .ember-sa-benefits {
    width: min(800px,59vw);
  }
}

@media (max-width: 1180px) {
  .ember-sa-hero {
    min-height: 980px;
  }

  .ember-sa-copy {
    width: min(820px,calc(100% - 60px));
    padding: 105px 16px 420px;
  }

  .ember-sa-title {
    font-size: clamp(3.3rem,7vw,4.7rem) !important;
  }

  .ember-sa-cta {
    top: auto;
    bottom: 310px;
    width: min(285px,38vw);
    transform: none;
  }

  .ember-sa-cta:hover {
    transform: translateY(-3px);
  }

  .ember-sa-cta-reviews {
    left: calc(50% - 300px);
  }

  .ember-sa-cta-products {
    right: calc(50% - 300px);
  }

  .ember-sa-server {
    right: 50%;
    bottom: 205px;
    width: min(390px,calc(100% - 40px));
    transform: translateX(50%);
  }

  .ember-sa-benefits {
    bottom: 50px;
    width: min(900px,calc(100% - 40px));
  }
}

@media (max-width: 820px) {
  .ember-sa-hero {
    display: block;
    min-height: auto;
    padding-bottom: 22px;
  }

  .ember-sa-bg {
    background-position: 54% center;
  }

  .ember-sa-copy {
    width: 100%;
    padding: 92px 18px 28px;
  }

  .ember-sa-title {
    font-size: clamp(2.8rem,13vw,4.3rem) !important;
    line-height: .94 !important;
  }

  .ember-sa-title-white,
  .ember-sa-title-fire {
    white-space: normal;
  }

  .ember-sa-subtitle {
    font-size: .96rem !important;
  }

  .ember-sa-cta,
  .ember-sa-server,
  .ember-sa-benefits,
  .ember-sa-scroll {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    transform: none;
  }

  .ember-sa-cta {
    width: min(92%,430px);
    min-height: 61px;
    margin: 11px auto 0;
  }

  .ember-sa-cta:hover {
    transform: translateY(-2px);
  }

  .ember-sa-server {
    width: min(92%,430px);
    margin: 16px auto 0;
  }

  .ember-sa-benefits {
    width: min(92%,680px);
    margin: 22px auto 0;
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .ember-sa-benefit:last-child {
    grid-column: 1 / -1;
  }

  .ember-sa-scroll {
    width: fit-content;
    margin: 23px auto 0;
  }
}

@media (max-width: 520px) {
  .ember-sa-badge {
    padding: 0 13px;
    font-size: .68rem;
  }

  .ember-sa-title {
    font-size: clamp(2.55rem,14vw,3.7rem) !important;
  }

  .ember-sa-benefits {
    grid-template-columns: 1fr;
  }

  .ember-sa-benefit:last-child {
    grid-column: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ember-sa-petal {
    display: none !important;
  }

  .ember-sa-water,
  .ember-sa-title-fire,
  .ember-sa-status-dot,
  .ember-sa-mouse::before {
    animation: none !important;
  }

  .ember-sa-enter {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}


/* ========================================================================
   SELLAUTH V2 FIX — asset directo
   ======================================================================== */

.ember-sa-bg {
  background-image:
    linear-gradient(
      180deg,
      rgba(20,5,5,.24) 0%,
      rgba(12,4,5,.08) 34%,
      rgba(8,5,7,.22) 66%,
      rgba(7,7,10,.69) 100%
    ),
    url("ember-japan-bg.webp") !important;
}


/* ==========================================================================
   EMBERNETWORK — GLASS + NEON DESIGN SYSTEM V10
   Diseñado como PATCH real para SellAuth.
   No reemplaza los datos ni el carrito/productos de SellAuth.
   ========================================================================== */

:root {
  --eg10-bg: #07080c;
  --eg10-bg-2: #0a0b10;
  --eg10-panel: rgba(13, 14, 20, .66);
  --eg10-panel-strong: rgba(12, 12, 18, .82);
  --eg10-panel-soft: rgba(18, 18, 25, .50);
  --eg10-border: rgba(255,255,255,.11);
  --eg10-border-hot: rgba(255,91,35,.58);
  --eg10-orange: #ff5c28;
  --eg10-orange-2: #ff8a4d;
  --eg10-red: #ff3724;
  --eg10-purple: #a05cff;
  --eg10-blue: #4fa7ff;
  --eg10-green: #50e37d;
  --eg10-text: #fff8f3;
  --eg10-muted: rgba(235,231,230,.68);
  --eg10-ease: cubic-bezier(.16,.84,.28,1);
  --eg10-shadow:
    0 20px 55px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.045);
}

/* ---------- GLOBAL PAGE ---------- */

html {
  background: var(--eg10-bg) !important;
}

body {
  overflow-x: hidden;
  background:
    radial-gradient(900px 520px at 15% 18%, rgba(255,68,27,.055), transparent 62%),
    radial-gradient(850px 520px at 84% 58%, rgba(128,64,255,.038), transparent 68%),
    linear-gradient(180deg,#07080c,#08090d 44%,#06070a) !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .43;
  background-image:
    linear-gradient(rgba(255,255,255,.011) 1px, transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.009) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(to bottom,rgba(0,0,0,.15),#000 30%,#000 80%,transparent);
}

#app {
  isolation: isolate;
}

/* ---------- GLASS UTILITIES ADDED BY V10 JS ---------- */

.ember-v10-glass {
  border: 1px solid var(--eg10-border) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.006)),
    rgba(11,12,17,.66) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  backdrop-filter: blur(18px) saturate(1.2);
  box-shadow: var(--eg10-shadow) !important;
}

.ember-v10-glass-hot {
  border-color: rgba(255,96,43,.34) !important;
  box-shadow:
    0 20px 55px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,80,30,.025),
    0 0 28px rgba(255,61,25,.055),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.ember-v10-card {
  --eg10-x: 50%;
  --eg10-y: 50%;
  --eg10-rx: 0deg;
  --eg10-ry: 0deg;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  background:
    radial-gradient(circle at var(--eg10-x) var(--eg10-y),
      rgba(255,123,70,.085),
      transparent 42%),
    linear-gradient(145deg,rgba(255,255,255,.034),rgba(255,255,255,.008)),
    rgba(11,12,17,.77) !important;
  -webkit-backdrop-filter: blur(17px) saturate(1.15);
  backdrop-filter: blur(17px) saturate(1.15);
  box-shadow:
    0 20px 48px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
  transform-style: preserve-3d;
  transition:
    transform .26s var(--eg10-ease),
    border-color .26s ease,
    box-shadow .26s ease,
    filter .26s ease !important;
}

.ember-v10-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0;
  background:
    linear-gradient(115deg,
      transparent 0%,
      transparent 38%,
      rgba(255,255,255,.11) 47%,
      rgba(255,126,72,.12) 51%,
      transparent 60%,
      transparent 100%);
  background-size: 230% 100%;
  background-position: 180% 0;
  transition: opacity .22s ease;
}

.ember-v10-card::after {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: 19;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0;
  box-shadow:
    inset 0 0 0 1px rgba(255,108,56,.55),
    inset 0 0 20px rgba(255,77,30,.05),
    0 0 18px rgba(255,68,25,.08);
  transition: opacity .24s ease;
}

.ember-v10-card:hover {
  border-color: rgba(255,105,52,.42) !important;
  box-shadow:
    0 26px 64px rgba(0,0,0,.34),
    0 0 26px rgba(255,74,26,.08),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
  filter: brightness(1.025);
}

.ember-v10-card:hover::before {
  opacity: 1;
  animation: emberV10CardSheen .9s var(--eg10-ease) forwards;
}

.ember-v10-card:hover::after {
  opacity: 1;
}

@keyframes emberV10CardSheen {
  from { background-position: 180% 0; }
  to   { background-position: -90% 0; }
}

/* ---------- NAVBAR: GLASS + NEON ---------- */

.sa-header {
  position: relative;
  z-index: 50 !important;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(5,7,11,.70) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.28);
  backdrop-filter: blur(22px) saturate(1.28);
  box-shadow:
    0 10px 34px rgba(0,0,0,.20),
    inset 0 -1px 0 rgba(255,89,34,.035);
}

.e4-navbar,
.sa-header nav {
  background:
    linear-gradient(90deg,rgba(12,13,18,.86),rgba(8,9,13,.72)) !important;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

.e4-navitem,
.e4-discord,
.e4-account,
.e4-cart,
.e4-menu,
.sa-header a,
.sa-header button {
  transition:
    translate .18s var(--eg10-ease),
    scale .18s var(--eg10-ease),
    color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background-color .18s ease,
    filter .18s ease !important;
}

.e4-discord,
.e4-account,
.e4-cart,
.e4-menu {
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.006)),
    rgba(15,15,21,.66) !important;
  border-color: rgba(255,255,255,.11) !important;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}

.e4-discord:hover {
  border-color: rgba(160,92,255,.55) !important;
  box-shadow:
    0 0 16px rgba(142,75,255,.13),
    inset 0 0 20px rgba(146,75,255,.035) !important;
}

.e4-account:hover,
.e4-cart:hover,
.e4-menu:hover {
  border-color: rgba(255,90,35,.55) !important;
  box-shadow:
    0 0 18px rgba(255,70,25,.12),
    inset 0 0 18px rgba(255,70,25,.035) !important;
}

.e4-navitem:hover,
.e4-navitem.e4-active {
  color: #fff !important;
  filter: drop-shadow(0 0 7px rgba(255,89,34,.18));
}

/* ---------- HERO: same structure, glass/neon treatment ---------- */

.ember-sa-hero {
  min-height: clamp(800px,calc(100vh - 60px),940px);
  border-bottom: 1px solid rgba(255,87,31,.15) !important;
}

.ember-sa-bg {
  filter: saturate(1.07) contrast(1.055) brightness(.69) !important;
}

.ember-sa-overlay {
  background:
    radial-gradient(circle at 50% 38%,rgba(255,119,60,.075),transparent 46%),
    radial-gradient(circle at 82% 40%,rgba(130,60,255,.025),transparent 34%),
    linear-gradient(180deg,rgba(5,5,9,.12),rgba(8,5,7,.04) 36%,rgba(7,7,11,.34) 75%,rgba(5,6,9,.84)) !important;
}

.ember-sa-badge {
  border-color: rgba(255,107,55,.40) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.008)),
    rgba(18,11,14,.62) !important;
  -webkit-backdrop-filter: blur(19px) saturate(1.2);
  backdrop-filter: blur(19px) saturate(1.2);
  box-shadow:
    0 12px 34px rgba(0,0,0,.25),
    0 0 22px rgba(255,70,25,.055),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.ember-sa-title {
  text-shadow:
    0 5px 0 rgba(32,32,36,.76),
    0 11px 28px rgba(0,0,0,.55) !important;
}

.ember-sa-title-fire {
  background:
    linear-gradient(
      180deg,
      #ffae72 0%,
      #ff6740 22%,
      #f04225 57%,
      #b82016 100%
    ) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  filter:
    drop-shadow(0 5px 0 rgba(79,13,9,.68))
    drop-shadow(0 0 12px rgba(255,71,27,.16)) !important;
}

.ember-sa-cta {
  border-color: rgba(255,99,45,.52) !important;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,112,58,.085),transparent 55%),
    linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.004)),
    rgba(11,11,16,.66) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.22);
  backdrop-filter: blur(20px) saturate(1.22);
  box-shadow:
    0 17px 45px rgba(0,0,0,.29),
    0 0 0 1px rgba(255,76,29,.025),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.ember-sa-cta:hover {
  border-color: rgba(255,139,80,.88) !important;
  box-shadow:
    0 0 20px rgba(255,83,30,.18),
    0 0 46px rgba(255,55,25,.09),
    0 20px 52px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.ember-sa-server {
  border: 1px solid rgba(255,110,58,.32) !important;
  background:
    radial-gradient(circle at 50% -15%,rgba(255,92,39,.09),transparent 55%),
    linear-gradient(145deg,rgba(255,255,255,.048),rgba(255,255,255,.008)),
    rgba(11,11,17,.70) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.25);
  backdrop-filter: blur(22px) saturate(1.25);
  box-shadow:
    0 22px 54px rgba(0,0,0,.34),
    0 0 24px rgba(255,72,27,.055),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.ember-sa-copy-ip {
  border-color: rgba(255,114,58,.68) !important;
  background:
    linear-gradient(135deg,rgba(190,43,24,.91),rgba(139,25,16,.91)) !important;
  box-shadow:
    0 0 17px rgba(255,77,29,.15),
    inset 0 1px 0 rgba(255,255,255,.09) !important;
}

.ember-sa-benefit {
  border-color: rgba(255,255,255,.115) !important;
  background:
    radial-gradient(circle at 50% -25%,rgba(255,106,50,.055),transparent 52%),
    linear-gradient(145deg,rgba(255,255,255,.036),rgba(255,255,255,.005)),
    rgba(10,11,16,.64) !important;
  -webkit-backdrop-filter: blur(19px) saturate(1.18);
  backdrop-filter: blur(19px) saturate(1.18);
  box-shadow:
    0 18px 43px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.ember-sa-benefit::after {
  left: 7% !important;
  right: 7% !important;
  height: 1px !important;
  opacity: .72;
}

.ember-sa-benefit:hover {
  border-color: rgba(255,106,53,.46) !important;
  box-shadow:
    0 24px 52px rgba(0,0,0,.32),
    0 0 22px rgba(255,76,28,.075),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* ---------- BELOW HERO: typography ---------- */

.ember-v10-section {
  position: relative;
  isolation: isolate;
}

.ember-v10-section::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -20px;
  z-index: -1;
  width: min(760px,90%);
  height: 210px;
  transform: translateX(-50%);
  pointer-events: none;
  opacity: .35;
  filter: blur(40px);
  background: radial-gradient(ellipse,rgba(255,68,27,.05),transparent 68%);
}

.ember-v10-section h1,
.ember-v10-section h2,
.ember-v10-section h3 {
  color: var(--eg10-text) !important;
  letter-spacing: -.025em;
}

.ember-v10-section > h2,
.ember-v10-section-heading {
  text-align: center;
  text-shadow: 0 8px 25px rgba(0,0,0,.35);
}

.ember-v10-accent-word {
  color: var(--eg10-orange) !important;
  text-shadow: 0 0 17px rgba(255,77,29,.12);
}

/* ---------- CATEGORY SECTION ---------- */

.ember-v10-category-section {
  padding-top: clamp(48px,7vw,82px) !important;
  padding-bottom: clamp(44px,6vw,72px) !important;
}

.ember-v10-category-grid {
  width: min(1120px,calc(100% - 34px));
  margin-left: auto !important;
  margin-right: auto !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
}

.ember-v10-category-card {
  min-height: 245px;
  display: grid !important;
  grid-template-columns: minmax(280px,1.08fr) minmax(260px,.92fr) !important;
  align-items: stretch !important;
  padding: 0 !important;
  border-color: rgba(255,91,36,.36) !important;
}

.ember-v10-category-card img {
  width: 100% !important;
  height: 100% !important;
  min-height: 245px;
  object-fit: cover !important;
  border-radius: 15px 0 0 15px !important;
  transition:
    transform .75s var(--eg10-ease),
    filter .5s ease !important;
}

.ember-v10-category-card:hover img {
  transform: scale(1.035);
  filter: saturate(1.08) contrast(1.03);
}

.ember-v10-category-copy {
  min-width: 0;
  padding: clamp(25px,4vw,48px) !important;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  position: relative;
  background:
    linear-gradient(90deg,rgba(16,16,23,.42),rgba(8,9,14,.80));
}

.ember-v10-category-copy::after {
  content: "→";
  position: absolute;
  right: 28px;
  top: 50%;
  color: var(--eg10-orange);
  font-size: 1.7rem;
  transform: translateY(-50%);
  text-shadow: 0 0 15px rgba(255,78,28,.22);
  transition: translate .24s var(--eg10-ease);
}

.ember-v10-category-card:hover .ember-v10-category-copy::after {
  translate: 6px 0;
}

/* ---------- PRODUCTS ---------- */

.ember-v10-products-section {
  padding-top: clamp(28px,4vw,54px) !important;
  padding-bottom: clamp(70px,8vw,104px) !important;
}

.ember-v10-products-grid {
  width: min(1160px,calc(100% - 30px));
  margin-left: auto !important;
  margin-right: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 18px !important;
}

.ember-v10-product-card {
  min-width: 0;
  border-color: rgba(255,103,49,.28) !important;
}

.ember-v10-product-card img {
  transition:
    transform .7s var(--eg10-ease),
    filter .45s ease !important;
}

.ember-v10-product-card:hover img {
  transform: scale(1.035);
  filter: saturate(1.08) brightness(1.035);
}

/* Product titles/prices when SellAuth's markup provides them */
.ember-v10-product-card h3,
.ember-v10-product-card h4,
.ember-v10-product-card [class*="title"] {
  color: #fff !important;
  font-weight: 800 !important;
}

.ember-v10-product-card [class*="price"],
.ember-v10-product-card [data-price] {
  color: #ff8c50 !important;
  font-weight: 800 !important;
  text-shadow: 0 0 12px rgba(255,84,32,.10);
}

/* ---------- GENERIC SELLAUTH CARDS / REVIEWS / PAGE CONTENT ---------- */

.ember-v10-auto-card {
  border-radius: 16px !important;
}

.ember-v10-auto-card:hover {
  border-color: rgba(255,103,50,.32) !important;
}

.ember-v10-content-page main,
.ember-v10-content-page [role="main"] {
  position: relative;
}

/* ---------- FORMS / INPUTS ---------- */

input,
textarea,
select {
  border-color: rgba(255,255,255,.105) !important;
  background: rgba(12,13,19,.65) !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

input:focus,
textarea:focus,
select:focus {
  border-color: rgba(255,96,43,.48) !important;
  box-shadow:
    0 0 0 3px rgba(255,82,31,.055),
    0 0 20px rgba(255,67,25,.05) !important;
}

/* ---------- MODALS / CART / SEARCH / LOGIN ---------- */

[role="dialog"],
[class*="modal"],
[class*="drawer"],
[class*="cart-panel"],
[class*="search-modal"] {
  -webkit-backdrop-filter: blur(22px) saturate(1.16);
  backdrop-filter: blur(22px) saturate(1.16);
}

[role="dialog"] > div,
[class*="modal"] > div,
[class*="drawer"] > div {
  border-color: rgba(255,255,255,.11) !important;
}

/* ---------- FOOTER ---------- */

footer {
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(255,101,48,.12) !important;
  background:
    radial-gradient(600px 180px at 50% 0%,rgba(255,66,25,.045),transparent 70%),
    rgba(7,8,12,.76) !important;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

/* ---------- SCROLL REVEAL ---------- */

.ember-v10-reveal {
  opacity: 0;
  translate: 0 25px;
  scale: .985;
  filter: blur(7px);
  transition:
    opacity .8s var(--eg10-ease),
    translate .8s var(--eg10-ease),
    scale .8s var(--eg10-ease),
    filter .8s ease;
  transition-delay: var(--eg10-delay,0ms);
}

.ember-v10-reveal.ember-v10-visible {
  opacity: 1;
  translate: 0 0;
  scale: 1;
  filter: blur(0);
}

/* ---------- PAGE SCROLL BAR ---------- */

#ember-v10-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483600;
  width: var(--eg10-scroll,0%);
  height: 2px;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(255,57,24,.2),
      #ff5c28 42%,
      #ffb06f 76%,
      #9b5cff);
  box-shadow:
    0 0 8px rgba(255,74,27,.8),
    0 0 18px rgba(255,58,24,.34);
}

/* ---------- AMBIENT EMBERS ---------- */

#ember-v10-ambient {
  position: fixed;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

.ember-v10-float-ember {
  position: absolute;
  left: var(--eg10-left);
  bottom: -30px;
  width: var(--eg10-size);
  height: var(--eg10-size);
  border-radius: 50%;
  opacity: 0;
  background: #ff7d3d;
  box-shadow:
    0 0 8px rgba(255,79,28,.72),
    0 0 18px rgba(255,58,22,.25);
  animation:
    emberV10Float var(--eg10-duration) linear infinite;
  animation-delay: var(--eg10-delay);
}

.ember-v10-float-ember:nth-child(5n) {
  background: #a45fff;
  box-shadow:
    0 0 8px rgba(164,95,255,.58),
    0 0 18px rgba(139,72,255,.20);
}

@keyframes emberV10Float {
  0% {
    opacity: 0;
    translate: 0 0;
  }
  12% { opacity: var(--eg10-opacity); }
  82% { opacity: calc(var(--eg10-opacity) * .7); }
  100% {
    opacity: 0;
    translate: var(--eg10-drift) -108vh;
  }
}

/* ---------- RESPONSIVE: reference-like mobile ---------- */

@media (max-width: 1180px) {
  .ember-sa-hero {
    min-height: 980px;
  }
}

@media (max-width: 900px) {
  .ember-sa-hero {
    display: block !important;
    min-height: auto !important;
    padding-bottom: 24px !important;
  }

  .ember-sa-copy {
    width: 100% !important;
    padding: 88px 22px 22px !important;
  }

  .ember-sa-title {
    font-size: clamp(2.7rem,8.5vw,4.35rem) !important;
    line-height: .94 !important;
  }

  .ember-sa-subtitle {
    max-width: 660px;
    margin-top: 20px !important;
  }

  /* Buttons side-by-side like the concept image. */
  .ember-sa-cta {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    display: inline-flex !important;
    vertical-align: top;
    width: min(42vw,340px) !important;
    min-height: 64px !important;
    margin: 15px 6px 0 !important;
    transform: none !important;
  }

  .ember-sa-cta:hover {
    transform: translateY(-2px) !important;
  }

  .ember-sa-cta-reviews {
    margin-left: calc((100% - min(86vw,692px))/2) !important;
  }

  .ember-sa-server {
    position: relative !important;
    inset: auto !important;
    width: min(520px,86%) !important;
    margin: 18px auto 0 !important;
    transform: none !important;
  }

  .ember-sa-benefits {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: min(94%,830px) !important;
    margin: 24px auto 0 !important;
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
    gap: 10px !important;
    transform: none !important;
  }

  .ember-sa-benefit {
    min-height: 124px !important;
    padding: 13px 8px 12px !important;
  }

  .ember-sa-benefit:last-child {
    grid-column: auto !important;
  }

  .ember-sa-scroll {
    position: relative !important;
    inset: auto !important;
    width: fit-content !important;
    margin: 20px auto 0 !important;
    transform: none !important;
  }

  .ember-v10-category-card {
    min-height: 250px;
    grid-template-columns: minmax(265px,1.02fr) minmax(245px,.98fr) !important;
  }

  .ember-v10-products-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width: 670px) {
  .ember-sa-copy {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .ember-sa-title {
    font-size: clamp(2.45rem,12vw,3.75rem) !important;
  }

  .ember-sa-cta {
    display: flex !important;
    width: min(92%,430px) !important;
    margin: 10px auto 0 !important;
  }

  .ember-sa-cta-reviews {
    margin-left: auto !important;
  }

  .ember-sa-benefits {
    overflow-x: auto;
    overflow-y: visible;
    justify-content: start;
    grid-template-columns: repeat(5,minmax(135px,1fr)) !important;
    scroll-snap-type: x proximity;
    padding: 4px 2px 10px;
    scrollbar-width: none;
  }

  .ember-sa-benefits::-webkit-scrollbar {
    display: none;
  }

  .ember-sa-benefit {
    scroll-snap-align: start;
  }

  .ember-v10-category-card {
    grid-template-columns: 1fr !important;
  }

  .ember-v10-category-card img {
    min-height: 210px;
    max-height: 260px;
    border-radius: 15px 15px 0 0 !important;
  }

  .ember-v10-category-copy {
    padding: 24px 24px 28px !important;
  }

  .ember-v10-products-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 470px) {
  .ember-sa-title {
    font-size: clamp(2.2rem,12.8vw,3.2rem) !important;
  }

  .ember-sa-subtitle {
    font-size: .89rem !important;
  }

  .ember-sa-server {
    width: min(94%,430px) !important;
  }

  .ember-v10-category-grid,
  .ember-v10-products-grid {
    width: calc(100% - 24px);
  }
}

/* ---------- ACCESSIBILITY / LOW MOTION ---------- */

@media (pointer: coarse), (max-width: 820px) {
.ember-v10-card:hover {
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  #ember-v10-ambient,
  #ember-v10-scroll-progress {
    display: none !important;
  }

  .ember-v10-reveal {
    opacity: 1 !important;
    translate: 0 0 !important;
    scale: 1 !important;
    filter: none !important;
    transition: none !important;
  }
}
/* ========================================================================
   EMBERNETWORK — NEON UI PATCH V11
   Mejora visual no destructiva: botones, navbar, cards y CTAs.
   ======================================================================== */

:root {
  --ember-neon-orange: #ff5b24;
  --ember-neon-orange-hot: #ff321e;
  --ember-neon-orange-soft: #ff9a61;
  --ember-neon-purple: #9b5cff;
  --ember-neon-purple-hot: #c084ff;
  --ember-neon-glow: rgba(255, 78, 31, .34);
  --ember-neon-purple-glow: rgba(155, 92, 255, .34);
}

/* ---------- BOTONES: BASE NEON ---------- */

.ember-sa-cta,
.ember-sa-copy-ip,
.e4-discord,
.e4-account,
.e4-cart,
.e4-menu {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}

.ember-sa-cta::before,
.ember-sa-copy-ip::before,
.e4-discord::before,
.e4-account::before,
.e4-cart::before,
.e4-menu::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 115%, rgba(255,112,58,.30), transparent 48%),
    linear-gradient(115deg, transparent 20%, rgba(255,255,255,.08) 46%, transparent 72%);
  transform: scale(.96);
  transition:
    opacity .24s ease,
    transform .28s cubic-bezier(.16,.84,.28,1);
}

.ember-sa-cta::after,
.ember-sa-copy-ip::after,
.e4-discord::after,
.e4-account::after,
.e4-cart::after,
.e4-menu::after {
  content: "";
  position: absolute;
  top: -45%;
  left: -62%;
  z-index: 2;
  width: 38%;
  height: 190%;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.30), transparent);
  transform: rotate(18deg) translateX(0);
}

.ember-sa-cta:hover::before,
.ember-sa-copy-ip:hover::before,
.e4-discord:hover::before,
.e4-account:hover::before,
.e4-cart:hover::before,
.e4-menu:hover::before {
  opacity: 1;
  transform: scale(1);
}

.ember-sa-cta:hover::after,
.ember-sa-copy-ip:hover::after,
.e4-discord:hover::after,
.e4-account:hover::after,
.e4-cart:hover::after,
.e4-menu:hover::after {
  opacity: .82;
  animation: emberNeonSweep .72s cubic-bezier(.18,.72,.2,1) forwards;
}

@keyframes emberNeonSweep {
  from { transform: rotate(18deg) translateX(0); }
  to   { transform: rotate(18deg) translateX(460%); }
}

/* ---------- HERO CTAs ---------- */

.ember-sa-cta {
  border-color: rgba(255,102,47,.62) !important;
  box-shadow:
    0 17px 45px rgba(0,0,0,.30),
    0 0 0 1px rgba(255,91,36,.045),
    0 0 17px rgba(255,72,28,.10),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

.ember-sa-cta:hover {
  border-color: rgba(255,162,106,.96) !important;
  filter: brightness(1.08) saturate(1.08);
  box-shadow:
    0 0 7px rgba(255,174,120,.40),
    0 0 22px rgba(255,84,31,.34),
    0 0 58px rgba(255,50,24,.16),
    0 22px 56px rgba(0,0,0,.38),
    inset 0 0 23px rgba(255,85,32,.065),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.ember-sa-cta:hover .ember-sa-cta-icon,
.ember-sa-cta:hover .ember-sa-arrow {
  color: #ffb07d !important;
  text-shadow:
    0 0 7px rgba(255,196,155,.74),
    0 0 16px rgba(255,91,35,.72),
    0 0 28px rgba(255,50,24,.30) !important;
}

.ember-sa-cta:active,
.ember-sa-copy-ip:active,
.e4-discord:active,
.e4-account:active,
.e4-cart:active,
.e4-menu:active {
  scale: .975;
  filter: brightness(.97);
}

/* ---------- COPIAR IP: BOTÓN PRINCIPAL ---------- */

.ember-sa-copy-ip {
  border-color: rgba(255,142,84,.88) !important;
  background:
    radial-gradient(circle at 50% -50%,rgba(255,181,127,.23),transparent 62%),
    linear-gradient(135deg,#c6331e 0%,#a32417 48%,#7e1b13 100%) !important;
  box-shadow:
    0 0 9px rgba(255,142,85,.24),
    0 0 24px rgba(255,70,25,.20),
    inset 0 1px 0 rgba(255,255,255,.13),
    inset 0 -11px 25px rgba(84,7,3,.20) !important;
}

.ember-sa-copy-ip:hover {
  filter: brightness(1.12) saturate(1.12) !important;
  box-shadow:
    0 0 8px rgba(255,201,165,.58),
    0 0 25px rgba(255,83,29,.42),
    0 0 54px rgba(255,45,20,.20),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 0 21px rgba(255,118,62,.10) !important;
}

/* ---------- NAVBAR ACTIONS ---------- */

.e4-account:hover,
.e4-cart:hover,
.e4-menu:hover {
  border-color: rgba(255,127,69,.82) !important;
  background:
    radial-gradient(circle at 50% 120%,rgba(255,83,31,.16),transparent 54%),
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.009)),
    rgba(15,15,21,.76) !important;
  box-shadow:
    0 0 7px rgba(255,174,122,.22),
    0 0 22px rgba(255,73,27,.25),
    inset 0 0 18px rgba(255,73,27,.055) !important;
}

/* Discord tiene identidad violeta propia. */
.e4-discord {
  border-color: rgba(155,92,255,.34) !important;
  box-shadow:
    0 0 0 1px rgba(155,92,255,.025),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.e4-discord::before {
  background:
    radial-gradient(circle at 50% 115%, rgba(155,92,255,.34), transparent 50%),
    linear-gradient(115deg, transparent 20%, rgba(206,170,255,.12) 46%, transparent 72%);
}

.e4-discord:hover {
  border-color: rgba(190,133,255,.92) !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 50% 120%,rgba(155,92,255,.19),transparent 55%),
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.007)),
    rgba(16,13,24,.78) !important;
  box-shadow:
    0 0 7px rgba(221,196,255,.32),
    0 0 22px rgba(155,92,255,.34),
    0 0 46px rgba(121,61,255,.14),
    inset 0 0 20px rgba(155,92,255,.075) !important;
}

.e4-discord:hover i,
.e4-discord:hover svg {
  filter:
    drop-shadow(0 0 5px rgba(221,197,255,.82))
    drop-shadow(0 0 12px rgba(155,92,255,.60));
}

/* ---------- NAV LINKS: SUBRAYADO DE ENERGÍA ---------- */

.e4-navitem {
  position: relative;
}

.e4-navitem::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 3px;
  height: 1px;
  border-radius: 99px;
  opacity: 0;
  background: linear-gradient(90deg,transparent,#ff9b65,transparent);
  box-shadow:
    0 0 7px rgba(255,105,52,.62),
    0 0 15px rgba(255,58,24,.30);
  transform: scaleX(.45);
  transition: opacity .2s ease, transform .25s cubic-bezier(.16,.84,.28,1);
}

.e4-navitem:hover::after,
.e4-navitem.e4-active::after {
  opacity: 1;
  transform: scaleX(1);
}

/* ---------- CARDS: BORDE NEÓN SUAVE ---------- */

.ember-v10-card,
.ember-sa-benefit,
.ember-sa-server {
  transition:
    transform .24s cubic-bezier(.16,.84,.28,1),
    border-color .24s ease,
    box-shadow .24s ease,
    filter .24s ease !important;
}

.ember-v10-card:hover,
.ember-sa-benefit:hover {
  border-color: rgba(255,111,56,.38) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.34),
    0 0 22px rgba(255,72,27,.10),
    0 0 48px rgba(255,48,22,.045),
    inset 0 1px 0 rgba(255,255,255,.065) !important;
}

.ember-sa-server:hover {
  border-color: rgba(255,123,65,.48) !important;
  box-shadow:
    0 25px 62px rgba(0,0,0,.39),
    0 0 28px rgba(255,75,28,.12),
    0 0 56px rgba(255,43,20,.055),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

/* ---------- STATUS ONLINE MÁS VIVO ---------- */

.ember-sa-status-dot {
  box-shadow:
    0 0 7px rgba(72,255,128,.88),
    0 0 18px rgba(50,211,99,.48),
    0 0 32px rgba(50,211,99,.18) !important;
}

/* ---------- ACCESIBILIDAD ---------- */

.ember-sa-cta:focus-visible,
.ember-sa-copy-ip:focus-visible,
.e4-discord:focus-visible,
.e4-account:focus-visible,
.e4-cart:focus-visible,
.e4-menu:focus-visible,
.e4-navitem:focus-visible {
  outline: 2px solid rgba(255,170,116,.94) !important;
  outline-offset: 3px;
  box-shadow:
    0 0 0 3px rgba(255,91,36,.15),
    0 0 24px rgba(255,72,27,.26) !important;
}

.e4-discord:focus-visible {
  outline-color: rgba(200,151,255,.96) !important;
  box-shadow:
    0 0 0 3px rgba(155,92,255,.16),
    0 0 26px rgba(155,92,255,.29) !important;
}

@media (prefers-reduced-motion: reduce) {
  .ember-sa-cta::after,
  .ember-sa-copy-ip::after,
  .e4-discord::after,
  .e4-account::after,
  .e4-cart::after,
  .e4-menu::after {
    animation: none !important;
    display: none !important;
  }
}


/* ========================================================================
   HERO VIDEO BACKGROUND PATCH
   Sube tu video a Assets con el nombre: ember-background.mp4
   ======================================================================== */

.ember-sa-hero {
  overflow: hidden;
}

.ember-video-bg {
  position: absolute;
  inset: 0;
  z-index: -6;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  transition: opacity .55s ease;
}

.ember-video-bg.is-ready {
  opacity: 1;
}

.ember-video-bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.14) contrast(1.06) brightness(.80) sepia(.22) hue-rotate(-10deg);
  transform: scale(1.04);
  will-change: transform;
}

.ember-video-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,126,62,.16) 0%, rgba(255,111,36,.12) 28%, rgba(146,48,18,.26) 60%, rgba(8,8,12,.74) 100%),
    radial-gradient(circle at 50% 36%, rgba(255,174,91,.14), transparent 46%),
    linear-gradient(90deg, rgba(7,8,11,.28), rgba(7,8,11,.06) 35%, rgba(7,8,11,.06) 68%, rgba(7,8,11,.22));
}

.ember-sa-hero.has-video-bg .ember-sa-bg {
  z-index: -7;
  opacity: .12 !important;
  filter: saturate(.9) brightness(.58);
}

.ember-sa-hero.has-video-bg .ember-sa-water {
  opacity: .74;
}

@media (max-width: 820px) {
  .ember-video-bg video {
    object-position: 58% center;
  }
}

/* ========================================================================
   EMBERNETWORK — NEON BUTTONS + HERO CTA LAYOUT V12
   - Todos los botones reciben glow neón sutil en reposo.
   - Discord conserva identidad violeta.
   - CTA de productos es el primario.
   - Botones principales del hero quedan alineados y separados.
   ======================================================================== */

:root {
  --ember-btn-glow-1: rgba(255, 144, 84, .28);
  --ember-btn-glow-2: rgba(255, 82, 31, .22);
  --ember-btn-glow-3: rgba(255, 48, 24, .10);
}

/* ---------- NEÓN GENERAL PARA BOTONES DEL SITIO ---------- */

#app button:not(:disabled),
#app [role="button"],
#app a[class*="btn"],
#app a[class*="button"],
.ember-sa-cta,
.ember-sa-copy-ip,
.e4-account,
.e4-cart,
.e4-menu {
  transition:
    transform .22s cubic-bezier(.16,.84,.28,1),
    translate .22s cubic-bezier(.16,.84,.28,1),
    scale .18s cubic-bezier(.16,.84,.28,1),
    border-color .22s ease,
    box-shadow .22s ease,
    filter .22s ease,
    background-color .22s ease !important;
}

/* Glow tenue SIEMPRE visible, como el botón de Discord. */
#app button:not(:disabled),
#app [role="button"],
#app a[class*="btn"],
#app a[class*="button"] {
  border-color: rgba(255, 108, 54, .42) !important;
  box-shadow:
    0 0 5px rgba(255, 154, 97, .14),
    0 0 15px rgba(255, 83, 31, .11),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

#app button:not(:disabled):hover,
#app [role="button"]:hover,
#app a[class*="btn"]:hover,
#app a[class*="button"]:hover {
  border-color: rgba(255, 159, 101, .88) !important;
  filter: brightness(1.06) saturate(1.05);
  box-shadow:
    0 0 7px rgba(255, 197, 154, .34),
    0 0 21px rgba(255, 83, 31, .28),
    0 0 42px rgba(255, 48, 24, .11),
    inset 0 0 18px rgba(255, 88, 35, .055),
    inset 0 1px 0 rgba(255,255,255,.09) !important;
}

/* ---------- NAVBAR: LOS 3 BOTONES COMO UNA FAMILIA VISUAL ---------- */

.e4-account,
.e4-cart,
.e4-menu {
  border-color: rgba(255, 108, 54, .54) !important;
  box-shadow:
    0 0 5px rgba(255, 154, 97, .18),
    0 0 16px rgba(255, 76, 29, .14),
    inset 0 1px 0 rgba(255,255,255,.065) !important;
}

.e4-account:hover,
.e4-cart:hover,
.e4-menu:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 164, 108, .94) !important;
  box-shadow:
    0 0 7px rgba(255, 207, 172, .38),
    0 0 22px rgba(255, 84, 31, .31),
    0 0 44px rgba(255, 48, 24, .12),
    inset 0 0 18px rgba(255, 82, 30, .07) !important;
}

/* Discord: violeta + un toque naranja, igual al look que gustó. */
#app .e4-discord,
.e4-discord {
  border-color: rgba(164, 103, 255, .72) !important;
  box-shadow:
    0 0 6px rgba(216, 188, 255, .24),
    0 0 18px rgba(155, 92, 255, .24),
    0 0 28px rgba(255, 78, 31, .075),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

#app .e4-discord:hover,
.e4-discord:hover {
  transform: translateY(-2px);
  border-color: rgba(205, 160, 255, .98) !important;
  box-shadow:
    0 0 8px rgba(231, 211, 255, .42),
    0 0 24px rgba(155, 92, 255, .38),
    0 0 48px rgba(119, 54, 255, .16),
    0 0 26px rgba(255, 75, 28, .09),
    inset 0 0 20px rgba(155, 92, 255, .09) !important;
}

/* ---------- HERO: JERARQUÍA Y SEPARACIÓN ---------- */

.ember-sa-cta {
  min-height: 66px !important;
  border-radius: 15px !important;
  border-color: rgba(255, 111, 58, .62) !important;
  box-shadow:
    0 0 6px rgba(255, 170, 113, .18),
    0 0 18px rgba(255, 80, 30, .16),
    0 17px 45px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

/* Reseñas = secundaria, más glass. */
.ember-sa-cta-reviews {
  background:
    radial-gradient(circle at 50% 115%,rgba(255,92,35,.10),transparent 54%),
    linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.006)),
    rgba(12,12,17,.72) !important;
}

/* Productos = acción principal, un poquito más encendida. */
.ember-sa-cta-products {
  border-color: rgba(255, 135, 76, .78) !important;
  background:
    radial-gradient(circle at 50% 115%,rgba(255,97,38,.20),transparent 56%),
    linear-gradient(145deg,rgba(255,91,36,.12),rgba(255,255,255,.008)),
    rgba(14,11,15,.78) !important;
  box-shadow:
    0 0 7px rgba(255, 187, 139, .24),
    0 0 22px rgba(255, 80, 30, .23),
    0 0 46px rgba(255, 48, 24, .075),
    0 18px 46px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.085) !important;
}

.ember-sa-cta:hover {
  transform: translateY(-50%) translateY(-4px) scale(1.018) !important;
}

.ember-sa-cta-products:hover {
  box-shadow:
    0 0 8px rgba(255, 218, 185, .42),
    0 0 27px rgba(255, 89, 34, .38),
    0 0 58px rgba(255, 49, 23, .16),
    0 22px 56px rgba(0,0,0,.38),
    inset 0 0 22px rgba(255, 91, 36, .09),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

/* Desktop: los dos CTAs quedan juntos, con aire entre ellos y alineados a la derecha. */
@media (min-width: 1181px) {
  .ember-sa-cta {
    top: 47.5% !important;
    width: clamp(220px, 14.4vw, 252px) !important;
    min-height: 66px !important;
  }

  .ember-sa-cta-products {
    left: auto !important;
    right: clamp(40px, 4.5vw, 82px) !important;
  }

  .ember-sa-cta-reviews {
    left: auto !important;
    right: calc(clamp(40px, 4.5vw, 82px) + clamp(220px, 14.4vw, 252px) + 16px) !important;
  }

  /* La tarjeta del servidor comparte la misma línea visual del botón principal. */
  .ember-sa-server {
    right: clamp(40px, 4.5vw, 82px) !important;
  }
}

/* Tablet: dos botones centrados, separados y del mismo tamaño. */
@media (min-width: 671px) and (max-width: 1180px) {
  .ember-sa-cta {
    width: min(41vw, 330px) !important;
    margin-top: 18px !important;
  }

  .ember-sa-cta-reviews {
    margin-right: 7px !important;
  }

  .ember-sa-cta-products {
    margin-left: 7px !important;
  }
}

/* Móvil: stack limpio y ancho, sin perder el neón. */
@media (max-width: 670px) {
  .ember-sa-cta {
    width: min(92%, 430px) !important;
    min-height: 61px !important;
    margin: 11px auto 0 !important;
    transform: none !important;
  }

  .ember-sa-cta:hover {
    transform: translateY(-2px) scale(1.006) !important;
  }

  .ember-sa-cta-products {
    margin-top: 12px !important;
  }
}

/* Respeta reducción de movimiento. */
@media (prefers-reduced-motion: reduce) {
  .ember-sa-cta:hover,
  .e4-discord:hover,
  .e4-account:hover,
  .e4-cart:hover,
  .e4-menu:hover {
    transform: none !important;
  }
}

/* ========================================================================
   EMBERNETWORK — HERO CTA POSITION FIX V13
   Corrige el solapamiento/separación exagerada de VER RESEÑAS / VER PRODUCTOS.
   Desktop: ambos quedan juntos y centrados debajo del subtítulo.
   ======================================================================== */

@media (min-width: 1181px) {
  .ember-sa-cta {
    top: 62.5% !important;
    width: clamp(205px, 13.2vw, 232px) !important;
    min-height: 62px !important;
  }

  .ember-sa-cta-reviews {
    left: calc(50% - 244px) !important;
    right: auto !important;
  }

  .ember-sa-cta-products {
    left: calc(50% + 12px) !important;
    right: auto !important;
  }

  .ember-sa-server {
    right: clamp(32px, 3.2vw, 56px) !important;
    bottom: 150px !important;
  }
}

/* Pantallas desktop más estrechas: conserva la pareja centrada sin tocar el título. */
@media (min-width: 1181px) and (max-width: 1450px) {
  .ember-sa-cta {
    top: 63.5% !important;
    width: 210px !important;
  }

  .ember-sa-cta-reviews {
    left: calc(50% - 222px) !important;
  }

  .ember-sa-cta-products {
    left: calc(50% + 12px) !important;
  }
}

/* Tablet: botones en una misma fila, centrados y sin márgenes raros. */
@media (min-width: 821px) and (max-width: 1180px) {
  .ember-sa-cta {
    position: absolute !important;
    top: auto !important;
    bottom: 300px !important;
    width: min(280px, 36vw) !important;
    margin: 0 !important;
    transform: none !important;
  }

  .ember-sa-cta-reviews {
    left: calc(50% - 290px) !important;
    right: auto !important;
  }

  .ember-sa-cta-products {
    left: calc(50% + 10px) !important;
    right: auto !important;
  }

  .ember-sa-cta:hover {
    transform: translateY(-3px) scale(1.012) !important;
  }
}

/* El brillo se queda premium: más concentrado, no una nube gigante alrededor. */
.ember-sa-cta {
  box-shadow:
    0 0 5px rgba(255, 185, 135, .18),
    0 0 15px rgba(255, 82, 31, .18),
    0 14px 38px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

.ember-sa-cta-products {
  box-shadow:
    0 0 6px rgba(255, 191, 145, .23),
    0 0 18px rgba(255, 80, 30, .24),
    0 16px 42px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.085) !important;
}


/* ========================================================================
   EMBERNETWORK — HERO CTA GROUP FIX V14
   Los CTAs viven dentro del bloque de texto: estable, responsive y sin absolute.
   ======================================================================== */

.ember-sa-copy {
  padding-bottom: 250px !important;
}

.ember-sa-cta-group {
  position: relative !important;
  z-index: 15 !important;
  width: min(100%, 520px);
  margin: 28px auto 0 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 16px !important;
}

.ember-sa-cta-group .ember-sa-cta {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: 252px !important;
  min-width: 0 !important;
  min-height: 62px !important;
  margin: 0 !important;
  transform: none !important;
  translate: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.ember-sa-cta-group .ember-sa-cta:hover {
  transform: translateY(-4px) scale(1.015) !important;
}

.ember-sa-cta-group .ember-sa-cta-reviews { order: 1; }
.ember-sa-cta-group .ember-sa-cta-products { order: 2; }

@media (min-width: 1181px) {
  .ember-sa-copy { padding-bottom: 225px !important; }
  .ember-sa-cta-group { margin-top: 27px !important; }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .ember-sa-copy { padding-bottom: 360px !important; }
  .ember-sa-cta-group {
    width: min(100%, 590px);
    margin-top: 26px !important;
  }
}

@media (max-width: 820px) {
  .ember-sa-copy { padding-bottom: 30px !important; }
  .ember-sa-cta-group {
    width: min(92%, 430px);
    margin: 24px auto 0 !important;
    flex-direction: column !important;
    gap: 11px !important;
  }
  .ember-sa-cta-group .ember-sa-cta {
    width: 100% !important;
    max-width: none !important;
    min-height: 59px !important;
  }
}


/* ========================================================================
   EMBERNETWORK — LOWER PAGE EMBER RED AMBIENCE V15
   Une Category + Products con un fondo borgoña/negro que continúa el hero.
   ======================================================================== */

/* Transición desde el hero hacia la zona de tienda. */
.ember-v10-category-section {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(900px 430px at 14% 12%, rgba(255, 76, 28, .105), transparent 64%),
    radial-gradient(760px 420px at 88% 64%, rgba(150, 22, 14, .105), transparent 66%),
    linear-gradient(180deg,
      #08090d 0%,
      #0d0809 18%,
      #140807 52%,
      #180a08 100%) !important;
  border-top: 1px solid rgba(255, 92, 38, .16) !important;
  box-shadow:
    inset 0 34px 65px rgba(0,0,0,.30),
    inset 0 -35px 70px rgba(0,0,0,.08) !important;
}

/* Línea/fuego ambiental superior muy sutil. */
.ember-v10-category-section::after {
  content: "";
  position: absolute;
  top: -1px;
  left: 50%;
  z-index: 0;
  width: min(1120px, 84vw);
  height: 2px;
  transform: translateX(-50%);
  pointer-events: none;
  background: linear-gradient(90deg,
    transparent,
    rgba(255, 72, 27, .12) 18%,
    rgba(255, 116, 56, .62) 50%,
    rgba(255, 72, 27, .12) 82%,
    transparent);
  box-shadow:
    0 0 15px rgba(255, 72, 27, .18),
    0 0 38px rgba(160, 27, 13, .10);
}

/* Products continúa exactamente el mismo ambiente, sin corte visual. */
.ember-v10-products-section {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(820px 420px at 82% 18%, rgba(255, 78, 29, .085), transparent 65%),
    radial-gradient(760px 430px at 14% 72%, rgba(125, 18, 13, .09), transparent 68%),
    linear-gradient(180deg,
      #180a08 0%,
      #120807 36%,
      #0c0809 70%,
      #08090d 100%) !important;
  box-shadow:
    inset 0 38px 75px rgba(0,0,0,.07),
    inset 0 -45px 85px rgba(0,0,0,.28) !important;
}

/* Mantiene contenido y cards por encima de las luces ambientales. */
.ember-v10-category-section > *,
.ember-v10-products-section > * {
  position: relative;
  z-index: 2;
}

/* Glow más coherente en la tarjeta grande de categoría. */
.ember-v10-category-card {
  background:
    linear-gradient(115deg, rgba(23,12,13,.90), rgba(11,11,16,.94)) !important;
  border-color: rgba(255, 91, 36, .40) !important;
  box-shadow:
    0 24px 65px rgba(0,0,0,.36),
    0 0 26px rgba(255, 67, 25, .055),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.ember-v10-category-card:hover {
  border-color: rgba(255, 111, 55, .64) !important;
  box-shadow:
    0 28px 72px rgba(0,0,0,.40),
    0 0 18px rgba(255, 94, 39, .14),
    0 0 46px rgba(166, 29, 15, .10),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* Cards de producto: apenas más Ember, sin convertir todo en neón. */
.ember-v10-product-card {
  background:
    linear-gradient(155deg, rgba(19,12,14,.92), rgba(9,10,14,.94)) !important;
  border-color: rgba(255, 91, 36, .30) !important;
  box-shadow:
    0 18px 48px rgba(0,0,0,.30),
    0 0 20px rgba(255, 74, 27, .035),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.ember-v10-product-card:hover {
  border-color: rgba(255, 112, 55, .54) !important;
  box-shadow:
    0 24px 60px rgba(0,0,0,.36),
    0 0 18px rgba(255, 86, 32, .12),
    0 0 38px rgba(147, 23, 13, .07),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
}

/* Títulos: un pequeño reflejo cálido que conecta con el fondo. */
.ember-v10-category-section h2,
.ember-v10-products-section h2 {
  text-shadow:
    0 8px 26px rgba(0,0,0,.48),
    0 0 22px rgba(255, 80, 28, .055) !important;
}

@media (max-width: 820px) {
  .ember-v10-category-section {
    background:
      radial-gradient(520px 300px at 50% 5%, rgba(255, 76, 28, .09), transparent 66%),
      linear-gradient(180deg,#08090d 0%,#140807 56%,#180a08 100%) !important;
  }

  .ember-v10-products-section {
    background:
      radial-gradient(520px 320px at 50% 16%, rgba(255, 76, 28, .065), transparent 68%),
      linear-gradient(180deg,#180a08 0%,#110808 52%,#08090d 100%) !important;
  }
}

/* ========================================================================
   EMBERNETWORK — LOWER PAGE EMBER GLOW V16
   Más llamativo: brasas, halos rojos/naranja y profundidad cinematográfica.
   ======================================================================== */

.ember-v10-category-section,
.ember-v10-products-section {
  isolation: isolate !important;
}

/* ZONA CATEGORY: más fuego en los laterales y centro oscuro para legibilidad. */
.ember-v10-category-section {
  background:
    radial-gradient(720px 520px at 4% 30%, rgba(255, 55, 18, .24), transparent 66%),
    radial-gradient(760px 520px at 96% 54%, rgba(185, 18, 10, .22), transparent 68%),
    radial-gradient(620px 300px at 50% 9%, rgba(255, 116, 47, .15), transparent 72%),
    linear-gradient(180deg,
      #09090d 0%,
      #120807 14%,
      #260b08 48%,
      #1b0807 78%,
      #130809 100%) !important;
  box-shadow:
    inset 0 52px 95px rgba(0,0,0,.36),
    inset 0 -52px 100px rgba(0,0,0,.18),
    inset 0 0 120px rgba(128, 20, 10, .10) !important;
}

/* Gran nube de luz difusa que parece brasas debajo del contenido. */
.ember-v10-category-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 44%;
  width: min(1120px, 86vw);
  height: 460px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  border-radius: 50%;
  background:
    radial-gradient(circle at 28% 50%, rgba(255, 85, 29, .24), transparent 31%),
    radial-gradient(circle at 72% 50%, rgba(190, 26, 12, .18), transparent 34%),
    radial-gradient(ellipse at center, rgba(255, 55, 18, .10), transparent 68%);
  filter: blur(52px);
  opacity: .78;
  animation: emberLowerPulse 7s ease-in-out infinite alternate;
}

/* Línea superior más brillante, como transición de una zona caliente. */
.ember-v10-category-section::after {
  height: 2px !important;
  width: min(1380px, 92vw) !important;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(255, 47, 18, .16) 12%,
    rgba(255, 84, 27, .70) 34%,
    rgba(255, 166, 76, .95) 50%,
    rgba(255, 84, 27, .70) 66%,
    rgba(255, 47, 18, .16) 88%,
    transparent 100%) !important;
  box-shadow:
    0 0 12px rgba(255, 113, 48, .55),
    0 0 32px rgba(255, 64, 23, .28),
    0 0 72px rgba(180, 23, 12, .18) !important;
}

/* CATEGORY CARD: borde más vivo + resplandor que acompaña la imagen. */
.ember-v10-category-card {
  border-color: rgba(255, 103, 45, .54) !important;
  background:
    linear-gradient(120deg, rgba(28, 12, 13, .93), rgba(8, 9, 14, .96)) !important;
  box-shadow:
    0 30px 78px rgba(0,0,0,.46),
    0 0 22px rgba(255, 74, 25, .13),
    0 0 70px rgba(145, 20, 11, .10),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.ember-v10-category-card:hover {
  border-color: rgba(255, 145, 77, .88) !important;
  box-shadow:
    0 32px 86px rgba(0,0,0,.48),
    0 0 24px rgba(255, 114, 49, .30),
    0 0 65px rgba(255, 57, 19, .17),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

/* PRODUCTS: continúa el rojo, pero con el foco debajo de las cards. */
.ember-v10-products-section {
  background:
    radial-gradient(760px 500px at 15% 20%, rgba(180, 20, 12, .19), transparent 68%),
    radial-gradient(840px 520px at 86% 34%, rgba(255, 66, 21, .17), transparent 70%),
    radial-gradient(700px 320px at 50% 64%, rgba(255, 109, 38, .10), transparent 72%),
    linear-gradient(180deg,
      #130809 0%,
      #1d0908 28%,
      #160808 58%,
      #0b090c 100%) !important;
  box-shadow:
    inset 0 50px 100px rgba(0,0,0,.10),
    inset 0 -70px 120px rgba(0,0,0,.42) !important;
}

.ember-v10-products-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 38%;
  width: min(1250px, 92vw);
  height: 520px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  border-radius: 50%;
  background:
    radial-gradient(circle at 18% 55%, rgba(255, 52, 19, .16), transparent 30%),
    radial-gradient(circle at 82% 45%, rgba(255, 103, 34, .15), transparent 32%),
    radial-gradient(ellipse at 50% 55%, rgba(156, 21, 12, .10), transparent 68%);
  filter: blur(58px);
  opacity: .78;
  animation: emberLowerPulse 8.5s ease-in-out infinite alternate-reverse;
}

/* Resalta las cards de producto sin hacerlas parecer botones fluorescentes. */
.ember-v10-product-card {
  border-color: rgba(255, 91, 36, .40) !important;
  box-shadow:
    0 24px 62px rgba(0,0,0,.38),
    0 0 22px rgba(255, 78, 27, .075),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.ember-v10-product-card:hover {
  border-color: rgba(255, 132, 65, .75) !important;
  box-shadow:
    0 28px 72px rgba(0,0,0,.44),
    0 0 20px rgba(255, 118, 51, .24),
    0 0 52px rgba(255, 51, 18, .12),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* Títulos más presentes. */
.ember-v10-category-section h2,
.ember-v10-products-section h2 {
  text-shadow:
    0 9px 26px rgba(0,0,0,.56),
    0 0 16px rgba(255, 118, 52, .16),
    0 0 38px rgba(255, 53, 19, .10) !important;
}

@keyframes emberLowerPulse {
  from {
    opacity: .58;
    transform: translate(-50%, -50%) scale(.94);
  }
  to {
    opacity: .90;
    transform: translate(-50%, -50%) scale(1.06);
  }
}

@media (max-width: 820px) {
  .ember-v10-category-section {
    background:
      radial-gradient(520px 360px at 10% 18%, rgba(255, 62, 20, .20), transparent 68%),
      radial-gradient(520px 360px at 92% 62%, rgba(173, 20, 11, .16), transparent 70%),
      linear-gradient(180deg,#09090d 0%,#220a08 52%,#140809 100%) !important;
  }

  .ember-v10-products-section {
    background:
      radial-gradient(520px 360px at 80% 15%, rgba(255, 64, 21, .16), transparent 70%),
      linear-gradient(180deg,#140809 0%,#1c0908 46%,#09090d 100%) !important;
  }

  .ember-v10-category-section::before,
  .ember-v10-products-section::before {
    width: 115vw;
    height: 380px;
    filter: blur(44px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ember-v10-category-section::before,
  .ember-v10-products-section::before {
    animation: none !important;
  }
}

/* ========================================================================
   EMBERNETWORK — LOWER CONTINUATION V18
   About + Common Questions + Footer, todo conectado al ambiente Ember.
   ======================================================================== */

/* ---------- ABOUT ---------- */
.ember-v10-about-section {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding-top: clamp(72px, 7vw, 112px) !important;
  padding-bottom: clamp(78px, 7.5vw, 118px) !important;
  background:
    radial-gradient(760px 460px at 10% 35%, rgba(213, 34, 14, .23), transparent 68%),
    radial-gradient(820px 480px at 90% 58%, rgba(255, 78, 24, .19), transparent 70%),
    radial-gradient(620px 300px at 50% 48%, rgba(255, 132, 46, .105), transparent 72%),
    linear-gradient(180deg,
      #0b090c 0%,
      #150708 17%,
      #250a08 48%,
      #180809 78%,
      #0d090c 100%) !important;
  box-shadow:
    inset 0 72px 130px rgba(0,0,0,.34),
    inset 0 -70px 120px rgba(0,0,0,.24),
    inset 0 0 150px rgba(132, 19, 10, .10) !important;
}

.ember-v10-about-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 48%;
  width: min(1120px, 92vw);
  height: 480px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  border-radius: 50%;
  background:
    radial-gradient(circle at 26% 50%, rgba(255, 55, 19, .25), transparent 30%),
    radial-gradient(circle at 74% 48%, rgba(255, 108, 34, .20), transparent 33%),
    radial-gradient(ellipse at center, rgba(150, 20, 11, .16), transparent 69%);
  filter: blur(60px);
  opacity: .86;
  animation: emberV18Pulse 8s ease-in-out infinite alternate;
}

.ember-v10-about-section::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 50%;
  width: min(1380px, 94vw);
  height: 2px;
  transform: translateX(-50%);
  pointer-events: none;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(255,57,20,.12) 10%,
    rgba(255,91,29,.62) 34%,
    rgba(255,169,74,.88) 50%,
    rgba(255,91,29,.62) 66%,
    rgba(255,57,20,.12) 90%,
    transparent 100%);
  box-shadow:
    0 0 13px rgba(255,112,45,.44),
    0 0 38px rgba(255,54,18,.22),
    0 0 78px rgba(126,16,9,.14);
}

.ember-v10-about-section > * {
  position: relative;
  z-index: 2;
}

.ember-v10-about-card {
  border: 1px solid rgba(255, 91, 31, .56) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 87, 27, .10), transparent 50%),
    linear-gradient(145deg, rgba(35,9,12,.93), rgba(11,9,13,.97)) !important;
  box-shadow:
    0 30px 82px rgba(0,0,0,.45),
    0 0 25px rgba(255,78,25,.15),
    0 0 82px rgba(154,19,10,.12),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.18);
  backdrop-filter: blur(18px) saturate(1.18);
}

.ember-v10-about-card:hover {
  border-color: rgba(255, 143, 66, .86) !important;
  box-shadow:
    0 36px 92px rgba(0,0,0,.49),
    0 0 25px rgba(255,119,47,.28),
    0 0 68px rgba(255,50,18,.16),
    inset 0 1px 0 rgba(255,255,255,.07) !important;
}

/* ---------- COMMON QUESTIONS / FAQ ---------- */
.ember-v10-faq-section {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding-top: clamp(68px, 6.5vw, 104px) !important;
  padding-bottom: clamp(86px, 8vw, 132px) !important;
  background:
    radial-gradient(760px 470px at 5% 34%, rgba(173, 20, 11, .22), transparent 68%),
    radial-gradient(820px 480px at 94% 52%, rgba(255, 62, 19, .20), transparent 70%),
    radial-gradient(640px 330px at 50% 18%, rgba(255, 118, 38, .105), transparent 74%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.018) 0 1px, transparent 1px 52px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0 1px, transparent 1px 52px),
    linear-gradient(180deg,
      #0d090c 0%,
      #180808 22%,
      #210908 54%,
      #12080a 82%,
      #09090d 100%) !important;
  box-shadow:
    inset 0 64px 115px rgba(0,0,0,.22),
    inset 0 -74px 126px rgba(0,0,0,.34),
    inset 0 0 140px rgba(130,18,10,.08) !important;
}

.ember-v10-faq-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 44%;
  width: min(1180px, 94vw);
  height: 520px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  border-radius: 50%;
  background:
    radial-gradient(circle at 18% 55%, rgba(255, 55, 19, .20), transparent 31%),
    radial-gradient(circle at 82% 44%, rgba(255, 98, 31, .18), transparent 32%),
    radial-gradient(ellipse at 50% 50%, rgba(155, 20, 11, .13), transparent 70%);
  filter: blur(62px);
  opacity: .82;
  animation: emberV18Pulse 9s ease-in-out infinite alternate-reverse;
}

.ember-v10-faq-section::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 1;
  width: min(1320px, 92vw);
  height: 1px;
  transform: translateX(-50%);
  pointer-events: none;
  background: linear-gradient(90deg,
    transparent,
    rgba(255,64,21,.13) 14%,
    rgba(255,113,43,.56) 50%,
    rgba(255,64,21,.13) 86%,
    transparent);
  box-shadow:
    0 0 14px rgba(255,99,38,.34),
    0 0 42px rgba(255,48,17,.14);
}

.ember-v10-faq-section > * {
  position: relative;
  z-index: 2;
}

.ember-v10-faq-heading {
  text-shadow:
    0 9px 26px rgba(0,0,0,.52),
    0 0 18px rgba(255,119,49,.20),
    0 0 42px rgba(255,54,19,.11) !important;
}

.ember-v10-faq-card {
  overflow: hidden;
  border: 1px solid rgba(255, 92, 34, .34) !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(255, 87, 29, .07), transparent 38%),
    linear-gradient(120deg, rgba(20,13,16,.92), rgba(10,11,15,.95)) !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,.30),
    0 0 16px rgba(255,77,25,.075),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
  transition:
    border-color .24s ease,
    box-shadow .24s ease,
    transform .24s var(--eg10-ease) !important;
}

.ember-v10-faq-card:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 133, 59, .72) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.36),
    0 0 18px rgba(255,112,45,.20),
    0 0 44px rgba(255,50,18,.09),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.ember-v10-faq-card button,
.ember-v10-faq-card summary {
  color: #fff5ee !important;
}

/* ---------- FOOTER ---------- */
footer {
  position: relative;
  border-top-color: rgba(255, 91, 34, .30) !important;
  background:
    radial-gradient(760px 310px at 50% 0%, rgba(255, 68, 22, .13), transparent 72%),
    radial-gradient(620px 260px at 10% 30%, rgba(142, 18, 10, .09), transparent 72%),
    radial-gradient(620px 260px at 90% 28%, rgba(177, 24, 11, .075), transparent 72%),
    linear-gradient(180deg, rgba(15,7,9,.98), rgba(7,8,12,.995)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,112,48,.12),
    0 -24px 80px rgba(125,17,9,.10) !important;
}

@keyframes emberV18Pulse {
  from {
    opacity: .60;
    transform: translate(-50%, -50%) scale(.95);
  }
  to {
    opacity: .92;
    transform: translate(-50%, -50%) scale(1.055);
  }
}

@media (max-width: 820px) {
  .ember-v10-about-section {
    background:
      radial-gradient(540px 360px at 14% 28%, rgba(255,61,20,.19), transparent 70%),
      radial-gradient(540px 360px at 88% 62%, rgba(161,19,11,.16), transparent 72%),
      linear-gradient(180deg,#0b090c 0%,#210908 52%,#0d090c 100%) !important;
  }

  .ember-v10-faq-section {
    background:
      radial-gradient(540px 370px at 12% 25%, rgba(255,61,20,.18), transparent 70%),
      radial-gradient(540px 370px at 90% 62%, rgba(168,20,11,.16), transparent 72%),
      repeating-linear-gradient(0deg, rgba(255,255,255,.014) 0 1px, transparent 1px 44px),
      repeating-linear-gradient(90deg, rgba(255,255,255,.012) 0 1px, transparent 1px 44px),
      linear-gradient(180deg,#0d090c 0%,#200908 52%,#09090d 100%) !important;
  }

  .ember-v10-about-section::before,
  .ember-v10-faq-section::before {
    width: 118vw;
    height: 390px;
    filter: blur(46px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ember-v10-about-section::before,
  .ember-v10-faq-section::before {
    animation: none !important;
  }
}


/* ========================================================================
   SECRET NAV // GLITCH ACCESS — V19
   Botón visual para el futuro apartado secreto.
   ======================================================================== */

.ember-secret-nav {
  --secret-green: #65ff9a;
  --secret-green-hot: #00ff73;
  --secret-red: #ff304f;
  --secret-cyan: #63f6ff;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-width: 118px;
  height: 43px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(74,255,143,.42);
  border-radius: 11px;
  background:
    linear-gradient(180deg, rgba(7,14,13,.90), rgba(3,7,8,.96)),
    #050708;
  color: #eafff0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .10em;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  box-shadow:
    0 0 0 1px rgba(0,255,115,.025),
    0 0 13px rgba(0,255,115,.08),
    inset 0 1px 0 rgba(255,255,255,.04);
  transition:
    transform .20s var(--eg10-ease),
    border-color .20s ease,
    box-shadow .20s ease,
    background .20s ease;
}

.ember-secret-nav::before,
.ember-secret-nav::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.ember-secret-nav::before {
  opacity: .45;
  background:
    repeating-linear-gradient(
      0deg,
      transparent 0 3px,
      rgba(99,246,255,.035) 3px 4px
    );
  mix-blend-mode: screen;
}

.ember-secret-nav::after {
  inset: -1px;
  opacity: 0;
  border-radius: inherit;
  background:
    linear-gradient(90deg,
      rgba(255,48,79,.55),
      transparent 18%,
      transparent 77%,
      rgba(0,255,115,.52));
  filter: blur(5px);
  transition: opacity .18s ease;
}

.ember-secret-scan {
  position: absolute;
  left: -10%;
  right: -10%;
  top: -7px;
  height: 5px;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(101,255,154,.85), transparent);
  box-shadow:
    0 0 7px rgba(0,255,115,.65),
    0 0 19px rgba(0,255,115,.30);
}

.ember-secret-icon {
  color: var(--secret-green);
  font-size: .76rem;
  letter-spacing: -.08em;
  text-shadow:
    0 0 6px rgba(101,255,154,.72),
    0 0 15px rgba(0,255,115,.34);
}

.ember-secret-label {
  position: relative;
  display: inline-block;
  color: #effff4;
  text-shadow: 0 0 9px rgba(101,255,154,.20);
}

.ember-secret-label::before,
.ember-secret-label::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
}

.ember-secret-label::before {
  color: var(--secret-red);
  transform: translateX(-2px);
  text-shadow: 2px 0 rgba(255,48,79,.58);
  clip-path: inset(0 0 53% 0);
}

.ember-secret-label::after {
  color: var(--secret-cyan);
  transform: translateX(2px);
  text-shadow: -2px 0 rgba(99,246,255,.50);
  clip-path: inset(52% 0 0 0);
}

.ember-secret-code {
  min-width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(101,255,154,.23);
  border-radius: 4px;
  background: rgba(0,255,115,.045);
  color: rgba(158,255,191,.64);
  font-size: .53rem;
  letter-spacing: .02em;
}

.ember-secret-nav:hover {
  transform: translateY(-1px);
  border-color: rgba(101,255,154,.92);
  background:
    radial-gradient(circle at 50% 120%, rgba(0,255,115,.12), transparent 54%),
    linear-gradient(180deg, rgba(7,16,14,.95), rgba(3,7,8,.98));
  box-shadow:
    -3px 0 0 -2px rgba(255,48,79,.70),
    3px 0 0 -2px rgba(99,246,255,.54),
    0 0 8px rgba(175,255,201,.25),
    0 0 20px rgba(0,255,115,.25),
    0 0 44px rgba(0,255,115,.10),
    inset 0 0 18px rgba(0,255,115,.055);
}

.ember-secret-nav:hover::after { opacity: .55; }
.ember-secret-nav:hover .ember-secret-scan { animation: emberSecretScan .90s linear infinite; opacity: .75; }
.ember-secret-nav:hover .ember-secret-label::before { animation: emberSecretGlitchA .75s steps(2,end) infinite; }
.ember-secret-nav:hover .ember-secret-label::after { animation: emberSecretGlitchB .62s steps(2,end) infinite; }

.ember-secret-nav.is-breaching {
  animation: emberSecretButtonBreach .78s steps(2,end);
  border-color: rgba(101,255,154,1);
  box-shadow:
    -5px 0 0 -2px rgba(255,48,79,.82),
    5px 0 0 -2px rgba(99,246,255,.78),
    0 0 12px rgba(101,255,154,.56),
    0 0 36px rgba(0,255,115,.38),
    0 0 72px rgba(0,255,115,.16);
}

.ember-secret-nav.is-breaching .ember-secret-label::before,
.ember-secret-nav.is-breaching .ember-secret-label::after {
  opacity: .9;
}

.ember-secret-nav:focus-visible {
  outline: 2px solid rgba(101,255,154,.95);
  outline-offset: 3px;
  box-shadow:
    0 0 0 3px rgba(0,255,115,.13),
    0 0 25px rgba(0,255,115,.26);
}

.ember-secret-nav:active {
  transform: translateY(0) scale(.97);
}

.ember-secret-toast {
  position: fixed;
  left: 50%;
  bottom: 30px;
  z-index: 2147483646;
  min-width: min(360px, calc(100vw - 30px));
  padding: 13px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid rgba(101,255,154,.52);
  border-radius: 9px;
  background: rgba(3,7,8,.94);
  color: #eafff0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .11em;
  opacity: 0;
  transform: translate(-50%, 16px) scale(.97);
  pointer-events: none;
  backdrop-filter: blur(12px);
  box-shadow:
    -3px 0 0 -2px rgba(255,48,79,.65),
    3px 0 0 -2px rgba(99,246,255,.50),
    0 0 28px rgba(0,255,115,.20),
    0 18px 48px rgba(0,0,0,.45);
  transition: opacity .20s ease, transform .25s var(--eg10-ease);
}

.ember-secret-toast.is-visible {
  opacity: 1;
  transform: translate(-50%,0) scale(1);
}

.ember-secret-toast-code {
  color: var(--secret-green, #65ff9a);
  text-shadow: 0 0 9px rgba(0,255,115,.55);
}

body.ember-secret-breach::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2147483644;
  pointer-events: none;
  opacity: 0;
  background:
    repeating-linear-gradient(0deg, transparent 0 5px, rgba(0,255,115,.025) 5px 6px),
    linear-gradient(90deg, rgba(255,48,79,.025), transparent 30%, transparent 70%, rgba(99,246,255,.025));
  animation: emberSecretScreenHit .62s steps(2,end);
}

@keyframes emberSecretScan {
  from { transform: translateY(0); }
  to { transform: translateY(53px); }
}

@keyframes emberSecretGlitchA {
  0%, 68%, 100% { opacity: 0; transform: translateX(-2px); }
  70% { opacity: .78; transform: translate(-4px,-1px); }
  73% { opacity: .18; transform: translate(3px,1px); }
  76% { opacity: .72; transform: translate(-1px,0); }
}

@keyframes emberSecretGlitchB {
  0%, 52%, 100% { opacity: 0; transform: translateX(2px); }
  54% { opacity: .70; transform: translate(4px,1px); }
  58% { opacity: .15; transform: translate(-3px,-1px); }
  61% { opacity: .70; transform: translate(1px,0); }
}

@keyframes emberSecretButtonBreach {
  0%,100% { transform: translate(0,0); filter: none; }
  18% { transform: translate(-3px,1px); filter: contrast(1.35); }
  34% { transform: translate(4px,-1px); }
  48% { transform: translate(-1px,0); filter: brightness(1.25); }
  62% { transform: translate(3px,1px); }
  78% { transform: translate(-2px,-1px); }
}

@keyframes emberSecretScreenHit {
  0%,100% { opacity: 0; transform: translateX(0); }
  15% { opacity: .75; transform: translateX(-2px); }
  29% { opacity: .18; transform: translateX(3px); }
  44% { opacity: .62; transform: translateX(-1px); }
  67% { opacity: .10; transform: translateX(1px); }
}

@media (max-width: 1180px) {
  .ember-secret-nav {
    min-width: 96px;
    padding-inline: 9px;
    gap: 6px;
  }
  .ember-secret-code { display: none; }
}

@media (max-width: 820px) {
  .ember-secret-nav {
    min-width: 42px;
    width: 42px;
    padding: 0;
  }
  .ember-secret-label,
  .ember-secret-code { display: none; }
  .ember-secret-icon { font-size: .82rem; }
}

@media (prefers-reduced-motion: reduce) {
  .ember-secret-nav,
  .ember-secret-nav *,
  .ember-secret-toast,
  body.ember-secret-breach::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}

/* ========================================================================
   SECRET NAV GREEN GLITCH — V20 OVERRIDE
   ======================================================================== */

.ember-secret-nav {
  --secret-green: #8dff8a !important;
  --secret-green-hot: #22ff66 !important;
  --secret-green-deep: #00d84f !important;
  --secret-red: #ff3d81 !important;
  --secret-cyan: #44fff2 !important;
  border-color: rgba(34,255,102,.56) !important;
  background:
    radial-gradient(circle at 50% 110%, rgba(34,255,102,.09), transparent 56%),
    linear-gradient(180deg, rgba(4,13,7,.94), rgba(1,6,3,.98)) !important;
  color: #d8ffe6 !important;
  box-shadow:
    0 0 0 1px rgba(34,255,102,.08),
    0 0 10px rgba(34,255,102,.14),
    0 0 28px rgba(34,255,102,.08),
    inset 0 0 18px rgba(15,255,98,.04),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.ember-secret-nav::before {
  opacity: .64 !important;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,0) 0 2px,
      rgba(68,255,242,.035) 2px 3px,
      rgba(34,255,102,.022) 3px 4px
    ) !important;
}

.ember-secret-nav::after {
  opacity: .24;
  background:
    linear-gradient(90deg,
      rgba(255,61,129,.40),
      transparent 16%,
      transparent 72%,
      rgba(68,255,242,.34),
      rgba(34,255,102,.44)) !important;
  filter: blur(6px) !important;
}

.ember-secret-icon {
  color: var(--secret-green-hot) !important;
  text-shadow:
    0 0 7px rgba(141,255,138,.92),
    0 0 16px rgba(34,255,102,.65),
    0 0 26px rgba(34,255,102,.25) !important;
}

.ember-secret-label {
  color: #eafff0 !important;
  text-shadow:
    0 0 8px rgba(34,255,102,.28),
    0 0 20px rgba(34,255,102,.10) !important;
}

.ember-secret-label::before,
.ember-secret-label::after {
  opacity: .22;
}

.ember-secret-label::before {
  color: #7aff7d !important;
  text-shadow:
    -2px 0 rgba(34,255,102,.65),
    0 0 10px rgba(34,255,102,.35) !important;
  transform: translateX(-1px);
  clip-path: inset(0 0 56% 0) !important;
}

.ember-secret-label::after {
  color: var(--secret-cyan) !important;
  text-shadow:
    2px 0 rgba(68,255,242,.52),
    0 0 10px rgba(68,255,242,.26) !important;
  clip-path: inset(48% 0 0 0) !important;
}

.ember-secret-code {
  border-color: rgba(34,255,102,.35) !important;
  background: rgba(34,255,102,.08) !important;
  color: #9dffb7 !important;
  box-shadow: inset 0 0 10px rgba(34,255,102,.06) !important;
}

.ember-secret-scan {
  opacity: .55 !important;
  background: linear-gradient(90deg, transparent, rgba(141,255,138,.95), rgba(68,255,242,.72), transparent) !important;
  box-shadow:
    0 0 8px rgba(34,255,102,.80),
    0 0 24px rgba(34,255,102,.35) !important;
}

.ember-secret-nav:hover {
  transform: translateY(-1px) scale(1.01) !important;
  border-color: rgba(141,255,138,.95) !important;
  background:
    radial-gradient(circle at 50% 115%, rgba(34,255,102,.16), transparent 54%),
    linear-gradient(180deg, rgba(4,16,8,.98), rgba(0,6,3,1)) !important;
  box-shadow:
    -4px 0 0 -2px rgba(255,61,129,.80),
    4px 0 0 -2px rgba(68,255,242,.68),
    0 0 0 1px rgba(141,255,138,.10),
    0 0 12px rgba(141,255,138,.34),
    0 0 30px rgba(34,255,102,.28),
    0 0 60px rgba(34,255,102,.14),
    inset 0 0 22px rgba(34,255,102,.09) !important;
}

.ember-secret-nav:hover::after {
  opacity: .62 !important;
}

.ember-secret-nav:hover .ember-secret-scan {
  animation: emberSecretScanV20 .72s linear infinite !important;
}

.ember-secret-nav:hover .ember-secret-label::before {
  animation: emberSecretGlitchGreenA .52s steps(2,end) infinite !important;
  opacity: .90 !important;
}

.ember-secret-nav:hover .ember-secret-label::after {
  animation: emberSecretGlitchGreenB .44s steps(2,end) infinite !important;
  opacity: .82 !important;
}

.ember-secret-nav.is-breaching {
  border-color: rgba(141,255,138,1) !important;
  box-shadow:
    -5px 0 0 -2px rgba(255,61,129,.88),
    5px 0 0 -2px rgba(68,255,242,.82),
    0 0 14px rgba(141,255,138,.62),
    0 0 36px rgba(34,255,102,.42),
    0 0 84px rgba(34,255,102,.18) !important;
}

.ember-secret-nav:focus-visible {
  outline-color: rgba(141,255,138,.95) !important;
  box-shadow:
    0 0 0 3px rgba(34,255,102,.16),
    0 0 22px rgba(34,255,102,.28),
    0 0 58px rgba(34,255,102,.12) !important;
}

@keyframes emberSecretScanV20 {
  from { transform: translateY(-4px); opacity: .18; }
  20% { opacity: .95; }
  to { transform: translateY(54px); opacity: .12; }
}

@keyframes emberSecretGlitchGreenA {
  0%, 100% { transform: translate(0,0); opacity: 0; }
  8% { transform: translate(-2px,-1px); opacity: .88; }
  14% { transform: translate(3px,1px); opacity: .18; }
  20% { transform: translate(-4px,0); opacity: .82; }
  28% { transform: translate(1px,-1px); opacity: .28; }
  36%, 60% { transform: translate(0,0); opacity: 0; }
  68% { transform: translate(-3px,1px); opacity: .74; }
  73% { transform: translate(2px,-1px); opacity: .18; }
  78% { transform: translate(-1px,0); opacity: .68; }
}

@keyframes emberSecretGlitchGreenB {
  0%, 100% { transform: translate(0,0); opacity: 0; }
  10% { transform: translate(2px,1px); opacity: .78; }
  16% { transform: translate(-3px,-1px); opacity: .14; }
  22% { transform: translate(4px,0); opacity: .72; }
  30% { transform: translate(-1px,1px); opacity: .22; }
  38%, 58% { transform: translate(0,0); opacity: 0; }
  66% { transform: translate(3px,-1px); opacity: .80; }
  71% { transform: translate(-2px,1px); opacity: .18; }
  77% { transform: translate(1px,0); opacity: .66; }
}

/* ========================================================================
   SECRET NAV — DISCORD-LIKE GREEN NEON // V21 OVERRIDE
   ======================================================================== */

.ember-secret-nav {
  --secret-green: #8fff9f !important;
  --secret-green-hot: #33ff7a !important;
  --secret-cyan: #7dfff2 !important;
  --secret-red: #38ff9c !important;
  min-width: 138px !important;
  height: 43px !important;
  padding: 0 16px !important;
  gap: 7px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(86,255,144,.42) !important;
  background:
    linear-gradient(180deg, rgba(17,19,25,.88), rgba(12,13,18,.94)),
    rgba(11,12,16,.92) !important;
  color: #f4fff7 !important;
  box-shadow:
    0 0 0 1px rgba(86,255,144,.04),
    0 0 7px rgba(147,255,181,.14),
    0 0 24px rgba(51,255,122,.12),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter: blur(12px);
}

.ember-secret-nav::before {
  inset: 0 !important;
  opacity: .95 !important;
  background:
    radial-gradient(circle at 50% 120%, rgba(51,255,122,.14), transparent 52%),
    linear-gradient(115deg, transparent 18%, rgba(185,255,208,.06) 47%, transparent 75%) !important;
  transform: none !important;
}

.ember-secret-nav::after {
  top: -45% !important;
  left: -62% !important;
  width: 36% !important;
  height: 190% !important;
  border-radius: inherit;
  opacity: 0 !important;
  background: linear-gradient(90deg, transparent, rgba(205,255,221,.28), transparent) !important;
  filter: none !important;
  transform: rotate(18deg) translateX(0) !important;
  z-index: 2 !important;
}

.ember-secret-icon {
  color: var(--secret-green-hot) !important;
  font-size: .78rem !important;
  text-shadow:
    0 0 5px rgba(166,255,191,.80),
    0 0 12px rgba(51,255,122,.48) !important;
}

.ember-secret-label,
.ember-secret-code {
  position: relative;
  display: inline-block;
  font-size: .70rem !important;
  font-weight: 900 !important;
  letter-spacing: .07em !important;
  line-height: 1;
  color: #f2fff6 !important;
  text-shadow:
    0 0 7px rgba(51,255,122,.16),
    0 0 18px rgba(51,255,122,.06) !important;
}

.ember-secret-code {
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #9effb7 !important;
}

.ember-secret-label::before,
.ember-secret-label::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
}

.ember-secret-label::before {
  color: #8fff9f !important;
  text-shadow: -2px 0 rgba(51,255,122,.55) !important;
  clip-path: inset(0 0 54% 0) !important;
}

.ember-secret-label::after {
  color: #7dfff2 !important;
  text-shadow: 2px 0 rgba(125,255,242,.42) !important;
  clip-path: inset(48% 0 0 0) !important;
}

.ember-secret-scan {
  left: 10% !important;
  right: 10% !important;
  top: 50% !important;
  height: 1px !important;
  opacity: .22 !important;
  transform: translateY(-50%);
  background: linear-gradient(90deg, transparent, rgba(143,255,159,.95), rgba(125,255,242,.48), transparent) !important;
  box-shadow: 0 0 8px rgba(51,255,122,.45) !important;
}

.ember-secret-nav:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(154,255,182,.95) !important;
  background:
    radial-gradient(circle at 50% 120%, rgba(51,255,122,.16), transparent 55%),
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.008)),
    rgba(13,18,15,.88) !important;
  box-shadow:
    0 0 8px rgba(205,255,221,.30),
    0 0 24px rgba(51,255,122,.26),
    0 0 48px rgba(51,255,122,.12),
    inset 0 0 20px rgba(51,255,122,.07),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.ember-secret-nav:hover::after {
  opacity: .82 !important;
  animation: emberNeonSweep .72s cubic-bezier(.18,.72,.2,1) forwards !important;
}

.ember-secret-nav:hover .ember-secret-scan {
  opacity: .68 !important;
}

.ember-secret-nav:hover .ember-secret-label::before {
  animation: emberSecretDiscordGlitchA .72s steps(2,end) infinite !important;
}

.ember-secret-nav:hover .ember-secret-label::after {
  animation: emberSecretDiscordGlitchB .62s steps(2,end) infinite !important;
}

.ember-secret-nav.is-breaching {
  animation: emberSecretButtonBreach .78s steps(2,end) !important;
  border-color: rgba(154,255,182,1) !important;
  box-shadow:
    -4px 0 0 -2px rgba(56,255,156,.55),
    4px 0 0 -2px rgba(125,255,242,.62),
    0 0 12px rgba(154,255,182,.56),
    0 0 34px rgba(51,255,122,.34),
    0 0 70px rgba(51,255,122,.16) !important;
}

.ember-secret-nav:focus-visible {
  outline: 2px solid rgba(154,255,182,.95) !important;
  outline-offset: 3px !important;
  box-shadow:
    0 0 0 3px rgba(51,255,122,.12),
    0 0 24px rgba(51,255,122,.24) !important;
}

@keyframes emberSecretDiscordGlitchA {
  0%, 70%, 100% { opacity: 0; transform: translateX(0); }
  72% { opacity: .80; transform: translate(-2px,-1px); }
  76% { opacity: .18; transform: translate(2px,1px); }
  80% { opacity: .74; transform: translate(-1px,0); }
}

@keyframes emberSecretDiscordGlitchB {
  0%, 56%, 100% { opacity: 0; transform: translateX(0); }
  58% { opacity: .74; transform: translate(2px,1px); }
  62% { opacity: .14; transform: translate(-2px,-1px); }
  66% { opacity: .68; transform: translate(1px,0); }
}

@media (max-width: 1180px) {
  .ember-secret-nav {
    min-width: 126px !important;
    padding-inline: 13px !important;
  }
}

@media (max-width: 820px) {
  .ember-secret-nav {
    min-width: 43px !important;
    width: 43px !important;
    padding: 0 !important;
    border-radius: 13px !important;
  }
  .ember-secret-label,
  .ember-secret-code { display: none !important; }
  .ember-secret-icon { font-size: .82rem !important; }
}

/* ========================================================================
   SECRET NAV — OUTER NEON GREEN FIX // V22 OVERRIDE
   Fuerza el glow exterior a verde y elimina el tono naranja exterior.
   ======================================================================== */

.ember-secret-nav {
  border-color: rgba(86,255,144,.46) !important;
  box-shadow:
    0 0 0 1px rgba(86,255,144,.05),
    0 0 8px rgba(134,255,174,.16),
    0 0 24px rgba(51,255,122,.14),
    0 0 44px rgba(51,255,122,.08),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.ember-secret-nav:hover {
  border-color: rgba(154,255,182,.98) !important;
  box-shadow:
    0 0 8px rgba(205,255,221,.34),
    0 0 22px rgba(51,255,122,.32),
    0 0 52px rgba(51,255,122,.20),
    0 0 92px rgba(51,255,122,.10),
    inset 0 0 20px rgba(51,255,122,.07),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.ember-secret-nav:focus-visible {
  outline: 2px solid rgba(154,255,182,.98) !important;
  box-shadow:
    0 0 0 3px rgba(51,255,122,.14),
    0 0 14px rgba(154,255,182,.24),
    0 0 34px rgba(51,255,122,.22),
    0 0 68px rgba(51,255,122,.10) !important;
}

.ember-secret-nav.is-breaching {
  border-color: rgba(154,255,182,1) !important;
  box-shadow:
    -4px 0 0 -2px rgba(56,255,156,.34),
    4px 0 0 -2px rgba(125,255,242,.44),
    0 0 12px rgba(154,255,182,.58),
    0 0 30px rgba(51,255,122,.38),
    0 0 72px rgba(51,255,122,.20),
    0 0 110px rgba(51,255,122,.10) !important;
}

/* ========================================================================
   SECRET NAV — BORDER/OUTLINE FULL GREEN // V23 OVERRIDE
   Fuerza TODO el contorno a verde.
   ======================================================================== */

.ember-secret-nav,
button.ember-secret-nav {
  border: 1px solid #57ff92 !important;
  outline: none !important;
  box-shadow:
    0 0 0 1px rgba(87,255,146,.22) !important,
    0 0 10px rgba(87,255,146,.18) !important,
    0 0 26px rgba(51,255,122,.16) !important,
    0 0 50px rgba(51,255,122,.08) !important,
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.ember-secret-nav::before,
button.ember-secret-nav::before {
  background:
    radial-gradient(circle at 50% 120%, rgba(51,255,122,.14), transparent 54%),
    linear-gradient(115deg, transparent 20%, rgba(185,255,208,.06) 46%, transparent 72%) !important;
}

.ember-secret-nav::after,
button.ember-secret-nav::after {
  background: linear-gradient(90deg, transparent, rgba(205,255,221,.28), transparent) !important;
}

.ember-secret-nav:hover,
button.ember-secret-nav:hover {
  border-color: #92ffb0 !important;
  box-shadow:
    0 0 0 1px rgba(146,255,176,.30) !important,
    0 0 12px rgba(146,255,176,.26) !important,
    0 0 28px rgba(51,255,122,.24) !important,
    0 0 58px rgba(51,255,122,.14) !important,
    0 0 96px rgba(51,255,122,.08) !important,
    inset 0 0 20px rgba(51,255,122,.07) !important,
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.ember-secret-nav:focus-visible,
button.ember-secret-nav:focus-visible {
  border-color: #92ffb0 !important;
  outline: 2px solid rgba(146,255,176,.95) !important;
  outline-offset: 3px !important;
  box-shadow:
    0 0 0 1px rgba(146,255,176,.32) !important,
    0 0 14px rgba(146,255,176,.24) !important,
    0 0 32px rgba(51,255,122,.22) !important,
    0 0 72px rgba(51,255,122,.10) !important;
}

.ember-secret-nav.is-breaching,
button.ember-secret-nav.is-breaching {
  border-color: #92ffb0 !important;
  box-shadow:
    -4px 0 0 -2px rgba(56,255,156,.34) !important,
    4px 0 0 -2px rgba(125,255,242,.44) !important,
    0 0 0 1px rgba(146,255,176,.34) !important,
    0 0 14px rgba(146,255,176,.30) !important,
    0 0 34px rgba(51,255,122,.28) !important,
    0 0 78px rgba(51,255,122,.16) !important,
    0 0 118px rgba(51,255,122,.10) !important;
}


/* ==========================================================================
   V24 — FIX REAL DEL CONTORNO SECRET
   La regla global "#app button:not(:disabled)" estaba ganando por especificidad
   y volvía a pintar el borde naranja. Estas reglas solo afectan SECRET.
   ========================================================================== */

#app button.ember-secret-nav:not(:disabled) {
  border-color: #4dff88 !important;
  box-shadow:
    0 0 5px rgba(156,255,187,.20),
    0 0 15px rgba(77,255,136,.22),
    0 0 34px rgba(34,255,102,.14),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

#app button.ember-secret-nav:not(:disabled):hover {
  border-color: #a0ffba !important;
  box-shadow:
    0 0 7px rgba(210,255,222,.35),
    0 0 22px rgba(77,255,136,.34),
    0 0 48px rgba(34,255,102,.18),
    inset 0 0 18px rgba(51,255,122,.065),
    inset 0 1px 0 rgba(255,255,255,.09) !important;
}

/* Mantiene el borde verde también durante click/focus/glitch */
#app button.ember-secret-nav:not(:disabled):active,
#app button.ember-secret-nav:not(:disabled):focus,
#app button.ember-secret-nav:not(:disabled):focus-visible,
#app button.ember-secret-nav:not(:disabled).is-breaching {
  border-color: #7dffa4 !important;
}

/* Evita que cualquier regla naranja global pinte un halo exterior */
#app button.ember-secret-nav:not(:disabled)::before {
  border-color: transparent !important;
}
/* SECRET video background: scoped to the alternate storefront only. */
#ember-secret { isolation: isolate; }
#ember-secret .secret-video-layer { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; background: #020704; }
#ember-secret .secret-video-layer video { display: block; width: 100%; height: 100%; object-fit: cover; opacity: .66; }
#ember-secret .secret-video-layer::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,5,2,.2), rgba(0,5,2,.5)), radial-gradient(ellipse at center, rgba(0,0,0,.12), rgba(0,0,0,.55)); }
#ember-secret .secret-motion-toggle { position: fixed; bottom: 18px; right: 18px; z-index: 3; padding: 8px 12px; border: 1px solid #367d4c; border-radius: 7px; background: #041109; color: #b6ffcb; font: 14px/1.5 ui-monospace, monospace; cursor: pointer; }
#ember-secret .secret-motion-toggle:focus-visible { outline: 2px solid #8dffaa; outline-offset: 4px; }
#ember-secret .secret-motion-toggle:hover { background: #0c2916; }
/* SECRET / premium chapter. All styling stays inside the SECRET view. */
#ember-secret.secret-premium { padding: 28px clamp(18px,4vw,64px) 24px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
#ember-secret.secret-premium .secret-top { max-width: 1400px; margin: auto; min-height: 76px; padding: 15px 22px; border: 1px solid #70ff9c38; border-radius: 10px; background: #020c08e8; box-shadow: 0 8px 40px #0008; }
#ember-secret.secret-premium .secret-brand { display: flex; align-items: center; gap: 12px; color: #e1ffea; font-size: 18px; letter-spacing: .08em; }
#ember-secret.secret-premium .secret-brand small { color: #84b092; font-size: 14px; font-weight: 400; }
#ember-secret.secret-premium .secret-mark { color: #5cff93; font-size: 24px; text-shadow: 0 0 18px #52ff8a66; }
#ember-secret.secret-premium .secret-nav-note { color: #99bca5; font-size: 12px; letter-spacing: .15em; }
#ember-secret.secret-premium .secret-content { max-width: 1200px; margin: 0 auto; }
#ember-secret.secret-premium .secret-hero { text-align: center; position: relative; padding: 88px 20px 0; }
#ember-secret.secret-premium .secret-status { display: inline-block; padding: 8px 13px; border: 1px solid #65ff9a35; border-radius: 4px; background: #021007d9; color: #b6ffcb; font-size: 12px; letter-spacing: .14em; }
#ember-secret.secret-premium .secret-status span { margin: 0 10px; color: #649b73; }
#ember-secret.secret-premium h1 { display: flex; justify-content: center; align-items: baseline; margin: 20px 0 18px; color: #ccffdb; font-family: Arial, Helvetica, sans-serif; font-size: clamp(52px,11.8vw,150px); font-weight: 900; line-height: 1.12; letter-spacing: -.06em; text-shadow: 0 0 55px #32ff7655; }
#ember-secret.secret-premium .secret-caret { color: #4aff85; font-weight: 400; font-size: .75em; }
#ember-secret.secret-premium .secret-tagline { font: 500 clamp(21px,2.8vw,32px)/1.35 Arial, sans-serif; letter-spacing: -.02em; color: #effff4; margin: 0 0 18px; }
#ember-secret.secret-premium .secret-description { color: #bad1c1; font: 16px/1.8 Arial, sans-serif; max-width: 580px; margin: 0 auto 30px; }
#ember-secret.secret-premium .secret-action { position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 48px; padding: 12px 20px; overflow: hidden; border: 1px solid #7fffaa88; border-radius: 5px; background: #06120c; color: #deffe8; font: 500 14px/1.5 ui-monospace, monospace; text-decoration: none; cursor: pointer; box-shadow: 0 0 18px #34ff7718; transition: border-color .2s, box-shadow .2s, background .2s; }
#ember-secret.secret-premium .secret-primary { background: #9cffb9; color: #03200e; border-color: #b3ffc9; box-shadow: 0 0 28px #32ff7630; padding-inline: 26px; }
#ember-secret.secret-premium .secret-action:hover { border-color: #bdffcf; box-shadow: -2px 0 #00ff88, 2px 0 #a0ffe9, 0 0 32px #33ff7750; }
#ember-secret.secret-premium .secret-action:focus-visible { outline: 2px solid #c5ffda; outline-offset: 5px; }
#ember-secret.secret-premium .secret-action::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg,transparent 0 3px,#42ff8712 3px 4px); opacity: .5; }
#ember-secret.secret-premium .secret-glitch { display: inline-block; position: relative; }
#ember-secret.secret-premium .secret-glitch::before,#ember-secret.secret-premium .secret-glitch::after { content: attr(data-text); position: absolute; inset: 0; pointer-events: none; opacity: 0; }
#ember-secret.secret-premium .secret-glitch::before { color: #3cff77; clip-path: inset(18% 0 53%); }
#ember-secret.secret-premium .secret-glitch::after { color: #b5ffe8; clip-path: inset(59% 0 17%); }
#ember-secret.secret-premium h1 .secret-glitch::before { animation: secretSlice 7s steps(1) infinite; }
#ember-secret.secret-premium h1 .secret-glitch::after { animation: secretSlice 7s steps(1) .12s infinite reverse; }
#ember-secret.secret-premium .secret-action:hover .secret-glitch::before,#ember-secret.secret-premium .secret-action:focus-visible .secret-glitch::before { animation: secretSlice .8s steps(1) 2; }
#ember-secret.secret-premium .secret-action:hover .secret-glitch::after,#ember-secret.secret-premium .secret-action:focus-visible .secret-glitch::after { animation: secretSlice .9s steps(1) 2 reverse; }
#ember-secret.secret-premium .secret-hero-meta { display: flex; justify-content: space-between; gap: 16px; margin-top: 66px; border-top: 1px solid #85ffaa30; padding: 16px 0; color: #9eb9a8; font-size: 12px; letter-spacing: .1em; }
#ember-secret.secret-premium .secret-catalog { position: relative; margin: 30px 0; padding: 32px; border: 1px solid #85ffaa45; border-radius: 10px; background: #030e09ed; scroll-margin-top: 24px; }
#ember-secret.secret-premium .secret-section-head { display: flex; gap: 24px; align-items: center; justify-content: space-between; margin-bottom: 28px; }
#ember-secret.secret-premium .secret-eyebrow { color: #88b69a; font-size: 12px; letter-spacing: .14em; margin-bottom: 10px; }
#ember-secret.secret-premium .secret-section-head h2 { font: 500 clamp(22px,2.7vw,30px)/1.3 Arial,sans-serif; margin: 0; letter-spacing: -.02em; }
#ember-secret.secret-premium .secret-badge { border: 1px solid #467455; padding: 7px 10px; white-space: nowrap; color: #b5eac5; font-size: 12px; border-radius: 3px; }
#ember-secret.secret-premium .secret-preview-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
#ember-secret.secret-premium .secret-preview { position: relative; min-height: 205px; padding: 22px; border: 1px solid #7effa42e; background: linear-gradient(135deg,#12371e50,transparent 65%),#030b07; border-radius: 5px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
#ember-secret.secret-premium .secret-preview:hover { border-color: #76ffa880; box-shadow: 0 0 24px #33ff7715; }
#ember-secret.secret-premium .secret-slot { display: block; color: #89b99a; font-size: 12px; letter-spacing: .1em; margin-bottom: 38px; }
#ember-secret.secret-premium .secret-redacted { display: block; height: 10px; width: 70%; background: #91ffb218; margin-bottom: 9px; }
#ember-secret.secret-premium .secret-redacted.short { width: 40%; }
#ember-secret.secret-premium .secret-slot-bottom { display: flex; justify-content: space-between; align-items: center; color: #83a28e; font-size: 12px; margin-top: 28px; letter-spacing: .14em; }
#ember-secret.secret-premium .secret-slot-bottom span { color: #a0ffc0; font-size: 20px; }
#ember-secret.secret-premium .secret-preview::after,#ember-secret.secret-premium .secret-panel::after { content: ''; position: absolute; left: 0; right: 0; top: 45%; height: 2px; background: #60ff952e; pointer-events: none; opacity: 0; }
#ember-secret.secret-premium .secret-preview:hover::after,#ember-secret.secret-premium .secret-panel:hover::after { animation: secretPanelScan .6s ease-out; }
#ember-secret.secret-premium .secret-catalog-note { margin-top: 24px; color: #a3c2ae; font: 14px/1.7 Arial,sans-serif; }
#ember-secret.secret-premium .secret-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; padding: 8px 0 20px; color: #8daf99; font-size: 12px; letter-spacing: .06em; }
@keyframes secretSlice { 0%,89%,100% { opacity: 0; transform: none; } 90%,94% { opacity: .75; transform: translateX(-3px); } 92%,96% { opacity: .5; transform: translateX(3px); } }
@keyframes secretPanelScan { 0% { opacity: 0; transform: translateY(-55px); } 40% { opacity: .65; } 100% { opacity: 0; transform: translateY(70px); } }
@media(max-width:850px) { #ember-secret.secret-premium .secret-nav-note { display: none; } #ember-secret.secret-premium .secret-section-head { align-items: flex-start; flex-direction: column; } }
@media(max-width:600px) { #ember-secret.secret-premium .secret-top { padding: 14px; gap: 14px; } #ember-secret.secret-premium .secret-back { width: 100%; } #ember-secret.secret-premium .secret-hero { padding: 48px 0 0; } #ember-secret.secret-premium .secret-status { font-size: 11px; letter-spacing: .04em; } #ember-secret.secret-premium .secret-preview-grid { grid-template-columns: 1fr; } #ember-secret.secret-premium .secret-preview { min-height: 160px; } #ember-secret.secret-premium .secret-catalog { padding: 22px 18px; } #ember-secret.secret-premium .secret-hero-meta { margin-top: 44px; flex-wrap: wrap; } #ember-secret.secret-premium .secret-description br { display: none; } }
@media(prefers-reduced-motion:reduce) { #ember-secret.secret-premium *,#ember-secret.secret-premium *::before,#ember-secret.secret-premium *::after { animation: none !important; transition: none !important; } }
/* SECRET / interactive green light and restrained signal distortion. */
#ember-secret.secret-premium .secret-preview::before,#ember-secret.secret-premium .secret-action::before,#ember-secret.secret-premium .secret-catalog::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; background: radial-gradient(240px circle at var(--secret-px,50%) var(--secret-py,50%),#70ff9d22,transparent 75%); transition: opacity .25s; }
#ember-secret.secret-premium .secret-preview.secret-lit::before,#ember-secret.secret-premium .secret-action.secret-lit::before,#ember-secret.secret-premium .secret-catalog.secret-lit::before { opacity: 1; }
#ember-secret.secret-premium .secret-preview.secret-lit { border-color: #86ffb4a8; box-shadow: inset 0 0 22px #2cff7210,0 0 22px #2cff721c; }
#ember-secret.secret-premium .secret-preview { background-image: linear-gradient(#8bffac05 1px,transparent 1px),linear-gradient(90deg,#8bffac05 1px,transparent 1px); background-size: 22px 22px; }
#ember-secret.secret-premium .secret-slot { border-left: 2px solid #74ffab; padding-left: 10px; }
#ember-secret.secret-premium .secret-hero::before { content: ''; position: absolute; left: 0; right: 0; top: 38px; height: 36px; pointer-events: none; background: linear-gradient(#8dffab,#8dffab) left top/30px 1px no-repeat,linear-gradient(#8dffab,#8dffab) left top/1px 25px no-repeat,linear-gradient(#8dffab,#8dffab) right top/30px 1px no-repeat,linear-gradient(#8dffab,#8dffab) right top/1px 25px no-repeat; opacity: .45; }
#ember-secret.secret-premium .secret-action:hover .secret-glitch::before,#ember-secret.secret-premium .secret-action:focus-visible .secret-glitch::before { animation: secretSignalCut .5s steps(1) 1 !important; }
#ember-secret.secret-premium .secret-action:hover .secret-glitch::after,#ember-secret.secret-premium .secret-action:focus-visible .secret-glitch::after { animation: secretSignalCut .5s steps(1) 1 reverse !important; }
#ember-secret.secret-premium h1:hover .secret-glitch::before { animation: secretSignalCut .65s steps(1) 1 !important; }
#ember-secret.secret-premium h1:hover .secret-glitch::after { animation: secretSignalCut .65s steps(1) 1 reverse !important; }
#ember-secret.secret-premium .secret-action:active { box-shadow: -3px 0 #2cff78,3px 0 #baffde,0 0 30px #3cff7955; }
@keyframes secretSignalCut { 0%,100% { opacity: 0; transform: none; } 15%,35% { opacity: .7; transform: translate(-3px,1px); } 25%,60% { opacity: .4; transform: translate(3px,-1px); } 75% { opacity: .6; transform: translate(-1px,0); } }
@media(prefers-reduced-motion:reduce) { #ember-secret.secret-premium h1:hover .secret-glitch::before,#ember-secret.secret-premium h1:hover .secret-glitch::after,#ember-secret.secret-premium .secret-action:hover .secret-glitch::before,#ember-secret.secret-premium .secret-action:hover .secret-glitch::after,#ember-secret.secret-premium .secret-action:focus-visible .secret-glitch::before,#ember-secret.secret-premium .secret-action:focus-visible .secret-glitch::after { animation: none !important; } }


/* ==========================================================================
   SECRET CATALOG — PRODUCT LIST V1
   View-only catalog. Product actions open the seller's Discord profile.
   ========================================================================== */

#ember-secret.secret-premium .secret-catalog-intro {
  margin: -2px 0 32px;
  padding: 14px 16px;
  border-left: 2px solid #72ffa4;
  background: rgba(7, 23, 14, .72);
}

#ember-secret.secret-premium .secret-product-group {
  margin-top: 34px;
}

#ember-secret.secret-premium .secret-product-group + .secret-product-group {
  padding-top: 34px;
  border-top: 1px solid rgba(126,255,164,.13);
}

#ember-secret.secret-premium .secret-group-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

#ember-secret.secret-premium .secret-group-title {
  margin: 0;
  color: #eafff0;
  font: 700 clamp(17px,2vw,21px)/1.3 Arial, sans-serif;
  letter-spacing: -.01em;
}

#ember-secret.secret-premium .secret-group-count {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid rgba(117,255,162,.28);
  border-radius: 3px;
  color: #87b797;
  background: rgba(2,13,8,.72);
  font-size: 10px;
  letter-spacing: .12em;
}

#ember-secret.secret-premium .secret-products-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
}

#ember-secret.secret-premium .secret-product {
  display: flex;
  flex-direction: column;
  min-height: 225px;
  padding: 19px;
}

#ember-secret.secret-premium .secret-product .secret-slot {
  margin-bottom: 20px;
}

#ember-secret.secret-premium .secret-product h4 {
  margin: 0 0 12px;
  color: #f0fff4;
  font: 700 15px/1.42 Arial, sans-serif;
  overflow-wrap: anywhere;
}

#ember-secret.secret-premium .secret-product-status {
  margin: 0 0 18px !important;
  color: #89a994 !important;
  font: 12px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace !important;
}

#ember-secret.secret-premium .secret-product-action {
  width: 100%;
  min-height: 42px;
  margin-top: auto;
  padding: 9px 12px;
  gap: 10px;
  border-color: rgba(127,255,170,.46);
  background: rgba(4,18,10,.86);
  font-size: 11px;
  letter-spacing: .025em;
}

#ember-secret.secret-premium .secret-product-action:hover {
  background: rgba(8,34,18,.95);
}

@media (max-width: 960px) {
  #ember-secret.secret-premium .secret-products-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 600px) {
  #ember-secret.secret-premium .secret-products-grid {
    grid-template-columns: 1fr;
  }

  #ember-secret.secret-premium .secret-product {
    min-height: 190px;
  }

  #ember-secret.secret-premium .secret-group-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}


/* ========================================================================
   SECRET CATALOG — PREMIUM CONTROL DECK V2
   Search, classification, seller strip and high-detail card system.
   ======================================================================== */

#ember-secret.secret-premium {
  --secret-line: rgba(116,255,161,.22);
  --secret-line-hot: rgba(148,255,184,.72);
  --secret-ink: #effff4;
  --secret-dim: #8fb49c;
  --secret-panel: rgba(2,13,8,.82);
  --secret-panel-2: rgba(4,20,11,.92);
  --secret-neon: #58ff8d;
  --secret-cyan: #a4ffe0;
}

#ember-secret.secret-premium .secret-content { max-width: 1320px; }
#ember-secret.secret-premium .secret-top { max-width: 1520px; }
#ember-secret.secret-premium .secret-catalog {
  padding: clamp(24px,3.2vw,46px);
  border-color: rgba(114,255,161,.30);
  background:
    linear-gradient(180deg, rgba(5,22,12,.94), rgba(2,11,7,.96)),
    #020b07;
  box-shadow:
    0 38px 100px rgba(0,0,0,.34),
    0 0 0 1px rgba(116,255,161,.025),
    inset 0 1px 0 rgba(210,255,224,.04);
}
#ember-secret.secret-premium .secret-catalog::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(90deg,var(--secret-neon),transparent 16%,transparent 84%,var(--secret-cyan)) top/100% 1px no-repeat,
    linear-gradient(180deg,rgba(116,255,161,.025),transparent 28%);
  opacity: .48;
}

#ember-secret.secret-premium .secret-section-head h2 {
  max-width: 760px;
  font-size: clamp(25px,3vw,36px);
  font-weight: 760;
}
#ember-secret.secret-premium .secret-badge {
  border-color: rgba(99,255,150,.44);
  background: rgba(5,29,14,.78);
  box-shadow: inset 0 0 16px rgba(68,255,127,.04),0 0 24px rgba(68,255,127,.05);
}

#ember-secret.secret-premium .secret-market-overview {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: repeat(3,minmax(120px,.65fr)) minmax(290px,1.55fr);
  gap: 12px;
  margin: 0 0 18px;
}
#ember-secret.secret-premium .secret-market-stat,
#ember-secret.secret-premium .secret-seller-card {
  min-height: 92px;
  border: 1px solid rgba(117,255,161,.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg,rgba(90,255,139,.055),transparent 55%),
    rgba(1,12,7,.78);
  box-shadow: inset 0 1px 0 rgba(220,255,230,.025);
}
#ember-secret.secret-premium .secret-market-stat {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 18px;
}
#ember-secret.secret-premium .secret-market-stat-value {
  color: #eaffef;
  font: 800 22px/1.05 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing: -.03em;
  text-shadow: 0 0 18px rgba(77,255,137,.18);
}
#ember-secret.secret-premium .secret-market-stat small {
  margin-top: 8px;
  color: #769985;
  font-size: 9px;
  letter-spacing: .16em;
}
#ember-secret.secret-premium .secret-market-stat-live .secret-market-stat-value { color: #8fffb0; }
#ember-secret.secret-premium .secret-market-stat-live i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: #52ff83;
  box-shadow: 0 0 0 4px rgba(82,255,131,.08),0 0 14px rgba(82,255,131,.7);
  animation: secretLivePulse 1.8s ease-in-out infinite;
}
@keyframes secretLivePulse { 50% { opacity: .42; box-shadow: 0 0 0 7px rgba(82,255,131,0),0 0 6px rgba(82,255,131,.35); } }

#ember-secret.secret-premium .secret-seller-card {
  min-height: 92px;
  padding: 13px 15px;
  justify-content: flex-start;
  gap: 14px;
  border-color: rgba(126,255,169,.34);
  background:
    radial-gradient(circle at 0 50%,rgba(91,255,144,.10),transparent 34%),
    rgba(2,17,9,.92);
}
#ember-secret.secret-premium .secret-seller-card::after { opacity: .18; }
#ember-secret.secret-premium .secret-seller-icon {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(135,255,173,.36);
  border-radius: 50%;
  color: #a9ffc3;
  background: rgba(73,255,128,.06);
  box-shadow: inset 0 0 22px rgba(66,255,126,.05),0 0 22px rgba(66,255,126,.05);
  font-size: 22px;
}
#ember-secret.secret-premium .secret-seller-copy { display: flex; flex-direction: column; min-width: 0; text-align: left; line-height: 1.25; }
#ember-secret.secret-premium .secret-seller-copy small { color: #71917c; font-size: 9px; letter-spacing: .15em; }
#ember-secret.secret-premium .secret-seller-copy strong { margin-top: 4px; color: #effff4; font: 760 14px/1.2 Arial,sans-serif; }
#ember-secret.secret-premium .secret-seller-copy em { margin-top: 4px; color: #86ad94; font-style: normal; font-size: 10px; }
#ember-secret.secret-premium .secret-seller-arrow { margin-left: auto; color: #91ffb1; font-size: 19px; }

#ember-secret.secret-premium .secret-control-deck {
  position: sticky;
  top: 16px;
  z-index: 12;
  margin: 18px 0 32px;
  padding: 14px;
  border: 1px solid rgba(122,255,166,.28);
  border-radius: 10px;
  background:
    linear-gradient(180deg,rgba(4,20,11,.94),rgba(1,10,6,.94));
  -webkit-backdrop-filter: blur(18px) saturate(1.1);
  backdrop-filter: blur(18px) saturate(1.1);
  box-shadow: 0 16px 50px rgba(0,0,0,.34),0 0 28px rgba(47,255,112,.045),inset 0 1px 0 rgba(207,255,220,.04);
}
#ember-secret.secret-premium .secret-control-deck::before {
  content: '';
  position: absolute;
  left: 14px;
  right: 14px;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg,transparent,#78ffa1 18%,#c3ffdd 50%,#78ffa1 82%,transparent);
  opacity: .35;
}
#ember-secret.secret-premium .secret-control-top { display: grid; grid-template-columns: minmax(0,1fr) 250px; gap: 12px; }
#ember-secret.secret-premium .secret-search-block > label,
#ember-secret.secret-premium .secret-sort-block > span {
  display: block;
  margin: 0 0 7px;
  color: #759682;
  font-size: 9px;
  letter-spacing: .16em;
}
#ember-secret.secret-premium .secret-search-shell { position: relative; display: flex; align-items: center; min-height: 50px; }
#ember-secret.secret-premium .secret-search-icon {
  position: absolute;
  left: 16px;
  z-index: 2;
  color: #7dff9f;
  font-size: 21px;
  pointer-events: none;
}
#ember-secret.secret-premium #secret-search {
  width: 100%;
  height: 50px;
  padding: 0 154px 0 48px;
  border: 1px solid rgba(115,255,159,.24) !important;
  border-radius: 7px;
  background: rgba(0,9,5,.76) !important;
  color: #eaffef !important;
  font: 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
  outline: none;
  box-shadow: inset 0 0 22px rgba(64,255,122,.025);
}
#ember-secret.secret-premium #secret-search::placeholder { color: #587061; }
#ember-secret.secret-premium #secret-search:focus {
  border-color: rgba(143,255,178,.64) !important;
  box-shadow: 0 0 0 3px rgba(82,255,135,.055),0 0 28px rgba(82,255,135,.06),inset 0 0 24px rgba(82,255,135,.035) !important;
}
#ember-secret.secret-premium .secret-search-submit,
#ember-secret.secret-premium .secret-search-clear,
#ember-secret.secret-premium .secret-reset,
#ember-secret.secret-premium .secret-filter {
  appearance: none;
  border: 1px solid rgba(118,255,162,.24);
  background: rgba(5,24,12,.80);
  color: #c9ffda;
  font: 700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing: .10em;
  cursor: pointer;
  transition: border-color .18s,background .18s,color .18s,box-shadow .18s,transform .18s;
}
#ember-secret.secret-premium .secret-search-submit {
  position: absolute;
  right: 5px;
  height: 40px;
  min-width: 86px;
  border-radius: 5px;
  background: #8dffae;
  border-color: #b6ffca;
  color: #05200d;
}
#ember-secret.secret-premium .secret-search-clear {
  position: absolute;
  right: 98px;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 5px;
  opacity: 0;
  pointer-events: none;
  background: transparent;
  color: #88a991;
  font-size: 18px;
}
#ember-secret.secret-premium .secret-search-clear.is-visible { opacity: 1; pointer-events: auto; }
#ember-secret.secret-premium .secret-sort-block { display: block; }
#ember-secret.secret-premium #secret-sort {
  width: 100%;
  height: 50px;
  padding: 0 42px 0 14px;
  border: 1px solid rgba(115,255,159,.24) !important;
  border-radius: 7px;
  background: rgba(0,9,5,.76) !important;
  color: #d9ffe4 !important;
  font: 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
  outline: none;
  cursor: pointer;
}
#ember-secret.secret-premium #secret-sort:focus { border-color: rgba(143,255,178,.64) !important; }
#ember-secret.secret-premium .secret-filter-row { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
#ember-secret.secret-premium .secret-filter {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 5px;
  color: #86a98f;
}
#ember-secret.secret-premium .secret-filter span { margin-left: 7px; color: #53715d; }
#ember-secret.secret-premium .secret-filter:hover,
#ember-secret.secret-premium .secret-filter.is-active {
  transform: translateY(-1px);
  border-color: rgba(148,255,184,.58);
  background: rgba(21,63,34,.62);
  color: #e6ffec;
  box-shadow: 0 0 18px rgba(69,255,127,.06),inset 0 0 16px rgba(69,255,127,.035);
}
#ember-secret.secret-premium .secret-filter.is-active span { color: #92ffaf; }
#ember-secret.secret-premium .secret-results-line { display: flex; align-items: center; gap: 9px; min-height: 30px; margin-top: 9px; padding-top: 9px; border-top: 1px solid rgba(116,255,160,.10); }
#ember-secret.secret-premium .secret-results-line p { margin: 0 !important; color: #799984 !important; font-size: 10px !important; }
#ember-secret.secret-premium .secret-results-line strong { color: #b7ffc9; font-weight: 800; }
#ember-secret.secret-premium .secret-results-signal { width: 5px; height: 5px; border-radius: 50%; background: #61ff8d; box-shadow: 0 0 8px rgba(97,255,141,.72); }
#ember-secret.secret-premium .secret-reset { margin-left: auto; min-height: 26px; padding: 0 8px; border-radius: 4px; background: transparent; color: #66806d; }
#ember-secret.secret-premium .secret-reset:hover { color: #bcffcd; border-color: rgba(148,255,184,.38); }

#ember-secret.secret-premium .secret-no-results {
  margin: 28px 0;
  padding: 30px;
  border: 1px dashed rgba(120,255,164,.28);
  border-radius: 8px;
  text-align: center;
  background: rgba(2,13,8,.68);
}
#ember-secret.secret-premium .secret-no-results[hidden] { display: none !important; }
#ember-secret.secret-premium .secret-no-results > span { display: block; margin-bottom: 9px; color: #52705c; font-size: 11px; letter-spacing: .14em; }
#ember-secret.secret-premium .secret-no-results strong { color: #e8ffef; font: 760 18px/1.2 Arial,sans-serif; }
#ember-secret.secret-premium .secret-no-results p { margin-top: 7px !important; color: #799583 !important; font-size: 12px !important; }

#ember-secret.secret-premium .secret-product-group { position: relative; }
#ember-secret.secret-premium .secret-product-group[hidden],
#ember-secret.secret-premium .secret-product[hidden] { display: none !important; }
#ember-secret.secret-premium .secret-product-group + .secret-product-group { border-top-color: rgba(126,255,164,.16); }
#ember-secret.secret-premium .secret-group-heading {
  margin-bottom: 18px;
  padding-left: 14px;
  border-left: 2px solid rgba(94,255,145,.68);
}
#ember-secret.secret-premium .secret-group-title { font-size: clamp(18px,2vw,23px); }
#ember-secret.secret-premium .secret-group-count { border-radius: 999px; padding: 6px 10px; }

#ember-secret.secret-premium .secret-products-grid { gap: 14px; }
#ember-secret.secret-premium .secret-product {
  min-height: 270px;
  padding: 17px;
  border-radius: 8px;
  border-color: rgba(123,255,165,.20);
  background:
    radial-gradient(260px circle at var(--secret-px,50%) var(--secret-py,50%),rgba(101,255,151,.055),transparent 72%),
    linear-gradient(180deg,rgba(9,31,17,.78),rgba(1,11,6,.92));
  box-shadow: 0 14px 34px rgba(0,0,0,.18),inset 0 1px 0 rgba(221,255,231,.025);
  transform: translateY(0);
  transition: transform .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease;
}
#ember-secret.secret-premium .secret-product:hover {
  transform: translateY(-4px);
  border-color: rgba(145,255,180,.56);
  box-shadow: 0 22px 52px rgba(0,0,0,.30),0 0 28px rgba(60,255,123,.07),inset 0 1px 0 rgba(225,255,235,.045);
  filter: brightness(1.035);
}
#ember-secret.secret-premium .secret-product::after {
  top: 0;
  height: 1px;
  opacity: .35;
  background: linear-gradient(90deg,transparent,#77ffa0 50%,transparent);
}
#ember-secret.secret-premium .secret-product .secret-slot {
  margin-bottom: 11px;
  padding-left: 0;
  border-left: 0;
  color: #678471;
  font-size: 10px;
}
#ember-secret.secret-premium .secret-product-kicker { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 17px; }
#ember-secret.secret-premium .secret-product-kicker > span:first-child {
  max-width: 72%;
  padding: 5px 7px;
  overflow: hidden;
  border: 1px solid rgba(111,255,158,.17);
  border-radius: 3px;
  color: #79a287;
  background: rgba(4,20,11,.62);
  font-size: 8px;
  letter-spacing: .12em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#ember-secret.secret-premium .secret-product-dot { color: #8effaa; font-size: 8px; letter-spacing: .10em; }
#ember-secret.secret-premium .secret-product-dot::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: #64ff8d; box-shadow: 0 0 7px rgba(100,255,141,.7); vertical-align: 1px; }
#ember-secret.secret-premium .secret-product h4 {
  margin-bottom: 10px;
  color: #f3fff6;
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: -.012em;
}
#ember-secret.secret-premium .secret-product-status { padding-top: 9px; border-top: 1px solid rgba(122,255,164,.08); }
#ember-secret.secret-premium .secret-product-action {
  min-height: 44px;
  border-radius: 6px;
  border-color: rgba(128,255,169,.34);
  background: linear-gradient(180deg,rgba(18,55,29,.68),rgba(5,25,12,.88));
}
#ember-secret.secret-premium .secret-product-action:hover {
  border-color: rgba(177,255,201,.72);
  background: linear-gradient(180deg,rgba(32,85,47,.78),rgba(8,37,18,.95));
  box-shadow: 0 0 0 1px rgba(127,255,169,.04),0 0 24px rgba(66,255,126,.11),inset 0 0 20px rgba(92,255,143,.045);
}

@media (min-width: 1350px) {
  #ember-secret.secret-premium .secret-products-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media (max-width: 1060px) {
  #ember-secret.secret-premium .secret-market-overview { grid-template-columns: repeat(3,1fr); }
  #ember-secret.secret-premium .secret-seller-card { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
  #ember-secret.secret-premium .secret-control-deck { position: relative; top: auto; }
  #ember-secret.secret-premium .secret-control-top { grid-template-columns: 1fr; }
  #ember-secret.secret-premium .secret-market-overview { grid-template-columns: repeat(2,1fr); }
  #ember-secret.secret-premium .secret-market-stat-live { grid-column: span 2; }
  #ember-secret.secret-premium .secret-seller-card { grid-column: span 2; }
  #ember-secret.secret-premium .secret-filter-row { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
  #ember-secret.secret-premium .secret-filter { flex: 0 0 auto; }
}
@media (max-width: 520px) {
  #ember-secret.secret-premium .secret-market-overview { grid-template-columns: 1fr 1fr; }
  #ember-secret.secret-premium .secret-market-stat { min-height: 78px; padding: 12px; }
  #ember-secret.secret-premium .secret-market-stat-value { font-size: 18px; }
  #ember-secret.secret-premium .secret-seller-card { padding: 11px; }
  #ember-secret.secret-premium #secret-search { padding-right: 118px; font-size: 11px; }
  #ember-secret.secret-premium .secret-search-submit { min-width: 70px; }
  #ember-secret.secret-premium .secret-search-clear { right: 78px; width: 34px; }
  #ember-secret.secret-premium .secret-product { min-height: 235px; }
}
@media (prefers-reduced-motion: reduce) {
  #ember-secret.secret-premium .secret-market-stat-live i { animation: none !important; }
}

/* ========================================================================
   SECRET // FEEDBACK CHANNEL V1
   Premium modal + randomized DEMO feedback cards.
   ======================================================================== */
#ember-secret.secret-premium .secret-top-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
#ember-secret.secret-premium .secret-feedback-open {
  min-width:138px;
  border-color:rgba(120,255,165,.42);
  background:
    radial-gradient(circle at 20% 0%,rgba(87,255,145,.10),transparent 50%),
    linear-gradient(180deg,rgba(8,31,17,.92),rgba(2,13,7,.97));
}
#ember-secret.secret-premium .secret-feedback-icon {
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border:1px solid rgba(130,255,172,.35);
  border-radius:50%;
  color:#8dffad;
  box-shadow:0 0 12px rgba(63,255,126,.10),inset 0 0 8px rgba(72,255,132,.05);
}
body.secret-feedback-open { overflow:hidden !important; }
#ember-secret.secret-premium .secret-feedback-modal[hidden] { display:none !important; }
#ember-secret.secret-premium .secret-feedback-modal {
  position:fixed;
  inset:0;
  z-index:2147483400;
  display:grid;
  place-items:center;
  padding:24px;
  opacity:0;
  pointer-events:none;
  transition:opacity .19s ease;
}
#ember-secret.secret-premium .secret-feedback-modal.is-open {
  opacity:1;
  pointer-events:auto;
}
#ember-secret.secret-premium .secret-feedback-backdrop {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:
    radial-gradient(900px 600px at 50% 45%,rgba(28,100,51,.18),transparent 62%),
    rgba(0,4,2,.84);
  -webkit-backdrop-filter:blur(12px) saturate(1.15);
  backdrop-filter:blur(12px) saturate(1.15);
  cursor:default;
}
#ember-secret.secret-premium .secret-feedback-window {
  position:relative;
  z-index:1;
  width:min(1040px,96vw);
  max-height:min(820px,92vh);
  overflow:auto;
  padding:26px;
  border:1px solid rgba(125,255,166,.34);
  border-radius:12px;
  outline:none;
  background:
    linear-gradient(rgba(3,17,9,.94),rgba(1,10,5,.97)),
    repeating-linear-gradient(0deg,transparent 0 4px,rgba(84,255,135,.016) 4px 5px);
  box-shadow:
    0 42px 120px rgba(0,0,0,.64),
    0 0 0 1px rgba(112,255,158,.035),
    0 0 70px rgba(45,255,116,.065),
    inset 0 1px 0 rgba(222,255,232,.04);
  transform:translateY(14px) scale(.985);
  transition:transform .22s cubic-bezier(.2,.8,.2,1);
}
#ember-secret.secret-premium .secret-feedback-modal.is-open .secret-feedback-window {
  transform:none;
}
#ember-secret.secret-premium .secret-feedback-window::before {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(90deg,rgba(92,255,145,.03) 1px,transparent 1px),
    linear-gradient(rgba(92,255,145,.025) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,#000,transparent 78%);
}
#ember-secret.secret-premium .secret-feedback-window-head {
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(126,255,168,.12);
}
#ember-secret.secret-premium .secret-feedback-window-head h2 {
  margin:0;
  color:#effff4;
  font:700 clamp(22px,3vw,34px)/1.15 Arial,sans-serif;
  letter-spacing:-.025em;
}
#ember-secret.secret-premium .secret-feedback-close {
  flex:0 0 auto;
  width:42px;
  height:42px;
  border:1px solid rgba(126,255,167,.25);
  border-radius:7px;
  background:rgba(7,27,14,.78);
  color:#b7ffc9;
  font-size:24px;
  cursor:pointer;
  transition:border-color .18s,background .18s,box-shadow .18s,transform .18s;
}
#ember-secret.secret-premium .secret-feedback-close:hover {
  transform:rotate(2deg);
  border-color:rgba(173,255,199,.66);
  background:rgba(15,54,27,.90);
  box-shadow:0 0 22px rgba(68,255,127,.10);
}
#ember-secret.secret-premium .secret-feedback-notice {
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:12px;
  margin:16px 0 14px;
  padding:10px 12px;
  border:1px solid rgba(255,215,119,.17);
  border-radius:6px;
  background:rgba(52,38,8,.22);
}
#ember-secret.secret-premium .secret-feedback-notice > span {
  flex:0 0 auto;
  padding:4px 7px;
  border:1px solid rgba(255,218,123,.28);
  border-radius:3px;
  color:#ffe29b;
  font-size:8px;
  letter-spacing:.14em;
}
#ember-secret.secret-premium .secret-feedback-notice p {
  margin:0 !important;
  color:#b5ad8a !important;
  font-size:11px !important;
}
#ember-secret.secret-premium .secret-feedback-toolbar {
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
}
#ember-secret.secret-premium .secret-feedback-live {
  color:#8fb99b;
  font-size:9px;
  letter-spacing:.14em;
}
#ember-secret.secret-premium .secret-feedback-live i {
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:6px;
  border-radius:50%;
  background:#67ff91;
  box-shadow:0 0 9px rgba(103,255,145,.72);
  animation:secretFeedbackPulse 1.8s ease-in-out infinite;
}
#ember-secret.secret-premium .secret-feedback-refresh {
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(127,255,168,.22);
  border-radius:5px;
  background:rgba(4,22,11,.74);
  color:#8db89a;
  font:9px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.08em;
  cursor:pointer;
  transition:.18s ease;
}
#ember-secret.secret-premium .secret-feedback-refresh:hover {
  border-color:rgba(157,255,188,.55);
  color:#d7ffe2;
  background:rgba(15,51,26,.84);
}
#ember-secret.secret-premium .secret-feedback-grid {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:13px;
}
#ember-secret.secret-premium .secret-feedback-card {
  position:relative;
  min-width:0;
  min-height:190px;
  padding:15px;
  overflow:hidden;
  border:1px solid rgba(125,255,166,.17);
  border-radius:8px;
  background:
    radial-gradient(240px circle at 18% 0%,rgba(73,255,132,.06),transparent 58%),
    linear-gradient(180deg,rgba(8,29,16,.82),rgba(2,13,7,.94));
  box-shadow:0 14px 35px rgba(0,0,0,.19),inset 0 1px 0 rgba(220,255,230,.025);
  animation:secretFeedbackIn .42s cubic-bezier(.2,.8,.2,1) both;
  animation-delay:var(--feedback-delay,0ms);
}
#ember-secret.secret-premium .secret-feedback-card::after {
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  opacity:.45;
  background:linear-gradient(90deg,transparent,#7bffa4,transparent);
}
#ember-secret.secret-premium .secret-feedback-card-head {
  display:flex;
  align-items:center;
  gap:10px;
}
#ember-secret.secret-premium .secret-feedback-avatar {
  display:grid;
  place-items:center;
  flex:0 0 36px;
  width:36px;
  height:36px;
  border:1px solid rgba(138,255,176,.30);
  border-radius:9px;
  background:linear-gradient(145deg,rgba(49,121,70,.60),rgba(7,35,17,.85));
  color:#d8ffe3;
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  box-shadow:0 0 20px rgba(73,255,132,.07);
}
#ember-secret.secret-premium .secret-feedback-user {
  min-width:0;
  flex:1;
}
#ember-secret.secret-premium .secret-feedback-user strong {
  display:block;
  overflow:hidden;
  color:#f0fff4;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#ember-secret.secret-premium .secret-feedback-user small {
  display:block;
  margin-top:2px;
  overflow:hidden;
  color:#688674;
  font-size:8px;
  letter-spacing:.07em;
  text-transform:uppercase;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#ember-secret.secret-premium .secret-feedback-demo {
  flex:0 0 auto;
  padding:4px 6px;
  border:1px solid rgba(255,218,125,.24);
  border-radius:3px;
  color:#dcc77d;
  background:rgba(58,42,7,.26);
  font-size:7px;
  letter-spacing:.12em;
}
#ember-secret.secret-premium .secret-feedback-card > p {
  margin:15px 0 18px !important;
  color:#c9dbcf !important;
  font:13px/1.65 Arial,sans-serif !important;
}
#ember-secret.secret-premium .secret-feedback-meta {
  position:absolute;
  left:15px;
  right:15px;
  bottom:13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-top:8px;
  border-top:1px solid rgba(126,255,166,.07);
  color:#54705d;
  font-size:7px;
  letter-spacing:.09em;
}
#ember-secret.secret-premium .secret-feedback-meta span:first-child { color:#6f9c7c; }
#ember-secret.secret-premium .secret-feedback-foot {
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(126,255,166,.10);
  color:#5f7d68;
  font-size:8px;
  letter-spacing:.11em;
}
@keyframes secretFeedbackPulse { 50% { opacity:.42; box-shadow:0 0 4px rgba(103,255,145,.25); } }
@keyframes secretFeedbackIn { from { opacity:0; transform:translateY(8px); filter:blur(2px); } to { opacity:1; transform:none; filter:none; } }
@media(max-width:980px) {
  #ember-secret.secret-premium .secret-feedback-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #ember-secret.secret-premium .secret-nav-note { display:none; }
}
@media(max-width:650px) {
  #ember-secret.secret-premium .secret-top { align-items:stretch; }
  #ember-secret.secret-premium .secret-top-actions { width:100%; display:grid; grid-template-columns:1fr 1fr; }
  #ember-secret.secret-premium .secret-top-actions .secret-action { width:100%; min-width:0; }
  #ember-secret.secret-premium .secret-feedback-modal { padding:10px; }
  #ember-secret.secret-premium .secret-feedback-window { padding:18px 14px; max-height:94vh; }
  #ember-secret.secret-premium .secret-feedback-grid { grid-template-columns:1fr; }
  #ember-secret.secret-premium .secret-feedback-notice { align-items:flex-start; flex-direction:column; }
  #ember-secret.secret-premium .secret-feedback-toolbar { align-items:flex-start; flex-direction:column; }
  #ember-secret.secret-premium .secret-feedback-refresh { width:100%; }
  #ember-secret.secret-premium .secret-feedback-foot { flex-direction:column; gap:6px; }
}
@media(prefers-reduced-motion:reduce) {
  #ember-secret.secret-premium .secret-feedback-card,
  #ember-secret.secret-premium .secret-feedback-live i { animation:none !important; }
}



/* ========================================================================
   SECRET // COMMUNITY RELAY V2
   Premium cyan-violet feedback experience.
   Sample content remains explicitly marked as preview until real feedback
   replaces it.
   ======================================================================== */
#ember-secret.secret-premium .secret-feedback-open {
  position:relative;
  overflow:hidden;
  min-width:148px;
  border-color:rgba(105,238,255,.44) !important;
  background:
    radial-gradient(circle at 18% -10%,rgba(80,238,255,.18),transparent 46%),
    radial-gradient(circle at 92% 120%,rgba(137,86,255,.14),transparent 52%),
    linear-gradient(180deg,rgba(6,23,29,.94),rgba(3,10,16,.98)) !important;
  box-shadow:
    0 0 0 1px rgba(102,232,255,.04),
    0 0 24px rgba(65,219,255,.08),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#ember-secret.secret-premium .secret-feedback-open::after {
  content:"";
  position:absolute;
  inset:-30% -65%;
  pointer-events:none;
  opacity:.45;
  background:linear-gradient(105deg,transparent 42%,rgba(187,249,255,.22) 49%,transparent 56%);
  transform:translateX(-42%);
  transition:transform .7s cubic-bezier(.16,.84,.28,1);
}
#ember-secret.secret-premium .secret-feedback-open:hover::after { transform:translateX(44%); }
#ember-secret.secret-premium .secret-feedback-icon {
  border-color:rgba(118,239,255,.42) !important;
  color:#b7f7ff !important;
  background:rgba(42,176,203,.08);
  box-shadow:
    0 0 14px rgba(68,218,255,.16),
    inset 0 0 10px rgba(99,231,255,.06) !important;
}

#ember-secret.secret-premium .secret-feedback-backdrop {
  background:
    radial-gradient(800px 600px at 26% 28%,rgba(48,197,232,.13),transparent 63%),
    radial-gradient(760px 580px at 76% 64%,rgba(117,65,239,.12),transparent 66%),
    rgba(0,3,7,.90) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.18) !important;
  backdrop-filter:blur(18px) saturate(1.18) !important;
}
#ember-secret.secret-premium .secret-feedback-window {
  isolation:isolate;
  width:min(1140px,96vw) !important;
  max-height:min(860px,93vh) !important;
  padding:30px !important;
  border:1px solid rgba(114,228,255,.30) !important;
  border-radius:18px !important;
  background:
    radial-gradient(700px 300px at 8% 0%,rgba(54,225,255,.075),transparent 70%),
    radial-gradient(620px 340px at 96% 100%,rgba(129,75,255,.07),transparent 72%),
    linear-gradient(180deg,rgba(3,13,20,.965),rgba(2,8,14,.985)) !important;
  box-shadow:
    0 52px 150px rgba(0,0,0,.72),
    0 0 0 1px rgba(141,235,255,.035),
    0 0 85px rgba(46,201,255,.07),
    0 0 120px rgba(123,74,255,.035),
    inset 0 1px 0 rgba(231,252,255,.055) !important;
}
#ember-secret.secret-premium .secret-feedback-window::before {
  z-index:-1;
  opacity:.62;
  background:
    linear-gradient(90deg,rgba(96,225,255,.032) 1px,transparent 1px),
    linear-gradient(rgba(127,102,255,.026) 1px,transparent 1px) !important;
  background-size:38px 38px !important;
  mask-image:linear-gradient(to bottom,#000,rgba(0,0,0,.72) 58%,transparent 96%) !important;
}
#ember-secret.secret-premium .secret-feedback-window::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  border-radius:inherit;
  box-shadow:
    inset 22px 0 50px rgba(63,212,255,.025),
    inset -22px 0 50px rgba(127,75,255,.025);
}
#ember-secret.secret-premium .secret-feedback-beam {
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,#72eaff 30%,#a68bff 68%,transparent);
  box-shadow:0 0 18px rgba(93,225,255,.52),0 0 34px rgba(127,83,255,.22);
  animation:secretRelayBeam 5.2s ease-in-out infinite alternate;
}
@keyframes secretRelayBeam {
  from { opacity:.50; transform:scaleX(.74); }
  to { opacity:1; transform:scaleX(1); }
}

#ember-secret.secret-premium .secret-feedback-window-head {
  align-items:flex-start !important;
  padding-bottom:22px !important;
  border-bottom:1px solid rgba(130,223,255,.11) !important;
}
#ember-secret.secret-premium .secret-feedback-heading { max-width:780px; }
#ember-secret.secret-premium .secret-feedback-kicker {
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:9px;
  color:#7fdff1;
  font:800 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.18em;
}
#ember-secret.secret-premium .secret-feedback-kicker-dot {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#76ecff;
  box-shadow:0 0 11px rgba(105,232,255,.9),0 0 22px rgba(105,232,255,.32);
}
#ember-secret.secret-premium .secret-feedback-window-head .secret-eyebrow {
  margin:0 0 8px !important;
  color:#637d8f !important;
}
#ember-secret.secret-premium .secret-feedback-window-head h2 {
  font:800 clamp(28px,4vw,43px)/1.02 Arial,sans-serif !important;
  color:#effcff !important;
  letter-spacing:-.045em !important;
  text-shadow:0 12px 36px rgba(0,0,0,.32);
}
#ember-secret.secret-premium .secret-feedback-window-head h2 span {
  background:linear-gradient(90deg,#78efff,#a18bff 62%,#d2c7ff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:none;
}
#ember-secret.secret-premium .secret-feedback-subtitle {
  max-width:690px;
  margin:10px 0 0 !important;
  color:#8096a2 !important;
  font:12px/1.65 Arial,sans-serif !important;
}
#ember-secret.secret-premium .secret-feedback-close {
  width:46px !important;
  height:46px !important;
  border-radius:12px !important;
  border-color:rgba(118,229,255,.20) !important;
  background:linear-gradient(180deg,rgba(8,29,37,.86),rgba(4,13,20,.94)) !important;
  color:#a9edf7 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
#ember-secret.secret-premium .secret-feedback-close:hover {
  transform:rotate(4deg) scale(1.03) !important;
  border-color:rgba(158,237,255,.60) !important;
  background:rgba(12,42,53,.95) !important;
  box-shadow:0 0 26px rgba(74,217,255,.13) !important;
}

#ember-secret.secret-premium .secret-feedback-statusbar {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:16px 0 10px;
}
#ember-secret.secret-premium .secret-feedback-statusbar > span {
  display:flex;
  align-items:center;
  min-width:0;
  min-height:40px;
  padding:0 11px;
  border:1px solid rgba(119,221,255,.10);
  border-radius:8px;
  background:
    linear-gradient(180deg,rgba(13,28,39,.70),rgba(5,15,23,.77));
  color:#6e8997;
  font:8px/1.2 ui-monospace,Consolas,monospace;
  letter-spacing:.09em;
  white-space:nowrap;
}
#ember-secret.secret-premium .secret-feedback-statusbar b {
  margin-right:7px;
  color:#a4cbd5;
  font-weight:800;
}
#ember-secret.secret-premium .secret-feedback-statusbar i.is-live {
  width:6px;
  height:6px;
  margin-right:7px;
  border-radius:50%;
  background:#69f7d0;
  box-shadow:0 0 9px rgba(105,247,208,.72);
}

#ember-secret.secret-premium .secret-feedback-notice {
  margin:10px 0 16px !important;
  padding:9px 11px !important;
  border-color:rgba(135,174,255,.11) !important;
  border-radius:8px !important;
  background:
    linear-gradient(90deg,rgba(61,97,157,.08),rgba(96,67,165,.06)) !important;
}
#ember-secret.secret-premium .secret-feedback-notice > span {
  border-color:rgba(142,188,255,.18) !important;
  color:#93b4db !important;
  background:rgba(76,104,159,.10);
}
#ember-secret.secret-premium .secret-feedback-notice p {
  color:#748b9a !important;
  font-size:10px !important;
}

#ember-secret.secret-premium .secret-feedback-toolbar {
  margin-bottom:15px !important;
}
#ember-secret.secret-premium .secret-feedback-live {
  color:#7d9eaa !important;
  font-size:9px !important;
}
#ember-secret.secret-premium .secret-feedback-live i {
  background:#69f7d0 !important;
  box-shadow:0 0 9px rgba(105,247,208,.72) !important;
}
#ember-secret.secret-premium .secret-feedback-live small {
  color:#536a77;
  font-size:8px;
}
#ember-secret.secret-premium .secret-feedback-refresh {
  min-height:38px !important;
  padding:0 14px !important;
  border-color:rgba(120,222,255,.20) !important;
  border-radius:9px !important;
  background:
    radial-gradient(circle at 15% 0%,rgba(75,220,255,.08),transparent 55%),
    rgba(5,19,28,.82) !important;
  color:#81b7c4 !important;
  font-size:8px !important;
}
#ember-secret.secret-premium .secret-feedback-refresh span {
  display:inline-block;
  margin-right:5px;
  color:#9aefff;
  transition:transform .35s ease;
}
#ember-secret.secret-premium .secret-feedback-refresh:hover {
  border-color:rgba(150,235,255,.50) !important;
  color:#d9faff !important;
  box-shadow:0 0 24px rgba(65,214,255,.08);
}
#ember-secret.secret-premium .secret-feedback-refresh:hover span { transform:rotate(135deg); }

#ember-secret.secret-premium .secret-feedback-grid {
  gap:14px !important;
}
#ember-secret.secret-premium .secret-feedback-card {
  --relay-accent:#6ce8ff;
  --relay-rgb:108,232,255;
  min-height:208px !important;
  padding:17px !important;
  border-color:rgba(var(--relay-rgb),.16) !important;
  border-radius:13px !important;
  background:
    radial-gradient(250px circle at 12% -5%,rgba(var(--relay-rgb),.07),transparent 60%),
    linear-gradient(155deg,rgba(12,28,39,.88),rgba(4,12,19,.96)) !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(226,251,255,.025) !important;
  transition:
    transform .22s cubic-bezier(.16,.84,.28,1),
    border-color .22s ease,
    box-shadow .22s ease !important;
}
#ember-secret.secret-premium .secret-feedback-card:nth-child(3n+2) {
  --relay-accent:#9a84ff;
  --relay-rgb:154,132,255;
}
#ember-secret.secret-premium .secret-feedback-card:nth-child(3n+3) {
  --relay-accent:#6ff7cf;
  --relay-rgb:111,247,207;
}
#ember-secret.secret-premium .secret-feedback-card:hover {
  transform:translateY(-4px);
  border-color:rgba(var(--relay-rgb),.34) !important;
  box-shadow:
    0 25px 58px rgba(0,0,0,.32),
    0 0 28px rgba(var(--relay-rgb),.06),
    inset 0 1px 0 rgba(235,252,255,.04) !important;
}
#ember-secret.secret-premium .secret-feedback-card::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  border-radius:inherit;
  background:
    linear-gradient(110deg,transparent 24%,rgba(255,255,255,.045) 48%,transparent 70%);
  transform:translateX(-35%);
  transition:opacity .2s ease,transform .65s cubic-bezier(.16,.84,.28,1);
}
#ember-secret.secret-premium .secret-feedback-card:hover::before {
  opacity:1;
  transform:translateX(25%);
}
#ember-secret.secret-premium .secret-feedback-card::after {
  opacity:.70 !important;
  background:linear-gradient(90deg,transparent,var(--relay-accent),transparent) !important;
  box-shadow:0 0 12px rgba(var(--relay-rgb),.25);
}
#ember-secret.secret-premium .secret-feedback-avatar {
  flex-basis:40px !important;
  width:40px !important;
  height:40px !important;
  border-color:rgba(var(--relay-rgb),.28) !important;
  border-radius:11px !important;
  background:
    radial-gradient(circle at 30% 20%,rgba(var(--relay-rgb),.22),transparent 60%),
    linear-gradient(145deg,rgba(15,45,56,.92),rgba(5,18,26,.96)) !important;
  color:#e9fbff !important;
  box-shadow:0 0 20px rgba(var(--relay-rgb),.07) !important;
}
#ember-secret.secret-premium .secret-feedback-user strong {
  color:#f1fbff !important;
  font-size:12px !important;
}
#ember-secret.secret-premium .secret-feedback-user small {
  color:#607887 !important;
}
#ember-secret.secret-premium .secret-feedback-preview {
  flex:0 0 auto;
  padding:4px 6px;
  border:1px solid rgba(var(--relay-rgb),.16);
  border-radius:5px;
  color:rgba(var(--relay-rgb),.72);
  background:rgba(var(--relay-rgb),.035);
  font:700 6px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.12em;
}
#ember-secret.secret-premium .secret-feedback-card > p {
  margin:16px 0 20px !important;
  color:#c9d9e0 !important;
  font:13px/1.68 Arial,sans-serif !important;
}
#ember-secret.secret-premium .secret-feedback-meta {
  border-top-color:rgba(var(--relay-rgb),.065) !important;
  color:#4d6470 !important;
}
#ember-secret.secret-premium .secret-feedback-meta span:first-child {
  color:rgba(var(--relay-rgb),.58) !important;
}
#ember-secret.secret-premium .secret-feedback-foot {
  border-top-color:rgba(112,215,255,.09) !important;
  color:#536c79 !important;
}

@media(max-width:900px) {
  #ember-secret.secret-premium .secret-feedback-statusbar {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:650px) {
  #ember-secret.secret-premium .secret-feedback-window { padding:20px 15px !important; }
  #ember-secret.secret-premium .secret-feedback-statusbar { grid-template-columns:1fr 1fr; }
  #ember-secret.secret-premium .secret-feedback-statusbar > span { min-height:36px; font-size:7px; }
  #ember-secret.secret-premium .secret-feedback-subtitle { font-size:11px !important; }
  #ember-secret.secret-premium .secret-feedback-live small { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  #ember-secret.secret-premium .secret-feedback-beam { animation:none !important; }
  #ember-secret.secret-premium .secret-feedback-card:hover { transform:none; }
}


/* ========================================================================
   SECRET FEEDBACKS — EXTRA AMBIENT V3
   ======================================================================== */
#ember-secret.secret-premium .secret-feedback-notice { display:none !important; }
#ember-secret.secret-premium .secret-feedback-window { overflow:auto; }
#ember-secret.secret-premium .secret-feedback-ambient {
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  border-radius:inherit;
}
#ember-secret.secret-premium .secret-feedback-beam,
#ember-secret.secret-premium .secret-feedback-orb,
#ember-secret.secret-premium .secret-feedback-particle {
  position:absolute;
  pointer-events:none;
}
#ember-secret.secret-premium .secret-feedback-beam {
  top:0;
  left:7%;
  right:7%;
  height:1px;
  background:linear-gradient(90deg,transparent,#72eaff 30%,#a68bff 68%,transparent);
  box-shadow:0 0 18px rgba(93,225,255,.52),0 0 34px rgba(127,83,255,.22);
  animation:secretRelayBeam 5.2s ease-in-out infinite alternate;
}
#ember-secret.secret-premium .secret-feedback-orb {
  border-radius:50%;
  filter:blur(16px);
  opacity:.7;
  animation:secretFeedbackOrbFloat 16s ease-in-out infinite alternate;
}
#ember-secret.secret-premium .secret-feedback-orb.orb-a {
  top:-60px; left:-40px; width:260px; height:260px;
  background:radial-gradient(circle,rgba(80,238,255,.20),rgba(80,238,255,0) 70%);
}
#ember-secret.secret-premium .secret-feedback-orb.orb-b {
  top:14%; right:-110px; width:320px; height:320px;
  background:radial-gradient(circle,rgba(137,86,255,.17),rgba(137,86,255,0) 70%);
  animation-duration:18s;
}
#ember-secret.secret-premium .secret-feedback-orb.orb-c {
  bottom:-140px; left:28%; width:420px; height:260px;
  background:radial-gradient(circle,rgba(105,247,208,.12),rgba(105,247,208,0) 72%);
  animation-duration:20s;
}
#ember-secret.secret-premium .secret-feedback-particle {
  width:4px; height:4px; border-radius:50%;
  background:#a8f1ff; box-shadow:0 0 12px rgba(142,240,255,.72);
  opacity:0;
  animation:secretFeedbackParticleRise 9s linear infinite;
}
#ember-secret.secret-premium .secret-feedback-particle.p-a { left:9%; animation-delay:0s; }
#ember-secret.secret-premium .secret-feedback-particle.p-b { left:22%; animation-delay:1.4s; }
#ember-secret.secret-premium .secret-feedback-particle.p-c { left:39%; animation-delay:2.8s; }
#ember-secret.secret-premium .secret-feedback-particle.p-d { left:58%; animation-delay:3.7s; }
#ember-secret.secret-premium .secret-feedback-particle.p-e { left:77%; animation-delay:5.1s; }
#ember-secret.secret-premium .secret-feedback-particle.p-f { left:89%; animation-delay:6.3s; }
#ember-secret.secret-premium .secret-feedback-grid { position:relative; z-index:1; }
@keyframes secretFeedbackOrbFloat {
  from { transform:translate3d(0,0,0) scale(1); }
  to { transform:translate3d(28px,-18px,0) scale(1.08); }
}
@keyframes secretFeedbackParticleRise {
  0% { top:102%; opacity:0; transform:translateY(0) scale(.75); }
  14% { opacity:.8; }
  100% { top:-6%; opacity:0; transform:translateY(-44px) scale(1.15); }
}
@media(prefers-reduced-motion:reduce) {
  #ember-secret.secret-premium .secret-feedback-beam,
  #ember-secret.secret-premium .secret-feedback-orb,
  #ember-secret.secret-premium .secret-feedback-particle { animation:none !important; }
}


/* ========================================================================
   SECRET FEEDBACKS — VIDEO BACKGROUND V4
   ======================================================================== */
#ember-secret.secret-premium .secret-feedback-modal {
  isolation:isolate;
  overflow:hidden;
  background:#02070f;
}
#ember-secret.secret-premium .secret-feedback-video-layer {
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  background:#02070f;
}
#ember-secret.secret-premium .secret-feedback-video-layer video {
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:100%;
  min-width:100%;
  min-height:100%;
  object-fit:cover;
  transform:translate(-50%,-50%) scale(1.045);
  filter:saturate(1.28) contrast(1.06) brightness(.68);
  opacity:.94;
}
#ember-secret.secret-premium .secret-feedback-video-color {
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 650px at 12% 18%,rgba(65,225,255,.19),transparent 62%),
    radial-gradient(860px 650px at 88% 18%,rgba(135,87,255,.20),transparent 62%),
    radial-gradient(900px 560px at 55% 100%,rgba(64,255,181,.10),transparent 64%),
    linear-gradient(180deg,rgba(1,5,13,.12),rgba(1,5,12,.48));
  mix-blend-mode:screen;
}
#ember-secret.secret-premium .secret-feedback-video-grid {
  position:absolute;
  inset:0;
  opacity:.22;
  background-image:
    linear-gradient(rgba(115,231,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(147,111,255,.045) 1px,transparent 1px);
  background-size:54px 54px;
  mask-image:radial-gradient(circle at 50% 45%,#000 10%,rgba(0,0,0,.7) 58%,transparent 100%);
  animation:secretFeedbackVideoGrid 18s linear infinite;
}
#ember-secret.secret-premium .secret-feedback-backdrop {
  z-index:1 !important;
  background:
    radial-gradient(900px 640px at 50% 48%,rgba(0,0,0,.06),rgba(0,0,0,.26) 66%,rgba(0,0,0,.50) 100%),
    linear-gradient(180deg,rgba(1,5,12,.26),rgba(0,3,9,.44)) !important;
  -webkit-backdrop-filter:blur(2px) saturate(1.08) !important;
  backdrop-filter:blur(2px) saturate(1.08) !important;
}
#ember-secret.secret-premium .secret-feedback-window {
  z-index:2 !important;
  background:
    radial-gradient(680px 300px at 8% 0%,rgba(54,225,255,.085),transparent 70%),
    radial-gradient(620px 340px at 96% 100%,rgba(129,75,255,.075),transparent 72%),
    linear-gradient(180deg,rgba(4,15,24,.82),rgba(2,9,16,.89)) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.24);
  backdrop-filter:blur(18px) saturate(1.24);
  box-shadow:
    0 52px 150px rgba(0,0,0,.66),
    0 0 0 1px rgba(141,235,255,.04),
    0 0 95px rgba(46,201,255,.09),
    0 0 125px rgba(123,74,255,.055),
    inset 0 1px 0 rgba(231,252,255,.065) !important;
}
#ember-secret.secret-premium .secret-feedback-card {
  background:
    radial-gradient(250px circle at 12% -5%,rgba(var(--relay-rgb),.09),transparent 60%),
    linear-gradient(155deg,rgba(9,26,38,.74),rgba(3,11,20,.88)) !important;
  -webkit-backdrop-filter:blur(12px) saturate(1.18);
  backdrop-filter:blur(12px) saturate(1.18);
}
@keyframes secretFeedbackVideoGrid {
  from { transform:translate3d(0,0,0); }
  to { transform:translate3d(54px,54px,0); }
}
@media(prefers-reduced-motion:reduce) {
  #ember-secret.secret-premium .secret-feedback-video-grid { animation:none !important; }
}