/* NYXORA / APEX — final visual layer. Keep above-content modals in the root stack. */
body { background:#0b0b0b; }
#app { position:relative; /* No z-index: Bootstrap modals must remain above their backdrop. */ }
.ambient-scene { z-index:0; background:radial-gradient(ellipse at 50% 10%,rgba(var(--cl-accent-rgb),.11),transparent 75%); }
.aurora { position:absolute; width:105vw; height:100vh; pointer-events:none; opacity:.9; background:radial-gradient(ellipse at center,rgba(var(--cl-accent-rgb),.47),rgba(var(--cl-accent-rgb),.17) 35%,transparent 67%); animation:aurora-flow 9s ease-in-out infinite alternate; }
.aurora-one { top:-30vh; left:-65vw; transform:rotate(-25deg); }
.aurora-two { top:0; right:-60vw; animation-delay:-5s; animation-duration:12s; }
.aurora-three { bottom:-65vh; left:0; animation-delay:-3s; background:radial-gradient(ellipse,rgba(var(--cl-accent-rgb),.4),transparent 65%); }
@keyframes aurora-flow { 0% { transform:translate3d(-8%,-12%,0) rotate(-20deg) scale(.9); opacity:.65; } 100% { transform:translate3d(18%,17%,0) rotate(12deg) scale(1.15); opacity:1; } }
.ambient-grid { opacity:.75; background-size:88px 88px; background-image:linear-gradient(rgba(var(--cl-accent-rgb),.11) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--cl-accent-rgb),.11) 1px,transparent 1px); mask-image:linear-gradient(transparent,#000 25%,#000 70%,transparent); }
.star-field { position:absolute; inset:-10%; opacity:.65; background-image:radial-gradient(circle at 12% 22%,#d5b5f2 1px,transparent 2px),radial-gradient(circle at 80% 42%,#b883e7 1px,transparent 2px),radial-gradient(circle at 28% 77%,#b883e7 1px,transparent 2px),radial-gradient(circle at 70% 89%,#d5b5f2 1px,transparent 2px); background-size:390px 380px; animation:star-drift 20s linear infinite; }
.star-field-two { background-size:620px 580px; animation-direction:reverse; opacity:.25; }
@keyframes star-drift { from { transform:translateY(0); } to { transform:translateY(-100px); } }
.announcement { background:linear-gradient(90deg,#1c0c29,#42145d,#1c0c29); border-bottom:1px solid rgba(var(--cl-accent-rgb),.55); font-size:12px; letter-spacing:.4px; padding:10px 16px; }
.announcement a { color:#f1dfff; font-weight:600; }
.navbar { background:rgba(11,11,11,.82); box-shadow:none; border-color:rgba(var(--cl-accent-rgb),.2); }
.navbar .navbar-brand { letter-spacing:-.8px; }
.navbar .nav-item a.nav-link { font-size:12px; }
.hero { background-color:transparent; border-bottom:0; }
.hero .bg-overlay { display:none; }
.hero .container { position:relative; padding:108px 24px 98px; }
.hero .content { max-width:1000px; }
.hero-universe { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.portal-halo { position:absolute; width:1040px; height:620px; top:-230px; left:calc(50% - 520px); background:radial-gradient(ellipse,rgba(var(--cl-accent-rgb),.65),rgba(var(--cl-accent-rgb),.22) 35%,transparent 68%); animation:portal-breathe 6s ease-in-out infinite alternate; }
@keyframes portal-breathe { from { transform:scale(.87); opacity:.6; } to { transform:scale(1.15); opacity:1; } }
.portal-ring { position:absolute; width:1050px; height:660px; left:calc(50% - 525px); top:-230px; border-radius:50%; border:1px solid rgba(var(--cl-accent-rgb),.7); box-shadow:0 0 30px rgba(var(--cl-accent-rgb),.18),inset 0 0 24px rgba(var(--cl-accent-rgb),.13); transform:rotate(-18deg); }
.portal-ring::before { content:""; position:absolute; inset:-2px; border:2px solid transparent; border-top-color:#b880e9; border-left-color:rgba(var(--cl-accent-rgb),.3); border-radius:50%; animation:ring-orbit 12s linear infinite; }
.portal-ring::after { content:""; position:absolute; top:15%; left:12%; width:7px; height:7px; background:#dfbaff; border-radius:50%; box-shadow:0 0 18px 7px rgba(var(--cl-accent-rgb),.7); }
.ring-two { width:870px; height:540px; left:calc(50% - 435px); top:-165px; transform:rotate(16deg); opacity:.7; }
.ring-two::before { animation-duration:16s; animation-direction:reverse; }
.ring-three { width:1230px; height:780px; left:calc(50% - 615px); top:-295px; opacity:.35; transform:rotate(-8deg); }
@keyframes ring-orbit { to { transform:rotate(360deg); } }
.portal-core { position:absolute; inset:0; background:radial-gradient(ellipse at 50% 55%,rgba(11,11,11,.87) 12%,rgba(11,11,11,.35) 45%,transparent 75%); }
.floating-shard { position:absolute; width:48px; height:48px; background:linear-gradient(140deg,#7d26cd,#29113c); border:1px solid #a058dc; box-shadow:inset 8px 8px 16px rgba(255,255,255,.06),0 0 38px rgba(var(--cl-accent-rgb),.3); transform:rotate(30deg); animation:shard-float 7s ease-in-out infinite alternate; }
.shard-one { left:10%; top:48%; }.shard-two { right:11%; top:24%; width:30px; height:30px; animation-delay:-3s; }
@keyframes shard-float { to { transform:translateY(-32px) rotate(65deg); } }
.universe-label { position:absolute; right:28px; top:48%; writing-mode:vertical-rl; font-size:8px; letter-spacing:3px; color:#a57cbf; }
.hero-eyebrow { background:rgba(28,14,38,.86); border-color:rgba(var(--cl-accent-rgb),.55); font-size:9px; letter-spacing:2.4px; padding:9px 17px; margin-bottom:28px; }
.hero .content h1 { font-size:clamp(54px,7.6vw,100px); line-height:.99; letter-spacing:-5px; font-weight:700; text-wrap:balance; margin-bottom:28px; }
.hero .highlight { background:linear-gradient(100deg,#efe0ff 0%,#ae6de6 32%,#7d26cd 60%,#d5a9f6 80%,#efe0ff 100%); background-size:220% 100%; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:title-light 7s ease-in-out infinite alternate; }
@keyframes title-light { to { background-position:100% 50%; } }
.hero .content .hero-description { max-width:480px; font-size:15px; line-height:1.85; color:#c8b7d4; }
.hero .content .hero-actions a { border-radius:12px; min-height:54px; padding:15px 26px; font-size:13px; }
.hero-actions .btn-primary { background:linear-gradient(115deg,#7d26cd,#6110ac); box-shadow:0 0 0 4px rgba(var(--cl-accent-rgb),.12),0 8px 38px rgba(var(--cl-accent-rgb),.4); }
.hero-actions .btn-outline-primary { background:rgba(19,13,25,.8); border-color:rgba(var(--cl-accent-rgb),.3); }
.hero .fake-searchbar { max-width:430px; background:rgba(15,10,20,.82); border-color:rgba(var(--cl-accent-rgb),.25); margin-top:24px; }
.hero-bottom-rail { position:relative; width:calc(100% - 48px); max-width:1192px; margin:0 auto; display:flex; align-items:center; gap:24px; padding:20px 0; border-top:1px solid rgba(var(--cl-accent-rgb),.27); border-bottom:1px solid rgba(var(--cl-accent-rgb),.12); color:#baa2cd; font-size:9px; letter-spacing:2px; }
.hero-bottom-rail a { display:grid; place-items:center; width:32px; height:32px; margin-left:auto; color:#e3c4fa; border:1px solid rgba(var(--cl-accent-rgb),.35); border-radius:50%; text-decoration:none; font-size:18px; }
.hero { display:block; }
.offer-strip { border-radius:0 0 14px 14px; margin-top:0; border-top:0; background:linear-gradient(90deg,rgba(var(--cl-accent-rgb),.23),rgba(20,12,27,.7)); padding:17px 24px; }
.catalog-section { padding-top:78px; }
.catalog-overline { display:flex; align-items:center; gap:16px; color:#b583db; font-size:9px; letter-spacing:2px; margin-bottom:18px; }
.catalog-overline::after { content:""; flex:1; height:1px; background:linear-gradient(90deg,rgba(var(--cl-accent-rgb),.5),transparent); }
.catalog-section .section-title h2 { font-size:clamp(32px,4vw,50px); letter-spacing:-2px; }
.catalog-toolbar { background:rgba(20,12,28,.85); border-color:rgba(var(--cl-accent-rgb),.28); padding:13px; }
.products .catalog-card { position:relative; background:linear-gradient(145deg,rgba(39,22,52,.96),rgba(15,13,18,.98) 65%); border-color:rgba(var(--cl-accent-rgb),.32); border-radius:20px; transition:transform .3s,border-color .3s,box-shadow .3s; }
.products .catalog-card::before { content:""; position:absolute; z-index:2; pointer-events:none; inset:0; opacity:0; background:radial-gradient(380px circle at var(--pointer-x,50%) var(--pointer-y,0),rgba(var(--cl-accent-rgb),.2),transparent 70%); transition:opacity .3s; }
.products .catalog-card:hover::before { opacity:1; }
.products .catalog-card:hover { transform:translateY(-9px); border-color:#a35cde; box-shadow:0 24px 48px rgba(0,0,0,.5),0 0 35px rgba(var(--cl-accent-rgb),.2); }
.products .catalog-card .card-img-top { aspect-ratio:16/10; border-color:rgba(var(--cl-accent-rgb),.25); background:radial-gradient(ellipse at center,#30143f,#110c17); }
.products .catalog-card .card-body { padding:24px; }
.products .catalog-card .card-title { font-size:20px; }
.products .catalog-card .catalog-price { color:#ead4fb!important; font-size:28px; }
.catalog-cta { background:linear-gradient(90deg,rgba(var(--cl-accent-rgb),.3),rgba(var(--cl-accent-rgb),.12)); border-color:rgba(var(--cl-accent-rgb),.45); }
.catalog-arrow { background:rgba(var(--cl-accent-rgb),.18); }
.catalog-card:hover .catalog-arrow { background:var(--cl-accent); color:white; transform:rotate(45deg); transition:transform .3s,background .3s; }
.features .list .feature { background:linear-gradient(145deg,rgba(38,19,53,.92),rgba(16,12,20,.96)); border-color:rgba(var(--cl-accent-rgb),.25); transition:transform .25s,border-color .25s; }
.features .list .feature:hover { transform:translateY(-6px); border-color:#9e58d6; }
.features .list .feature i { box-shadow:0 0 25px rgba(var(--cl-accent-rgb),.16); }
.socials .social { background:linear-gradient(100deg,rgba(42,19,60,.95),rgba(17,11,22,.95)); border-color:rgba(var(--cl-accent-rgb),.3); }
.product-stage { background:linear-gradient(140deg,rgba(var(--cl-accent-rgb),.4),#160d1c 70%); border-color:rgba(var(--cl-accent-rgb),.6); box-shadow:0 0 50px rgba(var(--cl-accent-rgb),.13); }
.product-purchase-panel { background:radial-gradient(450px at var(--pointer-x,100%) var(--pointer-y,0),rgba(var(--cl-accent-rgb),.22),transparent),linear-gradient(150deg,#24152f,#120e16 70%); border-color:rgba(var(--cl-accent-rgb),.55); }
.product-purchase-panel::before { height:3px; box-shadow:0 0 20px rgba(var(--cl-accent-rgb),.4); }
.product-details { background:rgba(21,14,27,.96); border-color:rgba(var(--cl-accent-rgb),.25); }
footer.footer { background:linear-gradient(180deg,rgba(26,12,37,.8),rgba(11,11,11,.9)); border-color:rgba(var(--cl-accent-rgb),.3); }
.motion-controls { position:relative; }
.motion-toggle { background:rgba(20,12,28,.9); }
.motion-paused .ambient-scene *, .motion-paused .hero-universe *, .motion-paused .hero-universe *::before,.motion-paused .hero .highlight,
.page-inactive .ambient-scene *, .page-inactive .hero-universe *, .page-inactive .hero-universe *::before,.page-inactive .hero .highlight { animation-play-state:paused!important; }
@media(max-width:991px) { .hero .container { padding:90px 24px 68px; }.hero .content h1 { letter-spacing:-3px; }.floating-shard { opacity:.55; }.shard-one { left:3%; }.shard-two { right:4%; }.universe-label { display:none; } }
@media(max-width:575px) { .hero .container { padding:68px 20px 46px; }.hero .content h1 { font-size:55px; letter-spacing:-2.8px; }.hero .content .hero-description { font-size:13px; max-width:310px; }.hero-eyebrow { font-size:8px; letter-spacing:1.7px; }.hero .hero-actions { flex-wrap:nowrap; }.hero .content .hero-actions a { min-height:48px; padding:12px 13px; font-size:11px; gap:10px; width:auto; flex:1; }.hero-bottom-rail { width:calc(100% - 40px); gap:12px; font-size:7px; letter-spacing:1px; }.hero-bottom-rail > span:nth-child(3) { display:none; }.portal-ring { width:680px; height:530px; left:calc(50% - 340px); top:-220px; }.ring-two { width:560px; height:430px; left:calc(50% - 280px); top:-170px; }.ring-three { width:780px; height:630px; left:calc(50% - 390px); top:-270px; }.shard-one { width:23px; height:23px; top:38%; left:2%; }.shard-two { top:15%; width:18px; height:18px; }.catalog-section { padding-top:50px; }.catalog-section .section-title h2 { letter-spacing:-1.2px; }.offer-strip { margin-left:20px; margin-right:20px; }.products .catalog-card .card-img-top { aspect-ratio:16/9; }.aurora { width:150vw; }.aurora-one { left:-100vw; }.aurora-two { right:-100vw; } }
@media(prefers-reduced-motion:reduce) { .ambient-scene *, .hero-universe *, .hero-universe *::before,.hero .highlight { animation:none!important; }.products .catalog-card:hover { transform:none; } }
/* Screenshot reference: compact shelves and game sections, in the existing palette. */
.catalog-featured { margin:28px 0 42px; }.catalog-featured[hidden],.catalog-game[hidden],.catalog-game-title[hidden],.all-products-heading[hidden] { display:none!important; }
.catalog-shelf-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:18px; }
.catalog-shelf-heading h3 { font-size:22px; letter-spacing:-.5px; margin:0; }.catalog-shelf-heading .product-eyebrow { font-size:9px; margin-bottom:8px; }
.shelf-buttons { display:flex; gap:8px; }.shelf-buttons button { width:34px; height:34px; border:1px solid rgba(var(--cl-accent-rgb),.4); border-radius:50%; background:#23142e; color:#d9b8f3; }.shelf-buttons button:hover { background:var(--cl-accent); color:#fff; }
.featured-track { display:flex; flex-wrap:nowrap; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:#7d26cd #19111f; padding:8px 2px 16px; margin:0; }
.featured-track > .catalog-item { flex:0 0 230px; width:230px; padding:0; margin:0!important; scroll-snap-align:start; }
.catalog-game { margin-bottom:30px; }.catalog-game-title { display:flex; align-items:center; gap:9px; font-size:17px; font-weight:500; margin:0 0 18px; }.catalog-game-title > span { width:7px; height:7px; background:#a35be0; box-shadow:0 0 12px rgba(var(--cl-accent-rgb),.5); border-radius:50%; }
.catalog-grid { --bs-gutter-x:18px; }.catalog-grid .catalog-item { margin-bottom:18px!important; }
.products .catalog-card { border-radius:15px; background:linear-gradient(145deg,#201725,#141117); border-color:#382440; }
.products .catalog-card .card-img-top { aspect-ratio:auto; height:184px; padding:14px 14px 0; border:0; background:transparent; }
.products .catalog-card .card-img-top img { width:100%; height:100%; object-fit:contain; border-radius:8px; }
.products .catalog-card .card-body { padding:18px 16px; }
.products .catalog-card .catalog-meta { margin-bottom:9px; }.products .catalog-card .catalog-kind { font-size:9px; color:#b39bc3; letter-spacing:.7px; }
.products .catalog-card .card-title { min-height:2.6em; margin-bottom:18px; font-size:15px; font-weight:600; line-height:1.3; letter-spacing:-.2px; }
.catalog-price-row { align-items:flex-end; border-top:0; padding:0; gap:6px; }
.catalog-price-row > div { display:flex; align-items:baseline; gap:5px; flex-wrap:wrap; }
.catalog-price-label { display:inline; margin:0; font-size:9px; }
.products .catalog-card .catalog-price { display:inline; font-size:19px; letter-spacing:-.4px; }
.products .catalog-card .catalog-stock { border-radius:99px; padding:5px 8px; color:#dbb8f6; background:rgba(var(--cl-accent-rgb),.2); font-size:9px; font-weight:500; }
.products .catalog-card .catalog-stock.is-unavailable { color:#c0adb8; background:rgba(255,255,255,.05); }
.catalog-card .badges { position:absolute; top:10px; left:10px; display:flex; gap:5px; flex-wrap:wrap; }.catalog-card .badges > div { padding:4px 8px; border-radius:99px; font-size:9px; }
@media(max-width:575px) { .featured-track > .catalog-item { flex-basis:205px; width:205px; }.catalog-grid > .catalog-item { width:50%; }.catalog-grid { --bs-gutter-x:12px; }.catalog-grid .catalog-card .card-img-top { height:135px; padding:8px 8px 0; }.catalog-grid .catalog-card .card-body { padding:12px; }.catalog-grid .catalog-card .card-title { font-size:13px; }.catalog-grid .catalog-price-row { flex-wrap:wrap; gap:10px; }.catalog-grid .catalog-card .catalog-price { font-size:18px; }.catalog-grid .catalog-kind { font-size:8px; }.catalog-shelf-heading h3 { font-size:20px; } }
@media(max-width:359px) { .catalog-grid > .catalog-item { width:100%; } }

/* Merchant-selected best seller badges, also copied into the horizontal shelf. */
.catalog-card .badges { z-index:3; max-width:calc(100% - 20px); }
.catalog-card .badges > .nyxora-best-seller { background:linear-gradient(110deg,#7d26cd,#6110ac); color:#fff; border:1px solid #b77dea; font-size:10px; font-weight:600; padding:5px 9px; line-height:1.3; box-shadow:0 3px 14px rgba(0,0,0,.3); }
/* Flowing metaballs: the original theme's liquid technique with a bounded canvas. */
.liquid-filter-defs { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
.liquid-canvas { position:absolute; inset:0; display:block; width:100%; height:100%; filter:url('#nyxora-liquid-goo'); opacity:.48; pointer-events:none; mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.45) 35%,rgba(0,0,0,.45) 65%,#000); }
.ambient-scene:has(.liquid-canvas) .aurora { opacity:.45; }
.purchase-activity { position:fixed; bottom:24px; left:24px; z-index:1040; width:360px; min-height:118px; border:1px solid rgba(var(--cl-accent-rgb),.5); border-radius:14px; overflow:hidden; background:#120e17; box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 24px rgba(var(--cl-accent-rgb),.1); animation:purchase-slide-in .45s cubic-bezier(.22,1,.36,1); }
.purchase-activity[hidden] { display:none!important; }
.purchase-activity-art { position:absolute; inset:0 0 0 40%; background:linear-gradient(130deg,#3f1c57,#19101f); }
.purchase-activity-art img { width:100%; height:100%; object-fit:cover; }
.purchase-activity-art::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#120e17,rgba(18,14,23,.7) 35%,rgba(18,14,23,.1)); }
.purchase-activity-copy { position:relative; width:78%; display:flex; flex-direction:column; padding:17px 20px; gap:4px; }
.purchase-activity-label { color:#b9a6c8; font-size:10px; }
.purchase-activity-name { font-size:14px; font-weight:600; color:#f6eafa; line-height:1.4; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.purchase-activity-time { color:#bd9cd4; font-size:10px; }
.purchase-activity-country { color:#c4b6cd; font-size:11px; margin-top:5px; }
.purchase-activity-country:empty { display:none; }
.purchase-activity-close { position:absolute; right:5px; top:5px; z-index:1; width:32px; height:32px; display:grid; place-items:center; border:0; border-radius:8px; background:rgba(13,9,18,.75); color:#e4cff3; font-size:21px; line-height:1; }
.purchase-activity-close:hover { background:var(--cl-accent); color:#fff; }
@keyframes purchase-slide-in { from { opacity:0; transform:translateX(-32px); } to { opacity:1; transform:translateX(0); } }
@media(max-width:575px) { .purchase-activity { left:12px; bottom:calc(12px + env(safe-area-inset-bottom)); width:min(340px,calc(100vw - 24px)); min-height:106px; }.purchase-activity-copy { padding:14px 16px; }.purchase-activity-close { width:40px;height:40px; }.liquid-canvas { opacity:.38; } }
@media(prefers-reduced-motion:reduce) { .purchase-activity { animation:none!important; }.liquid-canvas { opacity:.25; } }
.purchase-activity-event { color:#d6c2e5; font-size:11px; }
.purchase-activity .purchase-activity-label { color:#dec2f4; font-size:10px; font-weight:600; }


/* NYXORA motion pass: subtle, premium, and GPU-friendly. */
@media (prefers-reduced-motion: no-preference) {
  .hero-eyebrow { animation: nyxora-hero-rise .55s .05s both cubic-bezier(.22,1,.36,1); }
  .hero .content h1 { animation: nyxora-hero-rise .7s .12s both cubic-bezier(.22,1,.36,1); }
  .hero .hero-description { animation: nyxora-hero-rise .7s .2s both cubic-bezier(.22,1,.36,1); }
  .hero .hero-actions { animation: nyxora-hero-rise .7s .28s both cubic-bezier(.22,1,.36,1); }
  .hero .fake-searchbar, .hero-bottom-rail { animation: nyxora-hero-rise .7s .36s both cubic-bezier(.22,1,.36,1); }

  .nyxora-motion-ready .nyxora-reveal {
    opacity: 0;
    transform: translate3d(0,22px,0) scale(.985);
    transition: opacity .62s cubic-bezier(.22,1,.36,1), transform .62s cubic-bezier(.22,1,.36,1);
    transition-delay: var(--reveal-delay, 0ms);
    will-change: opacity, transform;
  }
  .nyxora-motion-ready .nyxora-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1);
  }

  .catalog-card, .feature, .social, .product-purchase-panel {
    backface-visibility: hidden;
    transform: translateZ(0);
  }

  .purchase-activity:not([hidden]) {
    animation: purchase-slide-in .5s cubic-bezier(.16,1,.3,1), purchase-soft-glow 2.4s .5s ease-out 1;
  }
}

@keyframes nyxora-hero-rise {
  from { opacity:0; transform:translate3d(0,24px,0) scale(.985); filter:blur(5px); }
  to { opacity:1; transform:translate3d(0,0,0) scale(1); filter:blur(0); }
}
@keyframes purchase-soft-glow {
  0% { box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 0 rgba(var(--cl-accent-rgb),0); }
  35% { box-shadow:0 16px 48px rgba(0,0,0,.55),0 0 32px rgba(var(--cl-accent-rgb),.22); }
  100% { box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 24px rgba(var(--cl-accent-rgb),.1); }
}

.purchase-activity-label {
  opacity:.72;
  letter-spacing:.55px;
  text-transform:uppercase;
  font-size:8px!important;
  font-weight:500!important;
}