/* Bearco Buy panel - one place to buy a token once or on repeat, from any page.
   Uses the shared --bc-* palette; the panel is a slide-over on wide screens, a bottom sheet on phones. */
.bb-root { position: fixed; inset: 0; z-index: 9000; display: none; font: 13.5px/1.5 var(--bc-mono); color: var(--bc-text);
  /* the panel carries the shared palette itself, so it looks the same on pages that don't load bearco-core.css */
  --bc-bg: #0B0F10; --bc-panel: #12181A; --bc-card: #171F21; --bc-card2: #1D2628; --bc-border: #26302F;
  --bc-text: #EEF5F2; --bc-dim: #8FA39D; --bc-green: #39FF88; --bc-red: #FF5C5C; --bc-blue: #3DA9FF; --bc-orange: #FFA630;
  --bc-accent: var(--bc-green); --bc-mono: ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace; }
.bb-root * { box-sizing: border-box; }
.bb-root .bc-btn { background: var(--bc-card2); color: var(--bc-accent); border: 1px solid var(--bc-border); border-radius: 8px; font: 600 12.5px var(--bc-mono); padding: 7px 12px; cursor: pointer; }
.bb-root .bc-btn:hover:not([disabled]) { border-color: var(--bc-accent); }
.bb-root .bc-btn[disabled] { color: var(--bc-dim); opacity: .7; cursor: not-allowed; }
.bb-root .bc-chip { background: transparent; color: var(--bc-dim); border: 1px solid var(--bc-border); border-radius: 999px; padding: 3px 10px; font: 12px var(--bc-mono); cursor: pointer; }
.bb-root .bc-chip.on { color: #061008; background: var(--bc-accent); border-color: var(--bc-accent); }
.bb-root .bc-select, .bb-root .bc-input { background: var(--bc-card2); color: var(--bc-text); border: 1px solid var(--bc-border); border-radius: 8px; padding: 6px 10px; font: 13px var(--bc-mono); }
.bb-root .bc-input:focus, .bb-root .bc-select:focus { outline: none; border-color: var(--bc-accent); }
.bb-root .bc-ico { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: var(--bc-card2); flex: none; }
.bb-root .bc-ico-txt { display: inline-flex; align-items: center; justify-content: center; font: 700 11px var(--bc-mono); color: var(--bc-accent); border: 1px solid var(--bc-border); }
.bb-root .bc-dim { color: var(--bc-dim); }
.bb-root.open { display: block; }
.bb-scrim { position: absolute; inset: 0; background: rgba(4, 8, 6, .72); backdrop-filter: blur(2px); }
.bb-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(460px, 100vw); background: var(--bc-panel); border-left: 1px solid var(--bc-border);
  display: flex; flex-direction: column; box-shadow: -24px 0 60px rgba(0, 0, 0, .5); transform: translateX(100%); transition: transform .28s cubic-bezier(.2, .8, .2, 1); }
.bb-root.open .bb-panel { transform: none; }
@media (max-width: 640px) {
  .bb-panel { top: auto; left: 0; width: 100vw; max-height: 92vh; border-left: 0; border-top: 1px solid var(--bc-border); border-radius: 16px 16px 0 0; transform: translateY(100%); }
}
@media (prefers-reduced-motion: reduce) { .bb-panel { transition: none; } }

.bb-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px 10px; border-bottom: 1px solid var(--bc-border); }
.bb-head .bc-ico { width: 36px; height: 36px; }
.bb-title { flex: 1; min-width: 0; }
.bb-title b { font-size: 16px; display: block; }
.bb-title span { color: var(--bc-dim); font-size: 12px; }
.bb-price { text-align: right; font-size: 12px; color: var(--bc-dim); white-space: nowrap; }
.bb-price b { display: block; color: var(--bc-text); font-size: 13px; }
.bb-live { padding: 5px 9px; font-size: 11px; }
@media (max-width: 420px) { .bb-live { padding: 5px 7px; } }
.bb-x { background: none; border: 0; color: var(--bc-dim); font-size: 22px; line-height: 1; padding: 4px 6px; cursor: pointer; border-radius: 6px; }
.bb-x:hover, .bb-x:focus-visible { color: var(--bc-text); outline: none; background: var(--bc-card2); }

.bb-body { flex: 1; overflow: auto; padding: 14px 16px 20px; }

/* the flow line - the one thing that should be memorable here */
.bb-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 6px; padding: 14px 12px; margin: 0 0 14px;
  background: linear-gradient(180deg, rgba(57, 255, 136, .07), rgba(57, 255, 136, .02)); border: 1px solid rgba(57, 255, 136, .22); border-radius: 12px; }
.bb-flow .n { text-align: center; min-width: 0; }
.bb-flow .n b { display: block; font-size: 15px; color: var(--bc-text); overflow-wrap: anywhere; line-height: 1.25; }
.bb-flow .n span { display: block; font-size: 11px; color: var(--bc-dim); margin-top: 2px; }
.bb-flow .a { color: var(--bc-green); font-size: 16px; opacity: .8; }
.bb-flow.live b { animation: bb-pulse .5s ease-out; }
@keyframes bb-pulse { from { color: var(--bc-green); } to { color: var(--bc-text); } }
.bb-flow.done { border-color: var(--bc-green); background: rgba(57, 255, 136, .12); }
.bb-flow.done .n b { color: var(--bc-green); }

.bb-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.bb-label { font-size: 12px; color: var(--bc-dim); margin: 14px 0 6px; }
.bb-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.bb-chips .bc-chip { font: 600 13px var(--bc-mono); padding: 7px 14px; }
.bb-chips input { width: 92px; }
.bc-input.bb-num { font-size: 13px; padding: 6px 10px; }

.bb-seg { display: inline-flex; border: 1px solid var(--bc-border); border-radius: 10px; overflow: hidden; }
.bb-seg button { background: var(--bc-card2); color: var(--bc-dim); border: 0; padding: 8px 18px; font: 600 13px var(--bc-mono); cursor: pointer; }
.bb-seg button + button { border-left: 1px solid var(--bc-border); }
.bb-seg button.on { background: var(--bc-accent); color: #061008; }
.bb-seg button:focus-visible { outline: 2px solid var(--bc-accent); outline-offset: -2px; }

.bb-repeat { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.bb-repeat label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--bc-dim); }
.bb-repeat .bc-select, .bb-repeat .bc-input { font-size: 13px; padding: 7px 10px; }
.bb-total { font-size: 12px; color: var(--bc-dim); margin-top: 6px; }
.bb-total b { color: var(--bc-text); }

.bb-fine { font-size: 12px; color: var(--bc-dim); margin: 10px 0 0; }
.bb-fine .bb-floor { background: var(--bc-card2); border: 1px solid var(--bc-border); border-radius: 999px; color: var(--bc-text); cursor: pointer; font: 600 11.5px var(--bc-mono); padding: 2px 9px; }
.bb-fine .bb-floor:hover { border-color: var(--bc-accent); }
.bb-body a { color: var(--bc-dim); } .bb-body a:hover { color: var(--bc-text); }

.bb-go { width: 100%; margin-top: 16px; padding: 13px 16px; border-radius: 12px; border: 1px solid var(--bc-accent); background: rgba(57, 255, 136, .14); color: var(--bc-green);
  font: 700 15px var(--bc-mono); cursor: pointer; }
.bb-go:hover:not([disabled]) { background: rgba(57, 255, 136, .22); }
.bb-go[disabled] { opacity: .55; cursor: wait; }
.bb-go:focus-visible { outline: 2px solid var(--bc-green); outline-offset: 2px; }

.bb-msg { margin: 10px 0 0; padding: 9px 12px; border-radius: 10px; font-size: 12.5px; border: 1px solid; }
.bb-msg.bad { border-color: rgba(255, 92, 92, .5); background: rgba(255, 92, 92, .08); color: #ffb3b3; }
.bb-msg.ok { border-color: rgba(57, 255, 136, .4); background: rgba(57, 255, 136, .07); color: #bfffd9; }
.bb-msg.warn { border-color: rgba(255, 166, 48, .5); background: rgba(255, 166, 48, .08); color: #ffd79a; }

/* guided setup - a short rail of what's left to do */
.bb-steps { display: grid; gap: 8px; margin: 0 0 14px; }
.bb-step { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; padding: 12px; border: 1px solid var(--bc-border); border-radius: 12px; background: var(--bc-card); }
.bb-step.done { opacity: .55; }
.bb-step.now { border-color: rgba(57, 255, 136, .5); background: var(--bc-card2); }
.bb-step i { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--bc-border); display: inline-flex; align-items: center; justify-content: center; font: 700 12px var(--bc-mono); color: var(--bc-dim); font-style: normal; }
.bb-step.done i { background: var(--bc-green); color: #061008; border-color: var(--bc-green); }
.bb-step.now i { color: var(--bc-green); border-color: var(--bc-green); }
.bb-step b { display: block; font-size: 13px; }
.bb-step p { margin: 3px 0 0; font-size: 12px; color: var(--bc-dim); }
.bb-step .bb-row { margin: 8px 0 0; }
.bb-seed { background: #0a0f0d; border: 1px dashed var(--bc-orange); border-radius: 8px; padding: 10px; letter-spacing: .05em; word-break: break-all; user-select: all; margin: 8px 0; font-size: 12.5px; }
.bb-qr { background: #fff; padding: 6px; border-radius: 8px; width: 132px; height: 132px; }
.bb-qr svg { width: 120px; height: 120px; display: block; }
.bb-fund { display: flex; gap: 12px; align-items: flex-start; margin-top: 8px; }
.bb-fund code { display: block; font-size: 11px; word-break: break-all; color: var(--bc-text); }
.bb-bal { font-size: 12px; color: var(--bc-dim); margin-top: 6px; }
.bb-bal b { color: var(--bc-text); }
.bb-step .bc-input { font-size: 13px; padding: 7px 10px; flex: 1 1 140px; min-width: 0; }
.bb-step .bc-btn { padding: 7px 12px; font-size: 12.5px; }
.bb-chk { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--bc-text); margin: 8px 0; }

/* plans at the bottom */
.bb-plans { margin-top: 18px; border-top: 1px solid var(--bc-border); padding-top: 12px; }
.bb-plan { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; padding: 6px 0; border-bottom: 1px dotted var(--bc-border); font-size: 12.5px; }
.bb-plan span { color: var(--bc-dim); font-size: 12px; }
.bb-plan .pill { font-size: 10.5px; border: 1px solid var(--bc-border); border-radius: 999px; padding: 1px 8px; color: var(--bc-dim); }
.bb-plan .pill.active { color: var(--bc-green); border-color: rgba(57, 255, 136, .5); }
.bb-plans a { color: var(--bc-dim); font-size: 12px; }

/* a small trigger button pages can drop anywhere */
.bb-trigger { background: rgba(57, 255, 136, .14); color: var(--bc-green); border: 1px solid rgba(57, 255, 136, .55); border-radius: 8px; padding: 4px 12px; font: 700 12px var(--bc-mono); cursor: pointer; }
.bb-trigger:hover { background: rgba(57, 255, 136, .22); }

/* buy / sell switch and the percentage sliders */
.bb-side { margin: 0 0 12px; }
.bb-side button.on.sell { background: var(--bc-orange); color: #1a0f00; }
.bb-amt { margin: 4px 0 2px; }
.bb-slider { width: 100%; accent-color: var(--bc-green); height: 28px; cursor: pointer; }
.bb-slider.sell { accent-color: var(--bc-orange); }
.bb-amt-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; margin-top: 2px; }
.bb-amt-row b { font-size: 15px; min-width: 44px; }
.bb-amt-row .bb-num { width: 110px; margin-left: auto; }
.bb-every { display: flex; gap: 6px; }
.bb-every .bc-input { width: 70px; }
.bb-every .bc-select { flex: 1; }
.bb-go.sell { border-color: var(--bc-orange); background: rgba(255, 166, 48, .14); color: var(--bc-orange); }
.bb-go.sell:hover:not([disabled]) { background: rgba(255, 166, 48, .22); }
.bb-flow.done.sell { border-color: var(--bc-orange); }
.bb-trigger.sell { background: rgba(255, 166, 48, .12); color: var(--bc-orange); border-color: rgba(255, 166, 48, .55); }
.bb-trigger.sell:hover { background: rgba(255, 166, 48, .2); }

.bb-root .bb-msg-link { display: inline-block; margin-left: 6px; color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

.bb-root .bb-walletsw { margin: 0 0 10px; align-items: center; gap: 8px; font-size: 12px; }

/* DCA explainer + first-time tip (2026-10-18) */
.bb-why { margin: 8px 0 2px; font-size: 12.5px; color: var(--bc-dim); }
.bb-why summary { cursor: pointer; color: var(--bc-green); width: max-content; list-style: none; }
.bb-why summary::-webkit-details-marker { display: none; }
.bb-why summary::before { content: "ⓘ "; }
.bb-why p { margin: 6px 0 0; line-height: 1.45; }
.bb-hint { color: var(--bc-green) !important; opacity: .85; }
.bb-need{display:inline-block;margin-top:4px;font-size:12px}.bb-need.ok{color:var(--bc-dim)}.bb-need.low{color:#FF5A6E}

.bb-bk{margin:6px 0 10px;padding:8px 10px;border:1px solid rgba(255,255,255,.08);border-radius:10px;font-size:12px}.bb-bk-row{display:flex;justify-content:space-between;gap:10px;padding:2px 0;color:var(--bc-dim)}.bb-bk-row b{font-variant-numeric:tabular-nums;color:inherit;font-weight:600}.bb-bk-row.avail{margin-top:4px;padding-top:6px;border-top:1px solid rgba(255,255,255,.08);color:var(--bc-text,#fff)}.bb-bk-row.avail b{color:#3DDC97}

/* Recent transactions: the receipt glyph lands in the blank row (2026-10-19) */
.bb-recent{margin-top:12px;padding:8px 10px;border:1px solid rgba(255,255,255,.08);border-radius:10px}
.bb-rx{display:flex;align-items:center;gap:10px;padding:6px 2px;font-size:12.5px;border-top:1px solid rgba(255,255,255,.05);border-radius:6px}
.bb-rx:first-of-type{border-top:0}
.bb-rx-dot{flex:0 0 20px;height:20px;border-radius:50%;display:grid;place-items:center;font:800 11px ui-monospace,Menlo,monospace;color:#0B0F10}
.bb-rx.pending .bb-rx-dot{border:2px dashed rgba(255,225,77,.55);animation:bbRxSpin 2.4s linear infinite}
.bb-rx.ok .bb-rx-dot{background:#FFE14D}.bb-rx.fail .bb-rx-dot{background:#FF5A6E}.bb-rx.stale .bb-rx-dot{border:2px solid var(--bc-dim)}
.bb-rx-txt{flex:1;min-width:0}.bb-rx.fail .bb-rx-txt{color:#FF5A6E}.bb-rx.stale .bb-rx-txt{color:var(--bc-dim)}
.bb-rx-wait{flex:1;min-width:0;position:relative;height:16px;border-radius:5px;overflow:hidden;background:rgba(255,255,255,.05)}
.bb-rx-wait i{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,225,77,.22),transparent);animation:bbRxShim 1.3s linear infinite}
.bb-rx-wait em{position:relative;font-style:normal;font-size:11px;color:var(--bc-dim);padding-left:8px;line-height:16px}
.bb-rx-t{color:var(--bc-dim);font-size:11px;white-space:nowrap}.bb-rx-t a{color:inherit}
.bb-rx.just{animation:bbRxPop .9s ease-out}.bb-rx.just .bb-rx-dot{animation:bbRxDot .5s ease-out}
@keyframes bbRxSpin{to{transform:rotate(360deg)}}
@keyframes bbRxShim{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@keyframes bbRxPop{0%{background:rgba(255,225,77,.35)}100%{background:transparent}}
@keyframes bbRxDot{0%{transform:scale(1.8)}60%{transform:scale(.85)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.bb-rx.pending .bb-rx-dot,.bb-rx-wait i,.bb-rx.just,.bb-rx.just .bb-rx-dot{animation:none}}
[data-land].just{animation:bbRxPop .9s ease-out;border-radius:6px}
@media (prefers-reduced-motion:reduce){[data-land].just{animation:none}}

/* Receive Verification (2026-10-24, /shared/bearco-receive.js) - the Conduit app's glyph train into the receiving
   wallet's Recent transactions, for a Buy-once and the first buy of an auto-buy. */
.bb-rv-layer{position:fixed;inset:0;width:100vw;height:100vh;z-index:2147483647;pointer-events:none}   /* above the window: the glyphs jump into it */
.bb-rv{position:fixed;right:16px;bottom:16px;z-index:2147483646;width:min(440px,calc(100vw - 32px));   /* bottom-right (Jeff, 12:58) */
  box-sizing:border-box;
  padding:14px 16px;border-radius:14px;background:#0D1712;border:2px dashed #FFE14D;box-shadow:0 18px 60px rgba(0,0,0,.6);cursor:pointer;
  font:13px/1.4 ui-monospace,"JetBrains Mono",Menlo,Consolas,monospace;color:#E7ECE9;animation:bbRvIn .22s ease-out}
.bb-rv[hidden]{display:none}
.bb-rv.fail{border-color:#FF5A6E}
@keyframes bbRvIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.bb-rv-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.bb-rv-title{color:#8FA69C;font-size:10px;font-weight:700;letter-spacing:1px}
.bb-rv-tag{font-size:10px;letter-spacing:1px;color:#FFE14D}
.bb-rv.ok .bb-rv-tag{color:#39FF88}.bb-rv.fail .bb-rv-tag{color:#FF5A6E}
.bb-rv-addr{margin-top:8px;color:#39FF88;font-weight:700;word-break:break-all}
.bb-rv-fp{margin-top:8px;overflow:hidden;min-height:68px;box-sizing:border-box;border:1.5px dashed #FFE14D;border-radius:10px;padding:6px;display:flex;align-items:center;justify-content:center}
.bb-rv.ok .bb-rv-fp{border-color:#39FF88}.bb-rv.fail .bb-rv-fp{border-color:#FF5A6E}
.bb-rv-fptext{color:#8FA69C;font-size:11px;text-align:center}
.bb-rv.fail .bb-rv-fptext{color:#FF5A6E}
.bb-rv-fptext[hidden],.bb-rv-card[hidden]{display:none}
.bb-rv-card{flex:1;min-width:0;max-width:100%;box-sizing:border-box;overflow:hidden;display:flex;align-items:center;gap:10px;background:#14211B;border-radius:8px;padding:6px 10px}
.bb-rv-card.in{animation:bbRvMelt .52s ease-out}
@keyframes bbRvMelt{from{opacity:0}to{opacity:1}}
.bb-rv-badge{color:#39FF88;background:rgba(57,255,136,.16);border-radius:5px;padding:2px 6px;font-size:9px;font-weight:800}
.bb-rv-mid{flex:1;min-width:0;display:flex;flex-direction:column}
.bb-rv-amt{color:#39FF88;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb-rv-from{color:#8FA69C;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb-rv-right{display:flex;flex-direction:column;align-items:flex-end;font-size:10px}
.bb-rv-led{color:#8FA69C;font-size:9px}
.bb-rv-div{height:1px;background:#23302B;margin:10px 0 6px}
.bb-rv-prior{display:flex;flex-direction:column;gap:3px}
.bb-rv-row{display:flex;align-items:center;gap:8px;font-size:10px}
.bb-rv-pill{color:#8FA69C;background:rgba(143,163,157,.16);border-radius:5px;padding:1px 6px;font-size:9px;font-weight:800}
.bb-rv-who{flex:1;min-width:0;color:#8FA69C;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb-rv-pamt{color:#E7ECE9;font-size:11px;white-space:nowrap}.bb-rv-pamt.neg{color:#FF5A6E}
.bb-rv-ago{color:#8FA69C;font-size:9px;white-space:nowrap}
.bb-rv-dim{color:#8FA69C;font-size:10px}
@media (prefers-reduced-motion:reduce){.bb-rv,.bb-rv-card.in{animation:none}}

/* Buy / Start pressed (2026-10-24): a quick run through greens so it's obvious it went, before the panel closes */
.bb-go.pressed,.bb-go.pressed[disabled]{opacity:1;animation:bbGoPress .55s ease-out forwards}
@keyframes bbGoPress{
  0%{background:#39FF88;color:#06140C;border-color:#39FF88;box-shadow:0 0 0 0 rgba(57,255,136,.7)}
  30%{background:#1FD36E;color:#06140C;border-color:#1FD36E;box-shadow:0 0 0 8px rgba(57,255,136,.25)}
  60%{background:#14A85C;color:#E9FFF2;border-color:#14A85C;box-shadow:0 0 0 14px rgba(57,255,136,0)}
  100%{background:#0E7A43;color:#E9FFF2;border-color:#2BFF7A;box-shadow:none}}
@media (prefers-reduced-motion:reduce){.bb-go.pressed{animation:none;background:#14A85C;color:#E9FFF2}}