.sr-contrast{background:#fff;border-radius:18px;box-shadow:0 24px 60px -34px rgba(4,16,10,.6);padding:clamp(20px,3vw,30px)}.sr-contrast__controls{align-items:flex-end;display:flex;flex-wrap:wrap;gap:16px}.sr-contrast__field{display:flex;flex-direction:column;gap:6px}.sr-contrast__lab{color:#546b5b;font-family:var(--mono,"JetBrains Mono",monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase}.sr-contrast__field input[type=color]{background:#fff;border:1px solid rgba(12,33,20,.18);border-radius:10px;cursor:pointer;height:42px;padding:4px;width:72px}.sr-contrast__swap{background:#f1efe8;border:1px solid rgba(12,33,20,.14);border-radius:999px;color:#0c2114;cursor:pointer;font-family:var(--head,"Poppins",sans-serif);font-size:.9rem;font-weight:600;margin-left:auto;padding:9px 16px;transition:background .2s ease}.sr-contrast__swap:hover{background:#e6e3d8}.sr-contrast__preview{border:1px solid rgba(12,33,20,.1);border-radius:14px;margin:18px 0;padding:22px;transition:background .15s ease,color .15s ease}.sr-contrast__sample{margin:0}.sr-contrast__sample--lg{font-family:var(--head,"Poppins",sans-serif);font-size:1.7rem;font-weight:700;line-height:1.2}.sr-contrast__sample--sm{font-size:.95rem;line-height:1.5;margin-top:8px}.sr-contrast__out{align-items:center;display:flex;flex-wrap:wrap;gap:18px}.sr-contrast__ratio{align-items:baseline;color:#0c2114;display:flex;font-family:var(--head,"Poppins",sans-serif);font-weight:700}.sr-contrast__num{font-size:2.4rem;font-variant-numeric:tabular-nums;line-height:1}.sr-contrast__suffix{color:#546b5b;font-size:1rem;margin-left:4px}.sr-contrast__badges{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}.sr-contrast__badge{align-items:center;background:#f1efe8;border-radius:999px;color:#546b5b;display:inline-flex;font-size:.82rem;font-weight:600;gap:7px;padding:6px 12px}.sr-contrast__mark{background:#c7c4ba;border-radius:50%;display:inline-block;flex:none;height:14px;position:relative;width:14px}.sr-contrast__badge.is-pass{background:rgba(33,199,0,.14);color:#1c5b3a}.sr-contrast__badge.is-pass .sr-contrast__mark{background:#21c700}.sr-contrast__badge.is-pass .sr-contrast__mark:after{border:solid #fff;border-width:0 2px 2px 0;content:"";height:8px;left:4px;position:absolute;top:1.5px;transform:rotate(45deg);width:4px}.sr-contrast__badge.is-fail{background:rgba(255,126,58,.12);color:#8a3b2a}.sr-contrast__badge.is-fail .sr-contrast__mark{background:#e06a3a}@media (max-width:560px){.sr-contrast__sample--lg{font-size:1.3rem}.sr-contrast__num{font-size:1.9rem}}