/* Matches the account Portfolio snapshot panel (snapshot-ui.css). */
.brokerage-intervals{padding:16px 22px;--bi-gain:var(--return-gain,#39ff88);--bi-loss:var(--return-loss,#ff4058)}
body.light .brokerage-intervals{--bi-gain:var(--return-gain,#087046);--bi-loss:var(--return-loss,#bd203b)}
.bi-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px;min-height:28px}
.bi-title{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
.bi-title h2{font-size:17px;margin:0}
.bi-sub{font-size:11px;color:var(--muted)}
.bi-open{font-size:10px;padding:4px 8px;margin:0;white-space:nowrap}
.bi-linked{cursor:pointer;transition:border-color .2s ease}
.bi-linked:hover{border-color:var(--accent)}
.bi-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:0}
.bi-cell{display:flex;flex-direction:column;gap:1px;min-width:0;padding:4px 12px;border-left:1px solid var(--border)}
.bi-cell:first-child{border-left:0;padding-left:0}
.bi-cell-head{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:20px}
.bi-period{font-size:11px;color:var(--muted);line-height:20px}
.bi-return{font-size:20px;line-height:1.25;letter-spacing:-.4px;font-weight:550;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text)}
.performance-gain .bi-return{color:var(--bi-gain)}
.performance-loss .bi-return{color:var(--bi-loss)}
.bi-gain{font-size:12px;font-variant-numeric:tabular-nums;color:var(--text)}
.bi-label{font-size:10px;color:var(--muted);overflow-wrap:anywhere}
.bi-flag{padding:0;width:18px;height:18px;line-height:16px;border-radius:999px;font-size:11px;color:var(--chart-gold);border:1px solid var(--chart-gold);background:transparent;flex:none}
.bi-flag[aria-expanded="true"]{background:var(--chart-gold);color:var(--bg)}
.bi-detail{border-left:2px solid var(--chart-gold);padding:6px 10px;margin:12px 0 0;font-size:11px}
.bi-flag.bi-info{color:var(--muted);border-color:var(--muted);font-style:italic;font-family:Georgia,serif}
.bi-flag.bi-info[aria-expanded="true"]{background:var(--muted);color:var(--bg)}
.directory-return .bi-flag{vertical-align:middle;margin-left:2px}
.directory-return .bi-detail{margin:0;font-weight:400;color:var(--text)}
.bi-pop-host{position:relative}
.bi-detail.bi-pop{position:absolute;z-index:30;margin:0;width:max-content;max-width:min(280px,100%);line-height:1.45;font-size:12px;font-weight:400;color:var(--text);background:var(--panel);border:1px solid var(--border);border-left:2px solid var(--chart-gold);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.28)}
.bi-notes{display:block;margin-top:10px;font-size:10px;color:var(--muted)}
@media(max-width:900px){.bi-row{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:12px}.bi-cell:nth-child(4n+1){border-left:0;padding-left:0}}
@media(max-width:520px){.brokerage-intervals{padding:16px}.bi-row{grid-template-columns:repeat(2,minmax(0,1fr))}.bi-cell{border-left:0;padding-left:0}.bi-cell:nth-child(2n){border-left:1px solid var(--border);padding-left:12px}.bi-return{font-size:18px}}

/* Returns chart in the Overview "Gross holdings" area (Robinhood-style line chart). */
/* The chart replaces the old price gains/losses block. :has() survives the snapshot redrawing its classes. */
.snapshot-performance:has(>.bi-chart-wrap)>:not(.snapshot-label):not(.snapshot-value):not(.bi-chart-wrap){display:none!important}
.bi-chart-wrap{display:flex;flex-direction:column;gap:6px;min-width:0;margin-top:2px}
.bi-chart-change{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:22px;font-variant-numeric:tabular-nums}
.bi-chart-gain{font-size:14px;font-weight:600;color:var(--performance-color);white-space:nowrap}
.bi-chart-when{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--text)}
.bi-chart-plot{position:relative;height:170px;margin:6px 0 2px;color:var(--performance-color);cursor:crosshair;outline:none;touch-action:pan-y}
.bi-chart-plot:focus-visible{box-shadow:0 0 0 2px var(--accent);border-radius:6px}
.bi-chart-area{position:absolute;top:6px;right:46px;bottom:20px;left:0}
.bi-chart-area svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.bi-chart-grid{stroke:var(--border);stroke-width:1;opacity:.7}
.bi-chart-y{position:absolute;top:6px;right:0;bottom:20px;width:42px;pointer-events:none}
.bi-chart-y span{position:absolute;right:0;transform:translateY(-50%);font-size:10px;line-height:1;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.bi-chart-x{position:absolute;left:0;right:46px;bottom:0;height:14px;pointer-events:none}
.bi-chart-x span{position:absolute;top:0;transform:translateX(-50%);font-size:10px;line-height:14px;color:var(--muted);white-space:nowrap}
.bi-chart-x span.start{transform:none}.bi-chart-x span.end{transform:translateX(-100%)}
.bi-chart-line{stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.bi-chart-baseline{stroke:var(--muted);stroke-width:1.5;stroke-dasharray:2 5;opacity:.85}
.bi-chart-cross{stroke:var(--muted);stroke-width:1;opacity:.7}
.bi-chart-dot{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px var(--panel);pointer-events:none}
/* The live dot at the end of the line pulses softly in the line's color (green up, red down), like a live ticker. */
.bi-chart-dot::after{content:'';position:absolute;inset:0;border-radius:50%;background:currentColor;animation:bi-live-pulse 2s ease-out infinite}
.bi-inspecting .bi-chart-dot::after{animation:none;opacity:0}
@keyframes bi-live-pulse{0%{transform:scale(1);opacity:.65}100%{transform:scale(3.4);opacity:0}}
@media (prefers-reduced-motion:reduce){.bi-chart-dot::after{animation:none;opacity:0}}
.bi-chart-empty{display:flex;align-items:center;height:100%;font-size:11px;color:var(--muted)}
.bi-chart-tabs{display:flex;flex-wrap:wrap;gap:2px;border-bottom:1px solid var(--border)}
.bi-chart-tabs .bi-tab{background:transparent;border:0;border-bottom:2px solid transparent;border-radius:0;margin:0 0 -1px;padding:6px 7px;font-size:12px;font-weight:600;color:var(--text);line-height:1.2}
.bi-chart-tabs .bi-tab:hover{color:var(--performance-color)}
.bi-chart-tabs .bi-tab.active{color:var(--performance-color);border-bottom-color:var(--performance-color)}
.bi-chart-wrap .bi-detail{margin:4px 0 0}
.bi-chart-wrap .bi-notes{margin-top:2px}
/* The panel grows to fit the chart instead of clipping it. */
#portfolioSummary.snapshot-redesign:has(.bi-chart-wrap){height:auto}
.snapshot-redesign .snapshot-grid:has(.bi-chart-wrap){height:auto}
@media(max-width:760px){.bi-chart-plot{height:160px}.bi-chart-tabs .bi-tab{padding:6px 6px;font-size:11px}}

/* Holdings / cash split under the Account value headline: neon like the Accounts home bar, interactive like "Across your accounts". */
.bi-split.combined-composition{display:block;width:100%;margin:2px 0 4px}
.bi-split .bi-split-zone{display:block}
.bi-split-zone{position:relative;padding-top:2px}
.bi-neon-track{display:flex;gap:3px;height:8px;background:transparent;overflow:visible;border-radius:5px}
.bi-seg{display:block;height:100%;min-width:4px;border-radius:5px;cursor:pointer;outline:none;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;transform-origin:center}
.bi-neon-track>.bi-seg-holdings{background:linear-gradient(90deg,#5b98e8,#73a8f2);box-shadow:0 0 6px rgba(121,176,255,.4)}
.bi-neon-track>.bi-seg-cash{background:linear-gradient(90deg,#f4c56a,#ffd98a);box-shadow:0 0 6px rgba(244,197,106,.35)}
.bi-split.hovering .bi-seg:not(.active){filter:saturate(.5) brightness(.75)}
.bi-seg.active,.bi-seg:focus-visible{transform:scaleY(1.75);filter:brightness(1.15)}
.bi-seg-holdings.active{box-shadow:0 0 18px rgba(121,176,255,1),0 0 6px rgba(160,200,255,1)}
.bi-seg-cash.active{box-shadow:0 0 16px rgba(244,197,106,.95),0 0 5px rgba(255,220,150,1)}
.bi-split .combined-asset-labels{margin-top:7px}
.bi-split-item{display:flex;align-items:center;gap:5px;transition:transform .18s ease,color .18s ease;transform-origin:left center}
.bi-split-item:last-child{transform-origin:right center}
.bi-split-item i{width:6px;height:6px;border-radius:50%;background:#79b0ff}
.bi-item-cash i{background:#f4c56a}.bi-item-debt i{background:#ff4058}
.bi-split.hovering .bi-split-item:not(.active){opacity:.6}
.bi-split-item.active{transform:scale(1.12)}
.bi-split-item.active b{color:var(--text);font-weight:650}
.bi-split-tip{position:absolute;bottom:calc(100% + 6px);left:0;z-index:5;display:grid;grid-template-columns:auto auto;align-items:baseline;gap:0 10px;width:max-content;padding:8px 12px;border:1px solid #79b0ff;border-radius:8px;background:var(--panel);box-shadow:0 6px 22px rgba(0,0,0,.35),0 0 14px rgba(121,176,255,.35);pointer-events:none}
.bi-split-tip[hidden]{display:none}
.bi-tip-cash{border-color:#f4c56a;box-shadow:0 6px 22px rgba(0,0,0,.35),0 0 14px rgba(244,197,106,.35)}
.bi-tip-debt{border-color:#ff4058}
.bi-tip-name{font-size:11px;color:var(--muted);grid-column:1/-1}
.bi-tip-value{font-size:22px;line-height:1.15;font-weight:650;letter-spacing:-.4px;font-variant-numeric:tabular-nums;color:var(--text)}
.bi-tip-share{font-size:11px;color:var(--muted)}
.bi-tip-pointer{position:absolute;top:100%;width:10px;height:10px;margin-left:-5px;margin-top:-5px;background:var(--panel);border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);color:#79b0ff}
.bi-tip-cash .bi-tip-pointer{color:#f4c56a}.bi-tip-debt .bi-tip-pointer{color:#ff4058}
.bi-tip-pop{animation:bi-tip-pop .2s ease}
@keyframes bi-tip-pop{from{opacity:0;transform:translateY(4px) scale(.96)}to{opacity:1;transform:none}}
body.light .bi-seg-holdings,body.light .bi-seg-cash{box-shadow:none}
@media (prefers-reduced-motion:reduce){.bi-seg,.bi-split-item{transition:none}.bi-tip-pop{animation:none}}
/* Accounts home: total bar and the bars inside account cards. */
.bi-home-total{width:min(100%,440px)}
.bi-card-split .combined-asset-labels{justify-content:space-between;margin-top:9px}
.bi-card-split .bi-neon-track{height:6px}
/* Card labels keep the card's small stacked look: name on top, amount under it. */
.bi-card-split .bi-split-item{display:grid;grid-template-columns:auto auto;align-items:center;gap:3px 5px;font-size:10px;color:var(--muted)}
.bi-card-split .bi-split-item b{grid-column:2;font-size:13px;font-weight:600;color:var(--text)}
.bi-card-split .bi-split-item:last-child{justify-content:end}
.bi-card-split .bi-split-item:last-child b{grid-column:1/-1;justify-self:end}
.bi-split-tip .bi-tip-value{font-size:22px}
.bi-card-split .bi-split-tip .bi-tip-value{font-size:20px}
.account-composition:has(.bi-card-split){display:block}