/* motion-theme.css — drop-in cyber background theme for standalone pages.
   Pair with <script src="motion.js" defer></script>. Include AFTER a page's
   own <style> so these palette + background rules win. */
:root{
  --bg:#02040a; --bg2:#0a1018; --text:#eaf0ff; --muted:#9aa6c4; --faint:#5f6c8c;
  --line:rgba(255,255,255,.10); --accent:#5ee6ff;
  --cyan:#5ee6ff; --violet:#8b7bff; --magenta:#ff5cc8;
  --grad:linear-gradient(100deg,#5ee6ff,#8b7bff 52%,#ff5cc8);
  --glow-cyan:rgba(94,230,255,.35); --glow-mag:rgba(255,92,200,.3);
}
body{
  background:
    radial-gradient(120% 80% at 12% -8%,rgba(94,230,255,.12),transparent 55%),
    radial-gradient(120% 90% at 100% 8%,rgba(255,92,200,.10),transparent 52%),
    radial-gradient(140% 120% at 60% 108%,rgba(139,123,255,.12),transparent 60%),
    var(--bg) !important;
  background-attachment:fixed !important;
}
#fx-canvas{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.9}
body::before{content:"";position:fixed;inset:-20vmax;z-index:-1;pointer-events:none;
  background:radial-gradient(38vmax 30vmax at 20% 20%,rgba(94,230,255,.10),transparent 62%),
    radial-gradient(42vmax 34vmax at 82% 30%,rgba(255,92,200,.085),transparent 60%),
    radial-gradient(46vmax 38vmax at 55% 96%,rgba(139,123,255,.085),transparent 62%);
  filter:blur(30px);animation:mcoAurora 34s ease-in-out infinite alternate}
@keyframes mcoAurora{from{transform:translate3d(-3%,-2%,0) scale(1)}to{transform:translate3d(3%,3%,0) scale(1.08)}}
body::after{content:"";position:fixed;inset:0;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(120,220,255,.025) 0 1px,transparent 1px 3px);
  mix-blend-mode:overlay;opacity:.45}
/* floating back button for pop-up / form pages */
.mco-back{position:fixed;top:16px;left:16px;z-index:45;display:inline-flex;align-items:center;gap:7px;
  background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--text);text-decoration:none;
  font:inherit;font-size:.9rem;font-weight:500;padding:9px 15px;border-radius:980px;cursor:pointer;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:border-color .25s,box-shadow .25s,transform .15s}
.mco-back::before{content:"\2190";font-size:1.05em;line-height:1}
.mco-back:hover{border-color:rgba(94,230,255,.6);box-shadow:0 0 0 1px rgba(94,230,255,.4);transform:translateX(-2px)}
/* "Submit an Offer" button on listings */
.offer-btn{display:inline-block;margin-top:12px;background:var(--grad);color:#05070c;font-weight:600;font-size:.82rem;
  padding:8px 16px;border-radius:980px;text-decoration:none;box-shadow:0 6px 20px -8px var(--glow-cyan);
  transition:box-shadow .3s,transform .15s}
.offer-btn:hover{box-shadow:0 10px 30px -8px var(--glow-cyan);transform:translateY(-1px)}
.offer-btn.ghost{background:rgba(255,255,255,.06);color:var(--text);box-shadow:none}
.offer-btn.ghost:hover{box-shadow:0 0 0 1px rgba(94,230,255,.5);transform:translateY(-1px)}
.listing-cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.listing-cta .offer-btn{margin-top:0}
@media (prefers-reduced-motion:reduce){#fx-canvas,body::before{display:none;animation:none}}