                                                                       
                                                                                        
                                                                                 
                                                                                            
                                                                                           
                                                                                                 

:root{
  --w-canvas-0:#0B0617; --w-canvas-1:#110A28; --w-canvas-2:#17122e; --w-canvas-3:#1f1936;
  --w-tint:#12142a;
  --ink:#F6F1E6; --ink-80:rgba(246,241,230,.80); --ink-62:rgba(246,241,230,.62);
  --lav:#C9B6EC; --lav-bright:#E9DCFF;
  --bloom:126,84,172;
  --hair:rgba(233,220,255,.13); --hair-strong:rgba(233,220,255,.22);
  --r-panel:20px; --r-ctrl:8px;
}

                                                                              
body.mg-world{
  color:var(--ink);
  background:linear-gradient(195deg,var(--w-canvas-0) 0%,#070417 80%,var(--w-tint) 100%);
}
.world-depth{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(88% 117% at 0% 1.4%,var(--w-canvas-1) 0%,#100a24 26%,var(--w-canvas-0) 40%,#06040f 63%);
  opacity:.9}
.world-bloom{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(50% 75% at 50% 84%,rgba(var(--bloom),.5) 0%,rgba(var(--bloom),.3) 33%,rgba(var(--bloom),0) 100%);
  animation:mgw-bloom 14s ease-in-out infinite alternate;transform-origin:50% 90%}
@keyframes mgw-bloom{from{opacity:.78;transform:scale(1)}to{opacity:1;transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.world-bloom{animation:none}}
.world-grain{position:fixed;inset:-50%;z-index:0;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E")}
.world-vignette{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(130% 100% at 50% 40%,transparent 58%,rgba(8,4,18,.5) 100%)}
body.mg-world main{position:relative;z-index:1}

                                                                                  
                                                                                              
.mg-ridge{display:block;width:100%;height:56px;opacity:.6}
.mg-ridge .far{fill:none;stroke:rgba(201,182,236,.18);stroke-width:1;vector-effect:non-scaling-stroke}
.mg-ridge .near{fill:none;stroke:rgba(201,182,236,.42);stroke-width:1;vector-effect:non-scaling-stroke}

                                                                                 
.mg-window{position:relative}
.mg-window::before{content:"";position:absolute;inset:-90px -60px;pointer-events:none;z-index:0;
  background:radial-gradient(55% 62% at 50% 58%,rgba(var(--bloom),.42) 0%,rgba(var(--bloom),.18) 45%,transparent 75%)}
.mg-panel{position:relative;z-index:1;border:1px solid var(--hair-strong);border-radius:var(--r-panel);
  background:linear-gradient(140deg,#17132a -42%,#0a0714 77%);
  box-shadow:inset 0 1px 0 rgba(246,241,230,.07),0 24px 70px rgba(5,2,12,.55)}

                            
.mg-eyebrow{font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--lav);display:flex;align-items:center;gap:12px}
.mg-eyebrow::after{content:"";width:44px;height:1px;background:rgba(201,182,236,.4)}
.mg-display{font-family:'Fraunces',Georgia,serif;font-weight:340;line-height:1.04;letter-spacing:-.02em}
.mg-display em{font-style:italic;color:var(--lav-bright)}
.mg-cta{display:inline-flex;align-items:center;gap:9px;
  font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:14.5px;font-weight:600;color:#14091f;
  text-decoration:none;background:linear-gradient(135deg,#E9DCFF,#C9B6EC);border-radius:999px;padding:12px 22px;
  box-shadow:0 0 0 1px rgba(233,220,255,.25),0 6px 26px rgba(160,126,204,.35);
  transition:box-shadow 180ms cubic-bezier(.4,0,.2,1)}
.mg-cta:hover,.mg-cta:focus-visible{box-shadow:0 0 0 1px rgba(233,220,255,.45),0 6px 32px rgba(160,126,204,.5)}
