/* Gallery uses the existing panel tokens, Archivo type, and button vocabulary. */
.design-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.design-card{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:8px;overflow:hidden;display:flex;flex-direction:column}
.design-preview{position:relative;aspect-ratio:8/5;background:var(--sunk);overflow:hidden}
.design-preview picture,.design-preview img,.design-preview video{display:block;width:100%;height:100%}
.design-preview img,.design-preview video{object-fit:cover;object-position:top}
.design-preview video{position:absolute;inset:0;opacity:0;pointer-events:none}
.design-preview.is-playing video{opacity:1}
.film-play{position:absolute;bottom:12px;left:12px;min-height:44px;background:var(--surface);color:var(--ink);box-shadow:0 1px 6px #141a2420}
.film-error{position:absolute;inset:auto 0 0;padding:12px;background:var(--surface);font-size:14px}
.design-details{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.design-details h2,.design-details h3{font:700 20px/1.25 var(--display);color:var(--ink);letter-spacing:0;text-transform:none;overflow-wrap:anywhere}
.design-details p{margin:0}
.design-feeling{color:var(--muted)}
.design-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:auto;padding-top:12px}
.design-start{display:inline-flex;align-items:center;min-height:44px;font-size:14px}
.design-filters{display:flex;flex-wrap:wrap;align-items:end;gap:16px}
.design-filters label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;min-width:0}
.design-filters select{font:inherit;font-size:16px;min-height:44px;padding:8px 32px 8px 12px;max-width:100%;border:1px solid var(--line);border-radius:6px;color:var(--ink);background:var(--surface)}
.design-filters label:nth-child(2){flex:1;max-width:360px}
#design-count{font-variant-numeric:tabular-nums}
@media(max-width:700px){.design-grid{grid-template-columns:minmax(0,1fr)}.design-filters label{flex:1;min-width:140px}.design-filters label:nth-child(2){max-width:none}.design-preview{aspect-ratio:390/600}}
@media(prefers-reduced-motion:reduce){.design-preview video,.film-play{display:none!important}}