.bgd{gap:var(--space-6);padding-bottom:var(--space-7);flex-direction:column;display:flex}.bgd-head h1{font-size:32px}.bgd-head p{max-width:72ch;margin:var(--space-2) 0 0;color:var(--mute);font-size:14px}.bgd-section{gap:var(--space-3);flex-direction:column;display:flex}.bgd-section h2{font-size:24px}.bgd-section h3{margin-top:var(--space-2);font-size:15px}.bgd-note{color:var(--mute);margin:0;font-size:13px}.bgd-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(150px,1fr));display:grid}.bgd-swatch{gap:var(--space-1);flex-direction:column;margin:0;display:flex}.bgd-swatch__poster{aspect-ratio:4/3;border-radius:var(--r-thumb);background:var(--p-paper);color:var(--p-ink);grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr;gap:8px;padding:12px;display:grid;position:relative;overflow:hidden}.bgd-swatch__title{font-family:var(--ff-display);grid-column:1/-1;font-size:15px;font-weight:600;line-height:1.1}.bgd-swatch__block{background:var(--p-primary);border-radius:6px;align-items:flex-end;padding:6px;display:flex}.bgd-swatch__on{color:var(--p-paper);font-size:13px;font-weight:600}.bgd-swatch__second{background:var(--p-secondary);border-radius:6px}.bgd-swatch__dot{background:var(--p-accent);border-radius:50%;width:14px;height:14px;position:absolute;top:10px;right:10px}.bgd-swatch__caption{color:var(--mute);flex-wrap:wrap;gap:0 6px;font-size:11px;display:flex}.bgd-pairs{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.bgd-pair{gap:var(--space-2);padding:var(--space-4);border-radius:var(--r-card);background:var(--surface);flex-direction:column;display:flex}.bgd-pair__head{margin:0;font-size:30px;line-height:1.05}.bgd-pair__body{margin:0;font-size:15px;line-height:1.45}.bgd-font{padding:var(--space-4);border-radius:var(--r-card);background:var(--surface);flex-direction:column;gap:2px;display:flex}.bgd-font h3{align-items:baseline;gap:var(--space-2);margin:0 0 var(--space-1);font-size:18px;display:flex}.bgd-grade{font-family:var(--ff-mono);color:var(--mute);font-size:12px}.bgd-sample{align-items:baseline;gap:var(--space-3);overflow-wrap:anywhere;margin:0;font-size:22px;line-height:1.3;display:flex}.bgd-sample__meta{font-family:var(--ff-mono);color:var(--mute);flex:0 0 72px;font-size:11px;font-style:normal;font-weight:400}@media (max-width:600px){.bgd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bgd-sample{font-size:18px}.bgd-sample__meta{flex-basis:52px}}
