/* ELYRAON — NOVA cosmic candy theme: vivid gradients, glow, playful motion */
:root{
  color-scheme:dark;
  --space-0:#05060f;
  --space-1:#0a0b1e;
  --space-2:#12142e;
  --ink:#f4f2ff;
  --muted:#b9bce0;
  --faint:#8f93bd;
  --starlight:#ffe02b;
  --pink:#ff5db1;
  --pink-soft:#ff9ad5;
  --violet:#8b5cf6;
  --violet-soft:#c4b5fd;
  --cyan:#55d6f2;
  --cyan-soft:#a8ecff;
  --line:rgba(196,200,255,.14);
  --line-soft:rgba(196,200,255,.09);
  --grad-candy:linear-gradient(100deg,#ffe02b 0%,#ff9ad5 26%,#ff5db1 46%,#a78bfa 68%,#55d6f2 100%);
  --grad-warm:linear-gradient(100deg,#ffe02b,#ffb03a 45%,#ff5db1 100%);
  --grad-cool:linear-gradient(100deg,#8b5cf6,#55d6f2 100%);
  --wrap:1180px;
  --ease-bounce:cubic-bezier(.34,1.56,.64,1);
  --shadow-card:0 18px 46px rgba(2,2,16,.5);
}

/* ---------- global backdrop ---------- */
html{background:var(--space-0)}
body{
  background:
    radial-gradient(ellipse 60% 42% at 85% -4%,rgba(139,92,246,.22),transparent 60%),
    radial-gradient(ellipse 48% 36% at -8% 22%,rgba(255,93,177,.13),transparent 60%),
    radial-gradient(ellipse 52% 40% at 108% 62%,rgba(85,214,242,.11),transparent 60%),
    radial-gradient(ellipse 60% 50% at 30% 108%,rgba(255,224,43,.06),transparent 60%),
    var(--space-0);
  color:var(--ink);
}
::selection{background:var(--starlight);color:#17102e}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--space-0)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#3b2f6e,#7c3fa0);border-radius:8px;border:2px solid var(--space-0)}
a{transition:color .2s ease}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}

/* ---------- header ---------- */
.site-header{
  background:rgba(7,8,20,.72);
  border-bottom:1px solid var(--line-soft);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.brand{color:#fbfaff}
.brand-mark{
  border-radius:12px;color:#1b1035;
  background:var(--grad-warm);
  box-shadow:0 0 22px rgba(255,224,43,.35),0 4px 14px rgba(255,93,177,.3);
}
.main-nav{color:var(--muted)}
.main-nav a:hover,.text-link:hover,.card-detail-link:hover{color:var(--starlight)}
.main-nav .nav-cta{
  border:1px solid rgba(255,224,43,.55);border-radius:999px;color:var(--starlight);
  background:rgba(255,224,43,.07);transition:transform .25s var(--ease-bounce),box-shadow .25s ease,background .25s ease;
}
.main-nav .nav-cta:hover{background:rgba(255,224,43,.15);transform:translateY(-2px);box-shadow:0 0 24px rgba(255,224,43,.25);color:var(--starlight)}
.nav-cta span{color:var(--cyan)}
.menu-toggle span{background:var(--starlight)}

/* ---------- shared type ---------- */
.eyebrow{color:var(--faint)}
.eyebrow-dot{background:var(--starlight);box-shadow:0 0 12px var(--starlight)}
.hero-eyebrow-slash{color:var(--pink);font-weight:700}
.eyebrow-light{color:var(--cyan)}
.heading-rule{background:var(--grad-candy)}
h1 em,h2 em{
  background-image:var(--grad-candy);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:pan-gradient 7s linear infinite;
}
.text-link{color:var(--starlight)}
.text-link span{color:var(--pink-soft)}

/* ---------- buttons ---------- */
.button{color:#241239;background:var(--grad-warm);box-shadow:0 10px 26px rgba(255,93,177,.28)}
.button:hover{box-shadow:0 16px 38px rgba(255,93,177,.42),0 0 30px rgba(255,224,43,.25)}
.button-dark{color:#241239}
.button span{transition:transform .25s var(--ease-bounce)}
.button:hover span{transform:translate(2px,-2px)}
.button-disabled{background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--faint)}

/* ---------- hero ---------- */
.hero{
  background:
    radial-gradient(circle at 72% 30%,rgba(139,92,246,.16),transparent 26rem),
    radial-gradient(circle at 88% 74%,rgba(255,93,177,.12),transparent 26rem),
    radial-gradient(circle at 12% 88%,rgba(85,214,242,.08),transparent 24rem);
}
.hero h1{color:#fbfaff;text-shadow:0 6px 40px rgba(0,0,0,.55)}
.hero-lede{color:var(--muted)}
.hero-text-link{color:#e8e6f7}
.hero-text-link span{color:var(--cyan)}
.hero-proof{color:var(--muted)}
.proof-icon{border:1px solid rgba(255,224,43,.6);color:var(--starlight);background:rgba(255,224,43,.07)}
.hero-proof i{background:var(--pink);box-shadow:0 0 8px var(--pink)}

/* glowing tilting frame around the nova image */
.hero-art::before{
  content:"";position:absolute;inset:6% -4% -2% 2%;z-index:0;border-radius:40px;
  background:var(--grad-cool);filter:blur(46px);opacity:.4;
  animation:glow-breathe 6s ease-in-out infinite;
}
.hero-art::after{
  content:"";position:absolute;inset:-7% -9%;z-index:1;pointer-events:none;
  border:1.5px dashed rgba(85,214,242,.3);border-radius:50%;
  transform:rotate(-8deg);animation:spin-slow 40s linear infinite;
}
.hero-universe{
  border:1.5px solid transparent;
  background:
    linear-gradient(160deg,#191636,#0b0a22) padding-box,
    var(--grad-candy) border-box;
  box-shadow:0 34px 80px rgba(2,2,18,.6),0 0 60px rgba(139,92,246,.22);
  transform:rotate(2.2deg);
  animation:hero-float 7.5s ease-in-out infinite;
}
.hero-image-label{
  bottom:-14px;right:8%;
  background:rgba(10,11,30,.82);border:1px solid var(--line);
  color:#f4f2ff;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 10px 30px rgba(2,2,18,.45);
}
.hero-image-pulse{background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:pulse-dot 2s ease-in-out infinite}
.hero-bottom{border-top:1px solid var(--line-soft);color:var(--faint)}
.hero-bottom i{background:var(--grad-candy)}

/* stars + orbs */
.stars{background-repeat:repeat;animation:twinkle 5s ease-in-out infinite}
.stars-a{background-image:radial-gradient(1.3px 1.3px at 58.2% 52.0%, #ffe9a8 62%, transparent 72%),radial-gradient(1.1px 1.1px at 75.3% 68.9%, #ffffff 62%, transparent 72%),radial-gradient(1.0px 1.0px at 4.9% 22.6%, #ffe9a8 62%, transparent 72%),radial-gradient(1.0px 1.0px at 71.0% 67.1%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 10.5% 89.9%, #ffe9a8 62%, transparent 72%),radial-gradient(1.3px 1.3px at 45.1% 28.1%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 76.6% 96.3%, #ffffff 62%, transparent 72%),radial-gradient(0.8px 0.8px at 33.7% 65.0%, #ffffff 62%, transparent 72%),radial-gradient(1.0px 1.0px at 50.5% 76.8%, #ffffffd9 62%, transparent 72%),radial-gradient(1.1px 1.1px at 0.3% 57.7%, #ffffffd9 62%, transparent 72%),radial-gradient(1.3px 1.3px at 70.2% 85.4%, #ffffff 62%, transparent 72%),radial-gradient(1.4px 1.4px at 83.6% 42.8%, #ffffff 62%, transparent 72%),radial-gradient(0.8px 0.8px at 84.6% 29.0%, #ffffffd9 62%, transparent 72%),radial-gradient(1.4px 1.4px at 2.6% 15.4%, #ffffff 62%, transparent 72%),radial-gradient(1.2px 1.2px at 32.5% 61.4%, #ffffffd9 62%, transparent 72%),radial-gradient(1.2px 1.2px at 80.7% 60.8%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 26.9% 8.0%, #ffe9a8 62%, transparent 72%),radial-gradient(0.9px 0.9px at 23.9% 81.4%, #ffffffd9 62%, transparent 72%),radial-gradient(0.9px 0.9px at 7.2% 2.6%, #ffffffd9 62%, transparent 72%),radial-gradient(1.1px 1.1px at 54.3% 99.4%, #ffffffd9 62%, transparent 72%),radial-gradient(1.0px 1.0px at 35.5% 63.0%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 75.7% 43.2%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 68.2% 53.0%, #ffffffd9 62%, transparent 72%),radial-gradient(0.9px 0.9px at 48.6% 41.8%, #ffffff 62%, transparent 72%),radial-gradient(1.0px 1.0px at 32.9% 54.0%, #ffe9a8 62%, transparent 72%),radial-gradient(0.9px 0.9px at 82.4% 59.6%, #ffe9a8 62%, transparent 72%);
  background-size:420px 420px;animation-duration:4.6s}
.stars-b{background-image:radial-gradient(1.1px 1.1px at 58.5% 59.5%, #ffffff 62%, transparent 72%),radial-gradient(1.4px 1.4px at 83.1% 67.0%, #ffd7ee 62%, transparent 72%),radial-gradient(1.3px 1.3px at 64.4% 86.7%, #ffffff 62%, transparent 72%),radial-gradient(1.7px 1.7px at 45.7% 6.8%, #bfeaff 62%, transparent 72%),radial-gradient(1.1px 1.1px at 70.8% 50.8%, #ffffff 62%, transparent 72%),radial-gradient(1.8px 1.8px at 53.8% 44.8%, #ffffff 62%, transparent 72%),radial-gradient(1.5px 1.5px at 94.9% 93.6%, #bfeaff 62%, transparent 72%),radial-gradient(1.4px 1.4px at 52.4% 46.1%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 21.9% 9.3%, #ffd7ee 62%, transparent 72%),radial-gradient(1.6px 1.6px at 63.4% 23.1%, #ffffff 62%, transparent 72%),radial-gradient(1.2px 1.2px at 70.7% 88.5%, #ffffff 62%, transparent 72%),radial-gradient(1.5px 1.5px at 54.6% 76.8%, #ffffff 62%, transparent 72%),radial-gradient(1.1px 1.1px at 76.4% 93.9%, #ffffff 62%, transparent 72%),radial-gradient(1.4px 1.4px at 24.3% 18.1%, #ffffff 62%, transparent 72%),radial-gradient(1.0px 1.0px at 77.0% 26.2%, #ffffff 62%, transparent 72%),radial-gradient(1.7px 1.7px at 34.2% 4.4%, #ffffff 62%, transparent 72%),radial-gradient(1.6px 1.6px at 87.4% 7.2%, #ffffff 62%, transparent 72%),radial-gradient(1.3px 1.3px at 77.9% 31.8%, #bfeaff 62%, transparent 72%),radial-gradient(1.6px 1.6px at 42.7% 69.3%, #ffd7ee 62%, transparent 72%),radial-gradient(1.5px 1.5px at 41.0% 31.2%, #ffd7ee 62%, transparent 72%);
  background-size:640px 640px;animation-duration:6.4s;animation-delay:.8s}
.stars-c{background-image:radial-gradient(1.5px 1.5px at 91.5% 39.2%, #ffe02b 62%, transparent 72%),radial-gradient(2.0px 2.0px at 89.1% 55.7%, #ffffff 62%, transparent 72%),radial-gradient(2.3px 2.3px at 82.4% 83.5%, #ffe02b 62%, transparent 72%),radial-gradient(1.4px 1.4px at 39.4% 40.0%, #8be4ff 62%, transparent 72%),radial-gradient(2.2px 2.2px at 67.8% 61.4%, #ff9ad5 62%, transparent 72%),radial-gradient(2.2px 2.2px at 66.4% 2.4%, #ff9ad5 62%, transparent 72%),radial-gradient(1.6px 1.6px at 30.7% 16.3%, #ffe02b 62%, transparent 72%),radial-gradient(1.5px 1.5px at 18.6% 70.6%, #ffe02b 62%, transparent 72%),radial-gradient(1.6px 1.6px at 68.7% 13.0%, #ffe02b 62%, transparent 72%),radial-gradient(2.1px 2.1px at 14.6% 84.4%, #8be4ff 62%, transparent 72%),radial-gradient(1.8px 1.8px at 38.0% 68.7%, #ff9ad5 62%, transparent 72%),radial-gradient(1.8px 1.8px at 82.5% 66.6%, #ffe02b 62%, transparent 72%);
  background-size:900px 900px;animation-duration:8s;animation-delay:1.6s}

.orb{translate:calc(var(--mx,0)*var(--depth,18)*1px) calc(var(--my,0)*var(--depth,18)*1px);transition:translate .35s ease-out}
.orb-pink{width:92px;height:92px;left:-3%;bottom:6%;
  background:radial-gradient(circle at 32% 30%,#ffc7e6,#ff5db1 48%,#a3126b);
  box-shadow:0 0 44px rgba(255,93,177,.55),inset -12px -14px 30px rgba(60,4,44,.55);
  animation:orb-float 8s ease-in-out infinite}
.orb-cyan{width:44px;height:44px;right:2%;top:4%;
  background:radial-gradient(circle at 34% 30%,#d8f7ff,#55d6f2 52%,#1668a0);
  box-shadow:0 0 30px rgba(85,214,242,.6),inset -8px -10px 18px rgba(6,52,84,.6);
  animation:orb-float 6s ease-in-out infinite reverse}
.orb-gold{width:26px;height:26px;left:16%;top:-4%;
  background:radial-gradient(circle at 35% 30%,#fff7c2,#ffe02b 55%,#c78a12);
  box-shadow:0 0 26px rgba(255,224,43,.7);
  animation:orb-float 5s ease-in-out infinite;animation-delay:1.2s}
.comet{right:16%;top:20%;background:linear-gradient(90deg,transparent,#a8ecff);box-shadow:0 0 12px rgba(85,214,242,.8);animation:comet-drift 9s ease-in-out infinite}

/* ---------- intro band ---------- */
.intro-band{
  background:
    radial-gradient(circle at 12% 20%,rgba(255,224,43,.16),transparent 18rem),
    radial-gradient(circle at 88% 90%,rgba(85,214,242,.14),transparent 20rem),
    linear-gradient(100deg,#3d1170 0%,#7a1fa2 48%,#c2369b 100%);
  border-block:1px solid rgba(255,255,255,.12);
}
.intro-grid .eyebrow{color:#ffe9a8}
.intro-grid>p:nth-child(2){color:#fdf6ff;text-shadow:0 2px 18px rgba(40,4,60,.35)}
.intro-mark{color:var(--starlight);text-shadow:0 0 30px rgba(255,224,43,.6)}

/* ---------- catalog ---------- */
.catalog-section{
  background:
    radial-gradient(circle at 4% 12%,rgba(139,92,246,.1),transparent 22rem),
    radial-gradient(circle at 96% 80%,rgba(85,214,242,.08),transparent 24rem);
}
.section-heading h2,.approach-copy h2,.closing-section h2,.storefront-layout h2{color:#fbfaff}
.section-aside{color:var(--muted)}
.catalog-toolbar{border-top:1px solid var(--line-soft)}
.filter-chip{background:rgba(20,20,46,.7);border-color:rgba(196,200,255,.16);color:var(--muted)}
.filter-chip:hover{border-color:rgba(255,224,43,.4)}
.filter-chip span{color:var(--faint)}
.filter-chip.active{background:var(--grad-warm);border-color:transparent;color:#2a1240;box-shadow:0 6px 20px rgba(255,93,177,.35)}
.filter-chip.active span{color:#5c2b12}
.search-box{background:rgba(16,16,38,.75);border:1px solid rgba(196,200,255,.18);color:var(--faint)}
.search-box:focus-within{box-shadow:0 0 0 3px rgba(85,214,242,.18),0 0 22px rgba(85,214,242,.15);border-color:rgba(85,214,242,.5)}
.search-box input{color:var(--ink)}

/* product cards: glass + animated gradient border */
.product-card{
  border:1px solid rgba(196,200,255,.1);
  border-radius:20px;
  background:linear-gradient(165deg,rgba(32,28,72,.82),rgba(12,11,32,.94));
  box-shadow:var(--shadow-card);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.product-card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;z-index:0;pointer-events:none;
  background:var(--grad-candy);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:.32;transition:opacity .3s ease;
}
.product-card:hover{box-shadow:0 30px 60px rgba(2,2,18,.6),0 0 44px rgba(139,92,246,.18),0 0 22px rgba(255,93,177,.12)}
.product-card:hover::before{opacity:1}
.card-top,.card-content,.card-bottom{position:relative;z-index:1}
.category-tag{color:var(--faint)}
.channel-tag{border:1px solid rgba(85,214,242,.35);background:rgba(85,214,242,.09);color:var(--cyan)}
.status{border:1px solid rgba(196,200,255,.2);background:rgba(255,255,255,.04);color:var(--muted)}
.status i{background:currentColor;box-shadow:0 0 8px currentColor}
.status-live{border-color:rgba(255,224,43,.55);color:var(--starlight);background:rgba(255,224,43,.08)}
.status-coming_soon{border-color:rgba(255,93,177,.5);color:var(--pink-soft);background:rgba(255,93,177,.08)}
.product-glyph{
  background:linear-gradient(140deg,rgba(255,224,43,.16),rgba(255,93,177,.14));
  border:1px solid rgba(255,224,43,.4);color:var(--starlight);
  box-shadow:0 0 18px rgba(255,224,43,.12);
}
.product-card:nth-child(4n+2) .product-glyph{background:linear-gradient(140deg,rgba(255,93,177,.18),rgba(139,92,246,.16));border-color:rgba(255,93,177,.45);color:var(--pink-soft);box-shadow:0 0 18px rgba(255,93,177,.14)}
.product-card:nth-child(4n+3) .product-glyph{background:linear-gradient(140deg,rgba(139,92,246,.2),rgba(85,214,242,.14));border-color:rgba(167,139,250,.5);color:var(--violet-soft);box-shadow:0 0 18px rgba(139,92,246,.16)}
.product-card:nth-child(4n) .product-glyph{background:linear-gradient(140deg,rgba(85,214,242,.16),rgba(255,224,43,.1));border-color:rgba(85,214,242,.45);color:var(--cyan-soft);box-shadow:0 0 18px rgba(85,214,242,.14)}
.product-card h3{color:#fbfaff}
.product-card h3 a:hover{color:var(--starlight)}
.card-arrow{color:var(--cyan)}
.product-card p{color:var(--muted)}
.card-bottom{border-top:1px solid var(--line-soft)}
.card-price{color:#fdfaff}
.card-price small{color:var(--faint)}
.card-detail-link{color:var(--cyan)}
.card-detail-link span{color:var(--pink-soft)}
.catalog-note{color:var(--faint)}
.catalog-note span{color:var(--starlight)}

/* colorful category tags */
.product-card[data-category="Agent memory"] .category-tag{color:#c4b5fd}
.product-card[data-category="Repository care"] .category-tag{color:#7dd3fc}
.product-card[data-category="Testing"] .category-tag{color:#f9a8d4}
.product-card[data-category="Code review"] .category-tag{color:#fcd34d}
.product-card[data-category="Dependencies"] .category-tag{color:#6ee7b7}
.product-card[data-category="Agent tooling"] .category-tag{color:#a5b4fc}
.product-card[data-category="Security review"] .category-tag{color:#fda4af}
.product-card[data-category="Operations"] .category-tag{color:#5eead4}

.empty-state{color:var(--faint)}
.empty-state h3{color:var(--ink)}
.empty-state span{color:var(--pink-soft)}

/* ---------- storefront band ---------- */
.storefront-section{
  border-block:1px solid var(--line-soft);
  background:
    radial-gradient(ellipse at 92% 10%,rgba(85,214,242,.16),transparent 26rem),
    radial-gradient(ellipse at 6% 96%,rgba(255,93,177,.12),transparent 26rem),
    linear-gradient(120deg,#171238 0%,#101731 55%,#0a0b1e 100%);
}
.storefront-section::after{
  content:"";position:absolute;width:480px;height:480px;right:-240px;top:14%;
  border:1.5px dashed rgba(85,214,242,.25);border-radius:50%;
  box-shadow:0 0 0 44px rgba(139,92,246,.05),0 0 0 100px rgba(255,93,177,.04);
  animation:spin-slow 60s linear infinite;pointer-events:none;
}
.storefront-copy>p{color:var(--muted)}
.storefront-empty{border-top:1px solid var(--line-soft);color:var(--faint)}
.storefront-empty i{background:var(--cyan);box-shadow:0 0 10px var(--cyan)}

/* ---------- approach ---------- */
.approach-section{
  background:
    radial-gradient(circle at 90% 10%,rgba(255,224,43,.07),transparent 22rem),
    radial-gradient(circle at 4% 90%,rgba(139,92,246,.12),transparent 24rem),
    #0b0c1f;
  border-bottom:1px solid var(--line-soft);
}
.approach-copy>p:not(.eyebrow){color:var(--muted)}
.principles article{border-top:1px solid var(--line)}
.principles article>span{background:var(--grad-candy);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700}
.principles h3{color:#f4f2ff}
.principles p{color:var(--muted)}

/* ---------- closing ---------- */
.closing-section{
  background:
    radial-gradient(ellipse 55% 65% at 50% 115%,rgba(255,93,177,.2),transparent 65%),
    radial-gradient(ellipse 40% 50% at 18% 0%,rgba(85,214,242,.1),transparent 60%);
}
.closing-caption{color:var(--faint)}

/* ---------- footer ---------- */
.site-footer{background:#040510;border-top:1px solid var(--line-soft)}
.site-footer::before{content:"";display:block;height:2px;background:var(--grad-candy);opacity:.8}
.footer-line{color:var(--faint)}
.back-top{border:1px solid rgba(255,224,43,.4);color:var(--starlight);background:rgba(255,224,43,.06)}
.back-top:hover{box-shadow:0 0 18px rgba(255,224,43,.3)}
.footer-bottom{color:var(--faint)}
.footer-policy-links{color:var(--muted)}
.footer-policy-links a:hover{color:var(--starlight)}

/* ---------- product detail pages ---------- */
.product-breadcrumb{color:var(--faint)}
.product-breadcrumb a{color:var(--cyan)}
.product-hero{border-bottom:1px solid var(--line-soft)}
.product-summary{color:var(--muted)}
.product-trust{color:var(--faint)}
.purchase-panel,.sidebar-box{
  border:1px solid var(--line);border-radius:20px;
  background:linear-gradient(165deg,rgba(32,28,72,.85),rgba(13,12,34,.95));
  box-shadow:0 20px 50px rgba(2,2,18,.45);
}
.purchase-panel .eyebrow,.sidebar-box .eyebrow{color:var(--cyan)}
.reference-price{color:#fff}
.reference-price small{color:var(--faint)}
.price-note{color:var(--muted)}
.checkout-note{color:var(--faint)}
.purchase-divider{border-top:1px solid var(--line-soft)}
.delivery-note{color:var(--muted)}
.delivery-note strong{color:var(--ink)}
.delivery-note span{color:var(--starlight)}
.detail-intro{color:var(--muted)}
.feature-list li{border-bottom:1px solid var(--line-soft);color:#dddaf5}
.feature-list li span{color:var(--starlight)}
.demo-panel{background:linear-gradient(165deg,rgba(46,26,84,.55),rgba(14,12,36,.9));border:1px solid rgba(167,139,250,.25)}
.demo-heading .eyebrow{color:var(--cyan)}
.demo-heading h2{color:#fbfaff}
.demo-icon{border:1px solid rgba(255,224,43,.45);color:var(--starlight)}
.demo-step{border:1px solid var(--line);background:rgba(9,9,26,.7);border-radius:14px}
.demo-step>span{color:var(--cyan)}
.demo-step p{color:var(--muted)}
.demo-step-result{border-color:rgba(255,224,43,.4);background:rgba(255,224,43,.06)}
.demo-arrow{color:var(--pink)}
.demo-disclaimer{color:var(--faint)}
.channel-head{color:var(--faint);border-bottom:1px solid var(--line-soft)}
.channel-row{border-bottom:1px solid var(--line-soft);color:#d8d6f0}
.channel-row span:nth-child(2){color:var(--starlight)}
.channel-row span:nth-child(3){color:var(--faint)}
.channel-footnote{color:var(--faint)}
.limits-box{background:linear-gradient(165deg,rgba(60,20,60,.4),rgba(16,10,32,.9))}
.product-next{
  border:1px solid rgba(139,92,246,.35);
  background:
    radial-gradient(ellipse at 50% 130%,rgba(255,93,177,.22),transparent 62%),
    radial-gradient(ellipse at 85% -20%,rgba(85,214,242,.16),transparent 55%),
    linear-gradient(165deg,#1c1440,#0d0c26);
  box-shadow:0 24px 60px rgba(2,2,18,.4);
}
.product-next .eyebrow{color:var(--starlight)}
.not-found h1{color:#fbfaff}

/* ---------- store page ---------- */
.store-page-hero{
  border-bottom:1px solid var(--line-soft);
  background:
    radial-gradient(circle at 78% 22%,rgba(139,92,246,.2),transparent 26rem),
    radial-gradient(circle at 12% 85%,rgba(255,93,177,.12),transparent 24rem);
}
.store-page-hero::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background-image:radial-gradient(1.2px 1.2px at 20% 30%,#ffffff 62%,transparent 72%),radial-gradient(1.5px 1.5px at 68% 14%,#ffe9a8 62%,transparent 72%),radial-gradient(1.1px 1.1px at 42% 74%,#bfeaff 62%,transparent 72%),radial-gradient(1.3px 1.3px at 86% 58%,#ffd7ee 62%,transparent 72%),radial-gradient(1.0px 1.0px at 8% 82%,#ffffff 62%,transparent 72%),radial-gradient(1.4px 1.4px at 55% 44%,#ffffff 62%,transparent 72%);
  background-size:520px 520px;animation:twinkle 5.5s ease-in-out infinite;
}
.store-page-copy h1{color:#fbfaff;text-shadow:0 6px 40px rgba(0,0,0,.5)}
.store-page-copy>p:not(.eyebrow){color:var(--muted)}
.store-page-note{color:var(--muted)}
.store-page-note i{background:var(--starlight);box-shadow:0 0 10px var(--starlight);animation:pulse-dot 2.4s ease-in-out infinite}
.store-page-note b{color:var(--pink)}
.store-page-art{
  border-radius:26px;
  opacity:.9;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 18%,#000 58%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 18%,#000 58%);
}
.store-page-heading h2{color:#fbfaff}
.store-page-heading>p{color:var(--muted)}
.store-page-support{color:var(--faint)}
.store-page-support a{color:var(--cyan)}
.store-page-empty{border:1px solid var(--line);background:rgba(18,18,44,.8);color:var(--muted)}
.store-page-empty a{color:var(--cyan)}

/* ---------- policy pages ---------- */
.policy-article h1{color:#fbfaff}
.policy-updated{color:var(--faint)}
.policy-content{border-top:1px solid var(--line-soft)}
.policy-content h2{color:#efeaff}
.policy-content p,.policy-content li{color:var(--muted)}
.policy-content a{color:var(--cyan)}
.policy-content strong{color:var(--ink)}

/* ---------- keyframes ---------- */
@keyframes pan-gradient{0%{background-position:0% 50%}100%{background-position:220% 50%}}
@keyframes twinkle{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes spin-slow{to{transform:rotate(360deg)}}
@keyframes pulse-dot{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
@keyframes hero-float{0%,100%{transform:rotate(2.2deg) translateY(0)}50%{transform:rotate(1.2deg) translateY(-12px)}}
@keyframes orb-float{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-16px) scale(1.04)}}
@keyframes glow-breathe{0%,100%{opacity:.32}50%{opacity:.55}}
@keyframes comet-drift{0%,100%{transform:rotate(-24deg) translateX(0);opacity:.2}45%{opacity:1}50%{transform:rotate(-24deg) translateX(-46px);opacity:1}55%{opacity:.3}}

/* ---------- mobile polish ---------- */
@media (max-width:680px){
  /* dropdown menu: solid, readable, above content */
  .main-nav{
    z-index:60;
    background:linear-gradient(170deg,#1b1c42 0%,#0d0e26 60%);
    border:1px solid var(--line);
    box-shadow:0 28px 70px rgba(0,0,0,.65);
  }
  .main-nav>a{color:var(--ink);font-weight:600}
  .main-nav>a:not(.nav-cta){border-bottom:1px solid var(--line-soft)}
  .main-nav>a:hover{color:var(--starlight)}
  .main-nav .nav-cta{border-bottom:0}
  /* hero image label: compact corner pill, no stretching */
  .hero-image-label{
    top:auto;bottom:10px;right:10px;left:auto;
    padding:7px 11px;font-size:6.5px;letter-spacing:.12em;
    max-width:calc(100% - 20px);
  }
}
@media (max-width:360px){
  .hero-image-label{display:none}
}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .hero-universe{transform:rotate(2.2deg)}
  .orb{translate:none}
}