.rule{display:flex;align-items:center;margin:5px 0;color:red;font-size:14px}.rule .icon{width:20px;height:20px;margin-right:10px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff}.rule .icon::before{content:"!";display:block}.rule:not(.valid) .icon{background-color:red;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.rule.valid{color:green}.rule.valid .icon{background-color:green;clip-path:circle(50%)}.rule.valid .icon::before{content:"✓"}