.viva-cmatch{padding-block:clamp(1.75rem,4vw,3.25rem) clamp(2.5rem,6vw,5rem)}.viva-cmatch__head{display:grid;gap:.65rem;max-width:46rem;margin-bottom:clamp(1.75rem,4vw,2.75rem)}.viva-cmatch__title{font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:1.05}.viva-cmatch__lede{color:var(--viva-color-ink-soft)}.viva-cmatch__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(1rem,2.5vw,1.75rem);align-items:start}.viva-cmatch__card{position:relative;display:grid;gap:.85rem;align-content:start;padding:clamp(1.4rem,3vw,2.25rem);border:1px solid var(--viva-color-line);border-radius:var(--viva-radius-panel);background:var(--viva-color-surface)}.viva-cmatch__card--contact{background:var(--viva-color-surface-muted)}.viva-cmatch__step{display:inline-flex;width:2rem;height:2rem;align-items:center;justify-content:center;font-family:var(--viva-font-display);font-size:1.05rem;color:var(--viva-color-inverse);background:var(--viva-color-accent);border-radius:var(--viva-radius-pill)}.viva-cmatch__card-title{font-family:var(--viva-font-display);font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.1}.viva-cmatch__card-copy{color:var(--viva-color-ink-soft)}.viva-cmatch__work{display:grid;gap:clamp(1rem,2.5vw,1.75rem)}@media(min-width:750px){.viva-cmatch__work:has(.viva-cmatch__media:not([hidden])){grid-template-columns:minmax(0,13rem) minmax(0,1fr);align-items:start}}.viva-cmatch__work[hidden],.viva-cmatch__media[hidden],.viva-cmatch__pick[hidden],.viva-cmatch__chosen-actions[hidden],.viva-cmatch__flow-copy[hidden],.viva-cmatch__results[hidden]{display:none}.viva-cmatch__media{position:relative;width:100%;max-width:13rem;aspect-ratio:3 / 4}.viva-cmatch__camera,.viva-cmatch__preview{position:absolute;top:0;right:0;bottom:0;left:0;margin:0;overflow:hidden;border-radius:var(--viva-radius-panel)}.viva-cmatch__camera[hidden],.viva-cmatch__preview[hidden]{display:none}.viva-cmatch__pick{display:flex;flex-wrap:wrap;gap:.6rem}.viva-cmatch__upload-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem .9rem;font-family:var(--viva-font-body);font-size:.92rem;color:var(--viva-color-ink);background:var(--viva-color-surface);border:1px solid var(--viva-color-strong-line);border-radius:var(--viva-radius-panel);cursor:pointer;transition:border-color .18s ease,color .18s ease}.viva-cmatch__upload-btn:hover{border-color:var(--viva-color-accent);color:var(--viva-color-accent)}.viva-cmatch__upload-btn svg{width:1.1rem;height:1.1rem}.viva-cmatch__camera{z-index:2;display:flex;flex-direction:column;justify-content:flex-end;background:#000}.viva-cmatch__camera-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.viva-cmatch__camera-actions{position:relative;z-index:1;display:flex;gap:.4rem;justify-content:center;padding:.6rem;background:linear-gradient(to top,rgba(0,0,0,.6),transparent)}.viva-cmatch__preview{z-index:1;background:var(--viva-color-surface-muted)}.viva-cmatch__preview-img{display:block;width:100%;height:100%;object-fit:cover}.viva-cmatch__preview-change{position:absolute;z-index:1;bottom:.6rem;left:50%;transform:translate(-50%);padding:.4rem .85rem;font-family:var(--viva-font-body);font-size:.82rem;white-space:nowrap;color:#fff;background:#111216d1;border:0;border-radius:var(--viva-radius-pill);cursor:pointer;transition:background .18s ease}.viva-cmatch__preview-change:hover{background:#111216f2}.viva-cmatch__flow{display:grid;gap:.85rem;align-content:start}.viva-cmatch__flow-copy{margin:0;color:var(--viva-color-ink-soft)}.viva-cmatch__chosen-actions{display:grid;gap:.55rem;justify-items:start}.viva-cmatch__flow-hint{margin:0;font-size:.88rem;color:var(--viva-color-ink-soft)}.viva-cmatch__chosen-actions [data-cmatch-analyze][aria-busy=true]{display:inline-flex;align-items:center;gap:.5rem}.viva-cmatch__chosen-actions [data-cmatch-analyze][aria-busy=true]:before{content:"";width:1em;height:1em;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;opacity:.85;animation:viva-cmatch-spin .75s linear infinite}@keyframes viva-cmatch-spin{to{transform:rotate(360deg)}}.viva-cmatch__results{display:grid;gap:.85rem}.viva-cmatch__results-label{margin:0;font-family:var(--viva-font-body);font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;color:var(--viva-color-ink-soft)}.viva-cmatch__matches{display:grid;gap:.5rem;margin:0;padding:0;list-style:none}.viva-cmatch__disclaimer{font-size:.88rem;color:var(--viva-color-ink-soft)}.viva-cmatch__disclaimer .viva-link,.viva-cmatch__colors-link{color:var(--viva-color-accent)}.viva-cmatch__results-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.85rem}.viva-cmatch__restart{font-family:var(--viva-font-body);font-size:.9rem;color:var(--viva-color-ink-soft);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.viva-cmatch__restart:hover{color:var(--viva-color-ink)}@media(max-width:749px){.viva-cmatch__grid,.viva-cmatch__work{grid-template-columns:1fr}.viva-cmatch__card{padding:1.15rem}.viva-cmatch__work:has(.viva-cmatch__media:not([hidden])){grid-template-columns:1fr;gap:.9rem}.viva-cmatch__media{max-width:min(13rem,100%);margin-inline:auto}.viva-cmatch__pick{width:100%}.viva-cmatch__upload-btn{flex:1 1 calc(50% - .3rem);min-width:0}.viva-cmatch__results-actions{flex-direction:column;align-items:stretch}.viva-cmatch__results-actions .viva-button{width:100%;justify-content:center}}@media(prefers-reduced-motion:reduce){.viva-cmatch__upload-btn,.viva-cmatch__preview-change{transition:none}.viva-cmatch__chosen-actions [data-cmatch-analyze][aria-busy=true]:before{animation-duration:2.4s}}
/*# sourceMappingURL=/cdn/shop/t/1/assets/viva-color-match.css.map */