/* MAVELLA ORB (Home + Today), TOGETHER ORB (Ask) and the 44 px BIRTH-STAR component. Standalone: one CSS + mavella_hooks.js. No image download for the orb. */
html body .mvh-star{position:relative;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;margin:0;border-radius:50%;flex:0 0 auto;
  border:2px solid var(--mv-gold,#D6B45A);background:var(--mv-card,#0B2A1C);overflow:hidden;cursor:pointer;display:block;box-sizing:border-box;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
html body .mvh-star img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
html body .mvh-star.mvh-door img{object-fit:contain;padding:7px;box-sizing:border-box;background:var(--mv-card,#0B2A1C)}
html body .mvh-star:focus-visible{outline:2px solid var(--mv-text,#F5EFE0);outline-offset:2px}

html body .mvh-orb-wrap{position:fixed;z-index:25;right:max(16px,calc((100vw - var(--mv-frame,430px)) / 2 + 16px));
  bottom:calc(var(--l365-nav-h,var(--mv-nav-h,64px)) + var(--l365-install-h,0px) + 16px + var(--mvh-lift,0px));display:flex;align-items:center;gap:10px;pointer-events:none}
html body .mvh-orb-wrap[hidden]{display:none}
html body .mvh-orb{pointer-events:auto;position:relative;order:2;width:60px;height:60px;min-width:60px;padding:0;border:0;border-radius:50%;cursor:pointer;flex:0 0 auto;
  background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.85) 0 7%,rgba(255,255,255,0) 22%),
    radial-gradient(circle at 50% 55%,#E8C766 0%,#C9A24A 34%,#2E8B64 72%,#0F5A3E 100%);
  box-shadow:inset 0 -6px 12px rgba(7,26,17,.45),inset 0 4px 8px rgba(255,255,255,.35),0 0 18px 4px rgba(214,180,90,.45);
  animation:mvh-breathe 4s ease-in-out infinite}
html body .mvh-orb:focus-visible{outline:2px solid var(--mv-text,#F5EFE0);outline-offset:3px}
html body .mvh-orb i{position:absolute;display:block;width:6px;height:6px;border-radius:50%;background:#fff;opacity:0;
  clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);animation:mvh-twinkle 8s ease-in-out infinite}
html body .mvh-orb i:nth-child(1){left:14px;top:12px;width:9px;height:9px;animation-delay:0s}
html body .mvh-orb i:nth-child(2){right:12px;top:22px;animation-delay:2.6s}
html body .mvh-orb i:nth-child(3){left:24px;bottom:11px;width:7px;height:7px;animation-delay:5.2s}
html body .mvh-chip{order:1;pointer-events:auto;max-width:200px;padding:7px 12px;border-radius:16px 16px 4px 16px;white-space:nowrap;background:var(--mv-card,#0B2A1C);color:var(--mv-text,#F5EFE0);
  border:1px solid var(--mv-gold,#D6B45A);font:600 14px/1.25 var(--mv-sans,system-ui,sans-serif);box-shadow:0 4px 14px rgba(0,0,0,.35);cursor:pointer;
  opacity:0;transform:translateX(12px) scale(.96);transition:opacity .35s ease,transform .35s ease}
html body .mvh-chip.mvh-on{opacity:1;transform:none}
html body .mvh-chip[hidden]{display:none}
/* the music play button and the last card must never sit under the orb: room at the bottom of every Home / Today page */
html.mvh-orb-on body #root{padding-bottom:112px}
html.mvh-orb-on body #h1root{padding-bottom:calc(var(--l365-nav-h,64px) + var(--l365-install-h,0px) + 104px)}
html.mvh-orb-on body #h1root.t2on #t2{padding-bottom:calc(var(--cc-bar-h,0px) + var(--l365-nav-h,64px) + var(--l365-install-h,0px) + 104px)}
/* 5m M7-26: the pill ('Let's solve it together') sits 16px above the nav and is ~32px tall beside a 60px orb: the last Today card (US bottom) and the help line clear the whole pill, never under it */
html.mvh-orb-on body #h1root.h1-tab-today #t2{padding-bottom:calc(var(--cc-bar-h,0px) + var(--l365-nav-h,64px) + var(--l365-install-h,0px) + 132px)}html.mvh-orb-on body #h1root .h1-help-line{margin-bottom:calc(var(--l365-nav-h,64px) + 104px)}   /* 5f F3: the last Home card (More about you) clears the orb + pill + ask bar */
/* TOGETHER ORB: Ask tab, bottom-left, smaller, rose/pink glass */
html body .mvh-tog-wrap{z-index:60;left:auto;right:max(16px,calc((100vw - var(--mv-frame,430px)) / 2 + 16px));bottom:calc(var(--l365-nav-h,var(--mv-nav-h,64px)) + 16px + var(--mvh-lift,0px))}
html body .mvh-tog-wrap .mvh-chip{order:1;max-width:none;border-radius:16px 16px 4px 16px;border-color:#E58AA8;transform:translateX(12px) scale(.96)}
html body .mvh-tog-wrap .mvh-chip.mvh-on{transform:none}
/* two planets merged (founder 26 Oct): a gold glass sphere and a smaller rose one overlapping like a binary star; the small one orbits the large one in a 6 s loop */
html body .mvh-orb.mvh-tog{order:1;width:56px;height:56px;min-width:56px;border-radius:50%;background:none;box-shadow:none;animation:none;overflow:visible}
html body .mvh-tog .mvh-tg-big,html body .mvh-tog .mvh-tg-small{position:absolute;display:block;border-radius:50%}
html body .mvh-tog .mvh-tg-big{left:9px;top:11px;width:34px;height:34px;
  background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.85) 0 7%,rgba(255,255,255,0) 24%),radial-gradient(circle at 50% 55%,#E8C766 0%,#C9A24A 36%,#2E8B64 74%,#0F5A3E 100%);
  box-shadow:inset 0 -5px 9px rgba(7,26,17,.45),inset 0 3px 6px rgba(255,255,255,.35),0 0 14px 3px rgba(214,180,90,.45)}
html body .mvh-tog .mvh-tg-orbit{position:absolute;left:0;top:0;width:56px;height:56px;transform-origin:26px 28px;animation:mvh-tg-orbit 6s linear infinite}
html body .mvh-tog .mvh-tg-small{left:36px;top:17px;width:22px;height:22px;
  background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.85) 0 8%,rgba(255,255,255,0) 26%),radial-gradient(circle at 50% 55%,#F7B6CB 0%,#E27A9F 40%,#B04372 78%,#6E1F45 100%);
  box-shadow:inset 0 -4px 7px rgba(60,10,35,.45),inset 0 2px 5px rgba(255,255,255,.4),0 0 12px 3px rgba(229,138,168,.55);animation:mvh-tg-orbit 6s linear infinite reverse}   /* counter-turns so its highlight stays up */
@keyframes mvh-tg-orbit{to{transform:rotate(360deg)}}
/* the composer and last answer must clear the rose orb */
html.mvh-tog-on body #root{padding-bottom:112px}
@keyframes mvh-breathe{0%,100%{box-shadow:inset 0 -6px 12px rgba(7,26,17,.45),inset 0 4px 8px rgba(255,255,255,.35),0 0 14px 2px rgba(214,180,90,.35);}
  50%{box-shadow:inset 0 -6px 12px rgba(7,26,17,.45),inset 0 4px 8px rgba(255,255,255,.35),0 0 26px 8px rgba(214,180,90,.6)}}
@keyframes mvh-twinkle{0%,70%,100%{opacity:0;transform:scale(.4)}78%{opacity:1;transform:scale(1)}88%{opacity:0;transform:scale(.5)}}
@media (prefers-reduced-motion:reduce){
  html body .mvh-orb{animation:none;box-shadow:inset 0 -6px 12px rgba(7,26,17,.45),inset 0 4px 8px rgba(255,255,255,.35),0 0 20px 5px rgba(214,180,90,.5)}
  html body .mvh-orb i{animation:none;opacity:.8;transform:none}
  html body .mvh-chip{transition:none}
  html body .mvh-tog .mvh-tg-orbit,html body .mvh-tog .mvh-tg-small{animation:none}
}
/* 5i M7-2: orb steps aside while scrolling */
html body .mvh-orb-wrap{transition:opacity .2s ease}
html body .mvh-orb-wrap.mvh-scrolling{opacity:.18}
html body .mvh-orb-wrap{transition:opacity .25s,transform .25s}html body .mvh-orb-wrap{transform:translateY(var(--mvh-dy,0px));max-width:calc(100vw - 32px)}html body .mvh-orb-wrap.mvh-dodge .mvh-pill,html body .mvh-orb-wrap.mvh-dodge .mvh-chip{opacity:0}
@media (prefers-reduced-motion:reduce){html body .mvh-orb-wrap{transition:none}}
/* FABLE 1 Nov (M5): on Today the gold orb is smaller, sits clear above the nav and never carries the speech pill over the cards */
html body:has(#h1root.h1-tab-today) .mvh-orb-wrap{bottom:calc(var(--l365-nav-h,var(--mv-nav-h,64px)) + var(--l365-install-h,0px) + 22px + var(--mvh-lift,0px));z-index:11}
html body:has(#h1root.h1-tab-today) .mvh-orb{width:48px;height:48px;min-width:48px;opacity:.92}
html body:has(#h1root.h1-tab-today) .mvh-chip{display:none}
html.mvh-orb-on body #h1root.h1-tab-today #t2{padding-bottom:calc(var(--cc-bar-h,0px) + var(--l365-nav-h,64px) + var(--l365-install-h,0px) + 150px)}
