/* fund-pick.js: which balance pays for your calls */

/* a balance's picture in a hexagon, with the site's ring: their photo, or a business's mark */
.fp-hex{--s:34px;--hex:polygon(50% 0,93.3% 25%,93.3% 75%,50% 100%,6.7% 75%,6.7% 25%);position:relative;flex:0 0 auto;width:var(--s);height:var(--s);clip-path:var(--hex);
  background:conic-gradient(from 200deg,transparent 0 30%,rgba(96,165,250,.6) 45%,#fff 52%,#3B82F6 58%,transparent 75%),rgba(147,197,253,.26)}
.fp-hex.biz{background:conic-gradient(from 200deg,transparent 0 30%,rgba(167,139,250,.65) 45%,#fff 52%,#8B5CF6 58%,transparent 75%),rgba(167,139,250,.28)}
.fp-hex-in{position:absolute;inset:1.5px;clip-path:var(--hex);overflow:hidden;display:grid;place-items:center;background:#0C1226}
.fp-hex-in img{width:100%;height:100%;object-fit:cover;display:block}
.fp-hex-in .bzm{width:100%;height:100%;border-radius:0;box-shadow:none}
.sheet-mark.pfp > .fp-hexbiz{overflow:hidden;display:block}
.fp-hexbiz .bzm{width:100%;height:100%;border-radius:0;box-shadow:none}
.fp-letter{font:700 14px/1 Geist,sans-serif;color:#C7D2FE}

/* the toolbar: like the Numbers page's switcher, whose balance and what's in it */
.fp-sw{display:flex;align-items:center;gap:10px;min-width:0;max-width:280px;padding:4px 8px 4px 4px;border-radius:13px;border:1px solid transparent;background:none;color:inherit;
  text-align:left;cursor:pointer;font-family:Geist,system-ui,sans-serif;transition:background .15s,border-color .15s}
.fp-sw:hover,.fp-sw[aria-expanded="true"]{background:rgba(148,170,230,.06);border-color:rgba(147,197,253,.14)}
.fp-sw:focus-visible{outline:2px solid #60A5FA;outline-offset:1px}
.fp-sw-t{flex:1;min-width:0}
.fp-sw-t b{display:block;font-size:14px;font-weight:650;letter-spacing:-.01em;color:#F4F6FF;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-sw-t small{display:flex;align-items:center;gap:6px;margin-top:2px;font-size:12px;font-weight:600;color:#5EEAD4;font-variant-numeric:tabular-nums;white-space:nowrap}
.fp-sw-t small i{width:7px;height:7px;border-radius:1.5px;transform:rotate(45deg);background:#2DD4BF;flex:0 0 auto}
.fp-sw-t small.low{color:#FCA5A5}.fp-sw-t small.low i{background:#F87171}
.fp-chev{flex:0 0 auto;width:18px;height:18px;color:#6E7AA3;margin-left:2px}
.fp-chev svg{width:18px;height:18px;display:block}

/* its menu: every balance they can call on */
.fp-menu{position:fixed;z-index:2147482000;width:330px;max-width:calc(100vw - 16px);max-height:min(560px,calc(100vh - 24px));overflow-y:auto;padding:6px;border-radius:15px;
  background:#0E1428;border:1px solid rgba(147,197,253,.18);box-shadow:0 30px 70px -20px rgba(0,0,0,.9);opacity:0;transform:translateY(-4px);transition:opacity .16s ease,transform .16s ease;font-family:Geist,system-ui,sans-serif;color:#EEF1FA}
.fp-menu.in{opacity:1;transform:none}
.fp-mh{padding:9px 10px 7px;font-size:12px;font-weight:500;color:#6E7AA3}
.fp-mi{position:relative;display:flex;align-items:center;gap:11px;width:100%;padding:9px 10px;border:0;border-radius:10px;background:none;color:inherit;text-align:left;cursor:pointer;font-family:inherit;text-decoration:none}
.fp-mi:hover:not([disabled]),.fp-mi:focus-visible{background:rgba(148,170,230,.07);outline:0;text-decoration:none}
.fp-mi.on{background:rgba(96,165,250,.1)}
/* the row you're on: the site's gradient line on the menu's left edge */
.fp-mi::before{content:"";position:absolute;left:-6px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(#60A5FA,#2DD4BF);opacity:0;transition:opacity .14s ease;pointer-events:none}
.fp-mi:hover:not([disabled])::before,.fp-mi:focus-visible::before{opacity:1}
.fp-mi[disabled]{opacity:.5;cursor:not-allowed}
.fp-mi .hexm.ck{--hs:20px}
.fp-mi-t{flex:1;min-width:0}
.fp-mi-t b{display:block;font-size:13.5px;font-weight:600;color:#EEF1FA;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-mi-t small{display:block;margin-top:2px;font-size:12px;color:#6E7AA3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.fp-msep{height:1px;margin:6px 4px;background:rgba(147,197,253,.11)}
.fp-mic{flex:0 0 auto;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:#93C5FD;border:1px dashed rgba(147,197,253,.4);transition:border-color .15s,color .15s,background .15s}
.fp-mi:hover .fp-mic{color:#DBEAFE;border-color:rgba(147,197,253,.75);background:rgba(96,165,250,.1)}
.fp-mic svg{width:15px;height:15px}
.fp-mi.n .fp-mi-t b{font-weight:500}

/* the sheet, two balances: side by side, like /pricing's */
.fp-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:2px 0 0}
.fp-opt{position:relative;display:flex;flex-direction:column;align-items:center;min-width:0;padding:18px 12px 14px;border-radius:16px;text-align:center;cursor:pointer;
  border:1px solid rgba(147,197,253,.16);background:linear-gradient(180deg,rgba(148,170,230,.06),rgba(148,170,230,.02));color:inherit;font-family:inherit;
  transition:border-color .18s,background .18s,transform .18s,box-shadow .18s}
.fp-opt:hover{border-color:rgba(147,197,253,.38);transform:translateY(-1px)}
.fp-opt:focus-visible,.fp-row:focus-visible{outline:2px solid #60A5FA;outline-offset:2px}
.fp-opt[aria-checked="true"]{border-color:rgba(96,165,250,.7);background:linear-gradient(180deg,rgba(59,130,246,.2),rgba(59,130,246,.05));
  box-shadow:0 18px 40px -24px rgba(37,99,235,.9),inset 0 1px 0 rgba(255,255,255,.06)}
.fp-tick{position:absolute;top:10px;right:10px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,#3B82F6,#1D4ED8);opacity:0;transform:scale(.4) rotate(-60deg);transition:opacity .2s,transform .3s cubic-bezier(.34,1.56,.64,1)}
.fp-tick svg{width:11px;height:11px}
.fp-opt[aria-checked="true"] .fp-tick{opacity:1;transform:none}
.fp-n{display:block;max-width:100%;margin-top:12px;font:650 14.5px/1.3 Geist,system-ui,sans-serif;color:#F3F5FF;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-k{display:block;margin-top:2px;font-size:12px;color:#8E9BC4}
.fp-bal{margin-top:12px;align-self:stretch;padding:9px 6px;border-radius:12px;background:rgba(4,6,16,.45);border:1px solid rgba(147,197,253,.1)}
.fp-bal b{display:flex;align-items:center;justify-content:center;gap:6px;font:650 18px/1.1 Geist,system-ui,sans-serif;color:#5EEAD4;font-variant-numeric:tabular-nums}
.fp-bal b::before{content:"";width:8px;height:8px;border-radius:2px;transform:rotate(45deg);background:#2DD4BF}
.fp-bal small{display:block;margin-top:4px;font-size:11.5px;color:#8E9BC4}
.fp-bal.none b{color:#FCA5A5}.fp-bal.none b::before{background:#F87171}

/* ...three or more: a list */
.fp-rows{display:flex;flex-direction:column;gap:8px;margin:2px 0 0}
.fp-row{display:flex;align-items:center;gap:12px;width:100%;padding:10px 14px 10px 10px;border-radius:14px;cursor:pointer;text-align:left;font-family:inherit;color:inherit;
  border:1px solid rgba(147,197,253,.14);background:rgba(148,170,230,.03);transition:border-color .15s,background .15s}
.fp-row:hover{border-color:rgba(147,197,253,.34)}
.fp-row[aria-checked="true"]{border-color:rgba(96,165,250,.7);background:linear-gradient(90deg,rgba(59,130,246,.18),rgba(59,130,246,.05))}
.fp-row-bal{flex:0 0 auto;text-align:right;font:650 15px/1.1 Geist,sans-serif;color:#5EEAD4;font-variant-numeric:tabular-nums}
.fp-row-bal small{display:block;margin-top:2px;font-size:11px;font-weight:500;color:#8E9BC4}
.fp-row-bal.none{color:#FCA5A5}
.fp-dot{flex:0 0 auto;width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(147,197,253,.35);display:grid;place-items:center;transition:border-color .15s,background .15s}
.fp-row[aria-checked="true"] .fp-dot{border-color:#3B82F6;background:#3B82F6}
.fp-row[aria-checked="true"] .fp-dot::after{content:"";width:7px;height:7px;border-radius:50%;background:#fff}
.fp-note{margin:14px 0 0;font-size:12.5px;line-height:1.55;color:#8E9BC4}
@media (max-width:420px){ .fp-opts{gap:8px} .fp-opt{padding:16px 8px 12px} }
@media (prefers-reduced-motion:reduce){ .fp-opt,.fp-tick,.fp-menu,.fp-mi::before{transition:none} }