/* diversify-basket: pick companies, then news hits sectors. */
.diversify-basket-root.diversify-basket-root > * + * { margin-top: var(--s4); }
.diversify-basket-root .diversify-basket-status { margin: 0; font: 700 var(--fs-ui)/1.4 var(--font-ui); color: var(--ink); }
.diversify-basket-root .diversify-basket-grid { display: grid; gap: var(--s2); grid-template-columns: repeat(auto-fill, minmax(min(100%, 7rem), 1fr)); }
@media (min-width: 40rem) { .diversify-basket-root .diversify-basket-grid { grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: var(--s3); } }
.diversify-basket-root .diversify-basket-card { align-content: start; gap: 4px; min-height: 92px; padding: var(--s3); line-height: 1.3; }
.diversify-basket-root .diversify-basket-card .w-tag { justify-self: start; min-height: 22px; }
.diversify-basket-root .diversify-basket-card[aria-pressed="true"] .w-tag { background: var(--paper); }
.diversify-basket-root .diversify-basket-check { display: none; justify-self: start; padding: 1px 8px; border-radius: var(--r-sm); background: var(--ink); color: var(--on-ink); font: 700 var(--fs-small)/1.4 var(--font-ui); }
.diversify-basket-root .diversify-basket-card[aria-pressed="true"] .diversify-basket-check { display: inline-block; }
.diversify-basket-root .diversify-basket-move { font: 700 var(--fs-ui)/1.2 var(--font-ui); font-variant-numeric: tabular-nums; }
.diversify-basket-root .diversify-basket-move:empty, .diversify-basket-root .diversify-basket-money:empty { display: none; }
.diversify-basket-root .diversify-basket-move.w-tag { font-weight: 700; }
.diversify-basket-root .diversify-basket-money { font: 400 var(--fs-small)/1.3 var(--font-ui); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.diversify-basket-root .diversify-basket-hit--down { animation: diversify-basket-drop .55s var(--ease); }
.diversify-basket-root .diversify-basket-hit--up { animation: diversify-basket-lift .55s var(--ease); }
.diversify-basket-root .diversify-basket-actions { display: flex; flex-wrap: wrap; gap: var(--s3); }
.diversify-basket-root .diversify-basket-hint { margin: var(--s2) 0 0; color: var(--down); font: 700 var(--fs-small)/1.4 var(--font-ui); }
.diversify-basket-root .diversify-basket-hint:empty { display: none; }
.diversify-basket-root .diversify-basket-news { padding-top: var(--s3); border-top: var(--rule-strong); color: var(--ink); animation: diversify-basket-in .35s var(--ease); }
.diversify-basket-root .diversify-basket-news > .w-tag { min-height: 0; padding: 0; border: 0; background: none; color: var(--brand-ink); font-size: var(--fs-eyebrow); letter-spacing: var(--track-eyebrow); text-transform: uppercase; }
.diversify-basket-root .diversify-basket-headline { margin: var(--s2) 0 var(--s3); font: 700 var(--fs-ui-lg)/1.3 var(--font-ui); overflow-wrap: anywhere; }
.diversify-basket-root .diversify-basket-chips { display: flex; flex-wrap: wrap; gap: var(--s2); }
.diversify-basket-root .diversify-basket-chips .w-tag { background: var(--paper); color: var(--ink); }
.diversify-basket-root .diversify-basket-chips .w-tag--up { color: var(--up); }
.diversify-basket-root .diversify-basket-chips .w-tag--down { color: var(--down); }
.diversify-basket-root .diversify-basket-readouts { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.diversify-basket-root .diversify-basket-readouts .w-readout { align-content: start; }
.diversify-basket-root .diversify-basket-strip { position: relative; height: 64px; margin: var(--s5) 14px 0; }
.diversify-basket-root .diversify-basket-track { position: absolute; left: -14px; right: -14px; top: 38px; height: 4px; background: var(--mist-2); }
.diversify-basket-root .diversify-basket-zero { position: absolute; top: 28px; width: 2px; height: 24px; margin-left: -1px; background: var(--ink-3); }
.diversify-basket-root .diversify-basket-zero span { position: absolute; top: 26px; left: 50%; transform: translateX(-50%); font: 400 var(--fs-small)/1 var(--font-ui); color: var(--ink-3); }
.diversify-basket-root .diversify-basket-dot { position: absolute; top: 33px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; border: 2px solid var(--ink); background: var(--paper); }
.diversify-basket-root .diversify-basket-dot.is-picked { background: var(--ink); }
.diversify-basket-root .diversify-basket-you { position: absolute; top: 28px; width: 24px; height: 24px; margin-left: -12px; }
.diversify-basket-root .diversify-basket-you::before { content: ""; position: absolute; inset: 3px; transform: rotate(45deg); background: var(--brand); border: 2px solid var(--paper); }
.diversify-basket-root .diversify-basket-youlabel { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); white-space: nowrap; padding: 2px 4px; background: var(--paper); color: var(--brand-ink); font: 700 var(--fs-small)/1.3 var(--font-ui); font-variant-numeric: tabular-nums; }
.diversify-basket-root .diversify-basket-youlabel.is-start { left: -2px; transform: none; }
.diversify-basket-root .diversify-basket-youlabel.is-end { left: auto; right: -2px; transform: none; }
.diversify-basket-root .diversify-basket-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: var(--s4) 0 0; font: 400 var(--fs-small)/1.4 var(--font-ui); color: var(--ink-2); }
.diversify-basket-root .diversify-basket-key { display: inline-block; width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--ink); background: var(--ink); }
.diversify-basket-root .diversify-basket-key--you { margin-left: var(--s3); border-radius: 0; border-color: var(--brand); transform: rotate(45deg); background: var(--brand); }
@keyframes diversify-basket-drop { 0% { transform: none; } 30% { transform: translateY(6px) rotate(-1.5deg); } 65% { transform: translateY(-2px); } 100% { transform: none; } }
@keyframes diversify-basket-lift { 0% { transform: none; } 35% { transform: translateY(-7px) scale(1.03); } 100% { transform: none; } }
@keyframes diversify-basket-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
/* keep shared notes small even inside page rules like ".prose p" */
.diversify-basket-root.diversify-basket-root .w-note { margin: var(--s3) 0 0; font-size: var(--fs-small); line-height: 1.5; }