.viva-tryon{padding-block:clamp(1.75rem,4vw,3.25rem) clamp(2.5rem,6vw,5rem)}.viva-tryon__head{display:grid;gap:.65rem;max-width:46rem;margin-bottom:clamp(1.75rem,4vw,3rem)}.viva-tryon__title{font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:1.05}.viva-tryon__lede{color:var(--viva-color-ink-soft)}.viva-tryon__flow{display:grid;grid-template-columns:minmax(0,24rem) minmax(0,1fr);gap:clamp(1.5rem,3.5vw,3rem);align-items:start}.viva-tryon__dropzone[hidden],.viva-tryon__preview[hidden]{display:none}.viva-tryon__preview{--tryon-compare-pos: 54%;position:relative;margin:0;overflow:hidden;aspect-ratio:4 / 5;border-radius:var(--viva-radius-panel);background:var(--viva-color-surface-muted)}.viva-tryon__preview-img{display:block;width:100%;height:100%;object-fit:cover}.viva-tryon__preview-img--overlay{position:absolute;top:0;right:0;bottom:0;left:0;clip-path:inset(0 0 0 var(--tryon-compare-pos))}.viva-tryon__preview.is-compare-active .viva-tryon__preview-img--overlay[hidden]{display:block}.viva-tryon__compare-slider{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}.viva-tryon__compare-slider[hidden],.viva-tryon__compare-divider[hidden],.viva-tryon__compare-label[hidden]{display:none}.viva-tryon__compare-divider{position:absolute;top:0;bottom:0;left:var(--tryon-compare-pos);z-index:3;width:1px;transform:translate(-50%);background:#ffffffeb;box-shadow:0 0 0 1px #11121614}.viva-tryon__compare-handle{position:absolute;left:50%;top:50%;width:2.8rem;height:2.8rem;border-radius:999px;transform:translate(-50%,-50%);background:#111216eb;border:2px solid rgba(255,255,255,.95);box-shadow:0 12px 24px #11121633}.viva-tryon__compare-handle:before,.viva-tryon__compare-handle:after{content:"";position:absolute;top:50%;width:.45rem;height:.45rem;border-top:2px solid rgba(255,255,255,.95);border-right:2px solid rgba(255,255,255,.95)}.viva-tryon__compare-handle:before{left:.8rem;transform:translateY(-50%) rotate(-135deg)}.viva-tryon__compare-handle:after{right:.8rem;transform:translateY(-50%) rotate(45deg)}.viva-tryon__compare-label{position:absolute;z-index:2;bottom:3.85rem;padding:.45rem .7rem;border-radius:var(--viva-radius-chip);background:#111216bf;color:#fffffff5;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.viva-tryon__compare-label--before{left:.75rem}.viva-tryon__compare-label--after{right:.75rem}.viva-tryon__preview-note{position:absolute;z-index:2;top:.75rem;left:.75rem;right:.75rem;padding:.4rem .65rem;border-radius:var(--viva-radius-chip);background:#111216b8;color:#fffffff5;font-size:.74rem;font-weight:600;letter-spacing:.04em}.viva-tryon__stage-actions{display:flex;justify-content:center;margin-top:.85rem}.viva-tryon__stage-change[hidden]{display:none}.viva-tryon__dropzone{position:relative;display:grid;align-content:center;justify-items:center;gap:.55rem;min-height:15rem;padding:clamp(1.5rem,3vw,2.25rem) clamp(1.25rem,3vw,2rem);text-align:center;border:1.5px dashed var(--viva-color-strong-line);border-radius:var(--viva-radius-panel);background:var(--viva-color-surface-muted);transition:border-color .18s ease,background .18s ease}.viva-tryon__dropzone.is-dragover{border-color:var(--viva-color-accent);background:#c9a7841f}.viva-tryon__dropzone.is-loaded{border-style:solid;border-color:var(--viva-color-accent-soft)}.viva-tryon__dropzone-icon{display:grid;place-items:center;width:3rem;height:3rem;border-radius:999px;color:var(--viva-color-accent);background:#c9a78429}.viva-tryon__dropzone-icon svg{width:1.5rem;height:1.5rem}.viva-tryon__dropzone-title{font-family:var(--viva-font-display);font-size:clamp(1.2rem,2.2vw,1.55rem);line-height:1.1}.viva-tryon__dropzone-copy{max-width:32rem;color:var(--viva-color-ink-soft)}.viva-tryon__upload{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:.5rem}.viva-tryon__upload-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;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-tryon__upload-btn:hover{border-color:var(--viva-color-accent);color:var(--viva-color-accent)}.viva-tryon__upload-btn svg{width:1.15rem;height:1.15rem}.viva-tryon__notice{margin:0;padding:.7rem .9rem;font-size:.9rem;color:var(--viva-color-ink);background:#c9a78424;border:1px solid var(--viva-color-accent-soft);border-radius:var(--viva-radius-chip)}.viva-tryon__notice[hidden]{display:none}.viva-tryon__camera{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border-radius:var(--viva-radius-panel);background:#000}.viva-tryon__camera[hidden]{display:none}.viva-tryon__camera-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.viva-tryon__camera-actions{position:relative;z-index:1;display:flex;gap:.5rem;justify-content:center;padding:.85rem;background:linear-gradient(to top,rgba(0,0,0,.55),transparent)}.viva-tryon__suggest{display:grid;gap:.7rem;align-content:start}.viva-tryon__picker{display:grid;gap:.7rem}.viva-tryon__picker[hidden]{display:none}.viva-tryon__suggest-title{font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.08}.viva-tryon__suggest-status{color:var(--viva-color-ink-soft)}.viva-tryon__suggest-status[hidden]{display:none}.viva-tryon__loader{position:absolute;top:0;right:0;bottom:0;left:0;display:none;place-items:center;background:#1112165c;pointer-events:none}.viva-tryon__preview.is-busy .viva-tryon__loader{display:grid}.viva-tryon__loader-mark{grid-area:1 / 1;font-family:var(--viva-font-display);font-weight:700;font-size:clamp(2.1rem,7vw,3.1rem);letter-spacing:.2em;text-indent:.2em;color:#fff;opacity:0;animation:viva-tryon-vivamark 2s ease-in-out infinite}.viva-tryon__loader-mark:nth-child(2){animation-delay:1s}@keyframes viva-tryon-vivamark{0%{opacity:0;transform:translateY(.22em)}9%,41%{opacity:1;transform:translateY(0)}50%,to{opacity:0;transform:translateY(-.22em)}}@media(prefers-reduced-motion:reduce){.viva-tryon__loader-mark{animation-duration:3.6s}}.viva-tryon__suggest-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(4.25rem,1fr));gap:.4rem;max-width:26rem;margin:.2rem 0 0;padding:0;list-style:none}.viva-tryon__suggest-list[hidden]{display:none}.viva-tryon__suggest-item{display:grid;justify-items:center;gap:.3rem;width:100%;padding:.45rem .25rem;text-align:center;color:inherit;background:transparent;border:0;border-radius:var(--viva-radius-chip);cursor:pointer}.viva-tryon__suggest-swatch{width:2.5rem;height:2.5rem;overflow:hidden;border-radius:999px;box-shadow:inset 0 0 0 1px #11121614;transition:box-shadow .16s ease}.viva-tryon__suggest-item:hover .viva-tryon__suggest-swatch{box-shadow:inset 0 0 0 1px #11121614,0 0 0 1px var(--viva-color-strong-line)}.viva-tryon__suggest-item.is-selected .viva-tryon__suggest-swatch{box-shadow:0 0 0 2px var(--viva-color-surface),0 0 0 4px var(--viva-color-accent)}.viva-tryon__suggest-swatch img{width:100%;height:100%;object-fit:cover}.viva-tryon__suggest-code{font-family:var(--viva-font-body);font-weight:700;font-size:.8rem;letter-spacing:.02em}.viva-tryon__suggest-item.is-selected .viva-tryon__suggest-code{color:var(--viva-color-accent)}.viva-tryon__suggest-name,.viva-tryon__suggest-check,.viva-tryon__types[hidden]{display:none}.viva-tryon__types{margin-top:.3rem}.viva-tryon__types-label{margin:0 0 .45rem;font-size:.85rem;color:var(--viva-color-ink-soft)}.viva-tryon__types-list{display:flex;flex-wrap:wrap;gap:.45rem}.viva-tryon__type{padding:.45rem .85rem;font-family:var(--viva-font-body);font-size:.9rem;color:var(--viva-color-ink);background:var(--viva-color-surface);border:1px solid var(--viva-color-line);border-radius:var(--viva-radius-pill);cursor:pointer;transition:border-color .16s ease,color .16s ease,background .16s ease}.viva-tryon__type:hover{border-color:var(--viva-color-strong-line)}.viva-tryon__type.is-selected{color:#fff;background:var(--viva-color-ink);border-color:var(--viva-color-ink)}.viva-tryon__suggest-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.4rem}.viva-tryon__order[hidden]{display:none}.viva-tryon__suggest-help{margin-top:.2rem;font-size:.9rem;color:var(--viva-color-ink-soft)}.viva-tryon__suggest-help .viva-link{color:var(--viva-color-accent)}@media(max-width:749px){.viva-tryon__flow{grid-template-columns:1fr}.viva-tryon__stage{max-width:24rem}}@media(prefers-reduced-motion:reduce){.viva-tryon__dropzone,.viva-tryon__suggest-item,.viva-tryon__suggest-check,.viva-tryon__stage-change{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/1/assets/viva-tryon.css.map */