/* ══ Voices v3 (SPEC-cart-voices-twoways-mobile.md §B, 2026-10-11) REPLACES v2.
   No quote glyph at all, decorative or otherwise — v2's own .vq::before (a
   decorative "above the text" glyph) was still a stray glyph on Staging,
   floating at the far left of the page; v3 drops it entirely for a plain 4px
   rule on the featured quote's left edge instead. Side reviews keep their
   literal curly quotes (body text, not the featured treatment). */
.vb{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(20px,4vw,60px);align-items:start}
@media (max-width:860px){.vb{grid-template-columns:1fr}}
.vb__f{margin:0;padding-left:clamp(18px,2.4vw,28px);border-left:4px solid var(--act)}
html[data-mode="dark"] .vb__f{border-color:var(--main2)}
.vb__f blockquote{margin:0;padding:0;overflow:visible;color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
/* The legacy base theme's own public/css/theme.css ships a sitewide
   blockquote:before{content:"\e9af"} (an icon-font quote glyph) — v3's own
   "no quote glyphs at all" never explicitly killed it since it predates
   this component, so every <blockquote> on the page still shows it
   (confirmed live: a pink 28px mark rendered over the featured quote).
   Killed here and on .vb__l's quotes below rather than touched globally,
   since the legacy stylesheet isn't this component's to edit. */
.vb__f blockquote::before,.vb__l blockquote::before{content:none}
.vb__f p{margin:0;font-family:var(--disp);font-variation-settings:var(--fr-display);font-weight:650;font-size:clamp(32px,3.3vw,42px);line-height:1.16;letter-spacing:-.012em;color:var(--tx)}
.vb__f figcaption{margin-top:18px;font:800 13px/1 var(--ui);letter-spacing:.18em;text-transform:uppercase;color:var(--tx-dim)}
.vb__l figure{margin:0;padding:20px 0;border-top:1px solid var(--line)}
.vb__l figure:last-child{border-bottom:1px solid var(--line)}
.vb__l blockquote{margin:0;padding:0;overflow:visible;color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
.vb__l p{margin:0;font-size:16px;line-height:1.65;color:var(--tx-dim)}
.vb__l figcaption{margin-top:10px;font:800 12.5px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--tx-dim)}

/* ══ From your shelves —— 最多 3 张买家返图,没有图的格子不渲染(逐张 if
   过滤),一张都没有整行不渲染(外层 if 已经判断)══ */
.vb__g{margin-top:clamp(28px,5vw,52px)}
.vb__gh{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.vb__gh .cap{margin:0}
.vb__gh p{margin:0;font-size:13.5px;color:var(--tx-dim)}
.vb__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.vb__row figure{margin:0}
.vb__ph{aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--raise);box-shadow:inset 0 0 0 1px var(--line)}
.vb__ph img{width:100%;height:100%;object-fit:cover;display:block}
/* Editor-only (request.design_mode) empty-slot labels — never shown to a
   real visitor, see the markup's own comment above this row. */
.vb__ph--empty{display:grid;place-items:center;border:1.5px dashed var(--tx-faint);
  background:transparent;box-shadow:none;color:var(--tx-faint);font-size:13px;letter-spacing:.04em}
.vb__row figcaption{margin-top:10px;font-size:14px;color:var(--tx-dim)}
.vb__row figcaption a{color:var(--tx);text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){.vb__row figcaption a:hover{color:var(--act)}
  html[data-mode="dark"] .vb__row figcaption a:hover{color:var(--main2)}}
@media (max-width:640px){.vb__row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:6px}.vb__row figure{scroll-snap-align:start}}