/* Money Blueprint — design system v1 · UTILITIES + ambient backdrop.
   The ambient is scoped to .mb-ds::before so it only paints on design-system
   surfaces (the /style route, migrated screens, the landing body). Mirror to landing. */

/* ambient: accent mesh glow over a faint blueprint grid, masked to fade.
   position:fixed covers the viewport whenever a .mb-ds root is present. */
.mb-ds::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:
    radial-gradient(820px 520px at 82% -8%, rgba(var(--amb),0.20), transparent 60%),
    radial-gradient(680px 520px at -5% 6%, rgba(var(--amb),0.12), transparent 55%),
    radial-gradient(760px 600px at 50% 116%, rgba(var(--amb),0.08), transparent 55%),
    linear-gradient(rgba(255,255,255,0.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px);
  background-size:100% 100%,100% 100%,100% 100%,52px 52px,52px 52px;
  -webkit-mask-image:radial-gradient(150% 100% at 50% 0%,#000 55%,transparent 100%);
          mask-image:radial-gradient(150% 100% at 50% 0%,#000 55%,transparent 100%);
}

/* gradient headline with a slow light-sweep */
.text-grad{background:linear-gradient(115deg,var(--accent-deep) 0%,var(--accent-hi) 30%,#fff 46%,var(--accent-hi) 60%,var(--accent) 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:drop-shadow(0 6px 30px rgba(var(--amb),0.45));animation:mb-shine 7s linear infinite;}
.mb-stat-accent{text-shadow:0 0 34px rgba(var(--amb),0.42);}
.mb-glass{background:rgba(255,255,255,0.045);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);}

/* layout helpers */
.mb-wrap{max-width:1140px;margin:0 auto;padding:0 var(--s3);}
.mb-grid{display:grid;gap:var(--s2);}
.mb-row{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center;}
.mb-rule{height:1px;background:linear-gradient(90deg,transparent,var(--hairline),transparent);border:none;}

@keyframes mb-shine{to{background-position:240% 0;}}
@keyframes mb-sweep{0%,55%{left:-65%;}100%{left:135%;}}

@media (prefers-reduced-motion: reduce){
  .text-grad,.mb-btn-primary::after{animation:none;}
}
