.quality-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}
.quality-heading>div{min-width:0}
.quality-see-all{display:inline-flex;align-items:center;gap:6px;flex:none;min-height:44px;color:var(--green);font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap}
.quality-see-all:hover{text-decoration:underline;text-underline-offset:4px}
.quality-rail{padding-top:2px}
.quality-card>a{display:block;height:100%}
.quality-card .quality-view{position:relative;isolation:isolate;background:#44352d}
.quality-scene{position:absolute;inset:0;transform:scale(1.04);pointer-events:none}
.quality-scene img{transform:scale(1.8)}
.quality-scene canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;pointer-events:none}
.quality-scene-ready canvas{opacity:1}
.quality-scene-ready img{visibility:hidden}
.quality-card:has(a:focus-visible){outline:3px solid var(--green);outline-offset:-3px}
.quality-card a:focus-visible{outline:none}
.quality-rail:focus-visible{outline:2px solid var(--green);outline-offset:-2px;border-radius:11px}
.quality-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px;margin-top:1px}
.quality-footer>small{color:var(--muted);font-size:12px}
.quality-motion{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:36px;padding:3px 7px;border:0;border-radius:5px;background:transparent;color:var(--green);font:inherit;font-size:12px;white-space:nowrap;cursor:pointer}
.quality-motion[hidden]{display:none}
.quality-motion:hover{background:#edf4ef}
.quality-motion:focus-visible,.quality-see-all:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.quality-motion:disabled{color:var(--muted);cursor:default}
.quality-motion svg{width:13px;height:13px;fill:currentColor}
.quality-play-icon,.quality-motion[aria-pressed="true"] .quality-pause-icon{display:none}
.quality-motion[aria-pressed="true"] .quality-play-icon{display:block}
.quality-motion:disabled svg{display:none}
@media(max-width:700px){
  .quality-heading{gap:9px}
  .quality-see-all{font-size:12px;gap:4px}
  .quality-heading p{max-width:245px}
  .quality-footer>small,.quality-motion{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.quality-scene{transform:scale(1.04)!important}}
