/* home.css: the homepage additions (home-today.js): the "Today at the zoo" strip under the hero actions, the Zoo Town
   teaser. His type scale, greens and soft cards; nothing here restyles his sections. */
.hero-plush-frame{display:block}
.step-icon img[src*="howto-"]{width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* Today at the zoo: fixed heights, so filling it in never moves the hero. */
.today-strip{display:block;max-width:470px;margin:-12px 0 30px;padding:11px 14px 12px;border:1px solid #dfe7f1;border-radius:16px;background:#ffffffb8;box-shadow:0 6px 18px #2b45700d;text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.today-strip:hover{border-color:#b9d9cc;box-shadow:0 8px 22px #07876e14}
.ts-head{display:flex;align-items:center;gap:8px;height:18px;font-size:11px;font-weight:650;color:#40556f;white-space:nowrap}
.ts-dot{width:7px;height:7px;border-radius:50%;background:#b8c6d4;flex:none}
.today-strip[data-tone=live] .ts-dot{background:#12b58a;box-shadow:0 0 0 3px #12b58a26}
.today-strip[data-tone=delayed] .ts-dot{background:#e0a33a}
.today-strip[data-tone=closed] .ts-dot{background:#8e9bb0}
.ts-state{overflow:hidden;text-overflow:ellipsis}
.ts-more{margin-left:auto;color:#0a7a62;font-weight:650}
.ts-cells{display:grid;grid-template-columns:1.25fr 1.25fr .8fr .8fr;gap:10px;margin-top:8px}
.ts-cell{display:block;min-width:0}
.ts-label{display:block;height:16px;font-size:9.5px;letter-spacing:.3px;text-transform:uppercase;color:#7a879b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-value{display:flex;align-items:center;gap:6px;height:26px;font-size:12.5px;font-weight:600;white-space:nowrap;min-width:0}
.ts-text{overflow:hidden;text-overflow:ellipsis}
.ts-value b{font-weight:700}
.ts-value b.positive{color:#0a7a62}
.ts-value small{font-size:10.5px;color:#7a879b;font-weight:550}
.ts-face{width:24px;height:24px;flex:none;border-radius:50%;background:#f1f4f8;overflow:hidden}
.ts-face:empty{display:none}
.ts-face img{width:100%;height:100%;object-fit:cover;display:block}
.today-strip:not(.is-ready) .ts-text{color:#b6c0cc}
@media(max-width:1100px){.today-strip{max-width:440px}.ts-cells{gap:8px}}
@media(max-width:800px){.today-strip{margin:-6px auto 24px;text-align:left}}
@media(max-width:480px){.today-strip{padding:10px 12px}.ts-cells{grid-template-columns:1fr 1fr;row-gap:6px}.ts-value{font-size:12px}}

/* Zoo Town teaser */
.town-teaser{padding:30px 0 40px}
.town-card{border:1px solid #e3eae2;border-radius:26px;background:#f7faf3;overflow:hidden;box-shadow:0 10px 30px #2b45700a}
.town-island{display:block;height:260px;overflow:hidden;background:#cfe9c9}
.town-island img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.town-homes{list-style:none;margin:0;padding:18px 20px 4px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;min-height:0}
.town-card.has-homes .town-homes{min-height:220px}
.town-home{display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:10px 12px;border-radius:16px;background:#fff;border:1px solid #e8eee6}
.town-home-art{grid-row:1 / 3;width:72px;height:66px;object-fit:contain}
.town-home-who{display:flex;align-items:center;gap:6px;font-size:13px;min-width:0}
.town-home-who img{width:22px;height:22px;border-radius:50%;object-fit:cover;flex:none}
.town-home-label{font-size:12px;color:#687764;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.town-card .section-more{margin:14px 0 22px}
@media(max-width:800px){.town-island{height:200px}.town-homes{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px 14px 2px;gap:10px}}
@media(max-width:480px){.town-island{height:150px}.town-home{grid-template-columns:52px 1fr;padding:8px 10px;column-gap:8px}.town-home-art{width:52px;height:48px}.town-home-who{font-size:12px}.town-home-label{font-size:11px}}

/* Owner 2026-11-07: the homepage never shows made-up numbers. Until live-data.js applies the engine snapshot
   (html[data-live=on]) the chart, the portfolio shortcuts and every portfolio button, which Dr. Yang's scripts first draw from the sample in
   portfolio-data.js, stay hidden; the trade log and the chat show a one-line placeholder. */
html:not([data-live=on]) #portfolio-overview .charts,html:not([data-live=on]) #portfolio-overview .trader-shortcut-grid{visibility:hidden}
/* Every portfolio opener (card portraits, the About dialog link, the shortcuts) would open details.js's sample account, so
   none of them shows or takes clicks until the engine snapshot is applied. */
html:not([data-live=on]) [data-portfolio]{visibility:hidden;pointer-events:none}
.trade-empty,.chat-empty{margin:0;padding:18px 4px;font-size:13px;line-height:1.6;color:#6f6a60}