/* "Everything around one assistant" (parts/home/orbit.php). Desktop: a tall
   section with a pinned stage; --p (0..1, set by orbit.js) raises Chip and
   flies each card out from behind it to --x/--y (percent of the stage).
   Phones and reduced motion: the final layout, not pinned. */
.ob{position:relative;height:230vh;margin-top:clamp(40px,6vw,80px)}
.ob-pin{position:sticky;top:0;height:100vh;min-height:680px;overflow:hidden;display:grid;grid-template-rows:auto 1fr}
.ob-head{text-align:center;display:grid;justify-items:center;gap:12px;padding-top:clamp(92px,13vh,124px);position:relative;z-index:3}
.ob-head h2{max-width:20ch;margin:0}
.ob-head .lede{max-width:56ch;margin:0}
.ob-stage{position:relative;width:min(1180px,100%);margin:0 auto}
/* Chip stands on a soft floor inside the stage (bottom:5%), whole body visible: the image's feet
   touch its bottom edge, so any negative bottom crops the legs against .ob-pin's overflow. */
.ob-chip{position:absolute;left:50%;bottom:5%;height:86%;width:auto;max-width:none;z-index:2;
  transform:translate(-50%,calc((1 - var(--pc,1)) * 38%)) scale(calc(.82 + var(--pc,1) * .18));transform-origin:50% 100%;
  filter:drop-shadow(0 40px 60px rgba(36,71,245,.22))}
.ob-glow{position:absolute;left:50%;bottom:0;width:62%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,42%);z-index:0;
  background:radial-gradient(closest-side,rgba(36,71,245,.14),rgba(36,71,245,.05) 60%,transparent);opacity:var(--pc,1)}
.ob-stage::before{content:"";position:absolute;left:50%;bottom:calc(5% - 12px);width:clamp(180px,24%,300px);height:28px;border-radius:50%;z-index:1;
  transform:translateX(-50%) scale(calc(.6 + var(--pc,1) * .4));opacity:var(--pc,1);pointer-events:none;
  background:radial-gradient(closest-side,rgba(12,22,56,.22),rgba(36,71,245,.08) 55%,transparent)}
.ob-card{--t:0;position:absolute;left:calc(var(--x) * 1%);top:min(calc(var(--y) * 1%),calc(100% - 64px));z-index:3;width:clamp(170px,17vw,230px);
  background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 12px 12px;box-shadow:0 30px 60px -36px rgba(12,22,56,.35);
  font-size:12px;color:var(--ink);will-change:transform,opacity,filter;
  transform:translate(calc(-50% + (50 - var(--x)) * (1 - var(--t)) * 1vw * .9),calc(-50% + (62 - var(--y)) * (1 - var(--t)) * 1vh * .8)) scale(calc(.55 + var(--t) * .45));
  opacity:var(--t);filter:blur(calc((1 - var(--t)) * 8px))}
.ob-t{display:block;font-weight:700;color:var(--muted);font-size:11px;margin-bottom:8px}
.ob-in{display:grid;gap:6px}
.ob-in i{display:block;height:6px;border-radius:3px;background:#E8EBF2}
.ob-pill{display:inline-block;border-radius:99px;padding:2px 8px;font-weight:700;font-size:10.5px;background:var(--royal-soft);color:var(--royal)}
.ob-pill.ok{background:color-mix(in srgb,#00B67A 14%,#fff);color:#008A5C}
.ob-logos{display:flex;align-items:center;gap:6px}
.ob-logos .sb-brand{width:26px;height:26px;padding:5px;border-radius:50%;background:#F4F6FA;color:var(--ink);box-sizing:border-box}
.ob-logos em{font-style:normal;font-weight:700;color:var(--muted);font-size:11px}
.ob-docline{display:flex;justify-content:space-between;gap:6px;align-items:center}
.ob-docline b{font-size:11.5px}
.ob-money{display:grid}
.ob-money b{font-family:var(--fd);font-size:22px;letter-spacing:-.02em}
.ob-money small{color:var(--muted)}
.ob-bars{display:flex;align-items:flex-end;gap:4px;height:44px}
.ob-bars i{flex:1;height:auto;border-radius:3px 3px 1px 1px;background:linear-gradient(var(--c-mon),color-mix(in srgb,var(--c-mon) 50%,#fff))}
.ob-slots{display:flex;gap:4px}
.ob-slots span{flex:1;text-align:center;border-radius:6px;padding:3px 0;background:#F4F6FA;font-size:10.5px;color:var(--muted)}
.ob-slots .on{background:var(--c-sit);color:#fff;font-weight:700}
.ob-slot{display:grid;grid-template-columns:auto 1fr;column-gap:6px;align-items:center;border-left:3px solid var(--c-sit);background:color-mix(in srgb,var(--c-sit) 9%,#fff);border-radius:6px;padding:6px 8px}
.ob-slot .sb-icon{grid-row:span 2;color:var(--c-sit);--ic-accent:var(--c-sit)}
.ob-slot small{color:var(--muted)}
.ob-table{width:100%;border-collapse:collapse;font-size:11px}
.ob-table td{border-bottom:1px solid var(--line);padding:3px 2px;white-space:nowrap}
.ob-table td:first-child{max-width:92px;overflow:hidden;text-overflow:ellipsis}
.ob-table .pd-lead{width:18px;height:18px}
.ob-table span{display:block;text-align:center;border-radius:4px;background:var(--t);color:#fff;font-weight:700;font-size:10px;padding:2px 4px}
.ob-msg{margin:0;padding:6px 9px;border-radius:10px;font-size:11.5px;line-height:1.35;display:flex;gap:6px;align-items:flex-start}
.ob-msg.in{background:#F4F6FA}
.ob-msg.chip{background:var(--royal-soft);margin-left:14px}
.ob-msg .sb-brand{flex:none;color:#25A366}
.ob-msg .chipi{flex:none;width:14px;height:14px}
.ob-upd-h{display:flex;align-items:center;gap:6px}
.ob-upd-h .pd-lead{width:20px;height:20px}
.ob-upd-h small{margin-left:auto;color:var(--muted)}
.ob-upd p{margin:0;font-size:11.5px;line-height:1.4;color:var(--ink-2)}
.ob-acts{display:flex;gap:6px;border-top:1px solid var(--line);padding-top:6px;font-size:11px;color:var(--muted)}
.ob-acts span{flex:1;text-align:center}
.ob-inv{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px}
.ob-inv>div{display:grid}
.ob-inv small{color:var(--muted)}
.ob-inv b{white-space:nowrap}
.ob-amt{font-family:var(--fd);font-size:18px}
.ob-inv .ob-pill{grid-column:1/-1;justify-self:start}

@media (max-width:1100px){.ob-card{width:clamp(150px,20vw,190px)}.ob-amt{font-size:16px}}
@media (max-width:820px),(prefers-reduced-motion:reduce){
  .ob{height:auto}
  .ob-pin{position:static;height:auto;min-height:0;overflow:visible}
  .ob-card{--t:1}
  .ob-chip{--pc:1}
}
@media (max-width:820px){
  .ob-head{padding-top:0}
  .ob-stage{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 16px 20px}
  .ob-stage::before{display:none}
  .ob-chip{position:relative;left:auto;bottom:auto;grid-column:1/-1;justify-self:center;height:auto;width:min(52vw,240px);transform:none;margin:4px 0 10px;
    filter:drop-shadow(0 18px 14px rgba(12,22,56,.16)) drop-shadow(0 30px 40px rgba(36,71,245,.16))}
  .ob-glow{display:none}
  .ob-card{position:relative;left:auto;top:auto;width:auto;transform:none;opacity:1;filter:none}
  .ob-card:nth-child(n+9){display:none}
}
