:root .sig.sig--vis-review { container-type: inline-size; min-height: 460px; text-align: left; }
:root .sig--vis-review svg { display: block; }
:root .sig--vis-review .vr, :root .sig--vis-review.vr { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 0; }
:root .sig--vis-review .vr::before, :root .sig--vis-review.vr::before { content: ""; position: absolute; left: 6%; right: 6%; bottom: 13%; height: 1px; background: linear-gradient(90deg, transparent, rgba(227, 184, 255, .25), transparent); }
:root .sig--vis-review .vr__stand, :root .sig--vis-review.vr__stand { position: relative; z-index: 1; width: clamp(136px, 33cqw, 226px); margin-right: -4cqw; transform: perspective(900px) rotateY(16deg) translateY(10px); transform-origin: 50% 100%; }
:root .sig--vis-review .vr__card, :root .sig--vis-review.vr__card { display: grid; gap: 6px; justify-items: center; padding: 18px 14px 16px; border-radius: 16px 16px 6px 6px; background: linear-gradient(170deg, #f7efff, #eadcf8); color: #2a0a45; text-align: center; box-shadow: 0 30px 50px -24px rgba(0, 0, 0, .9); }
:root .sig--vis-review .vr__card b, :root .sig--vis-review.vr__card b { font: 600 clamp(13px, 2.6cqw, 16px)/1.15 var(--f-display); letter-spacing: -.02em; }
:root .sig--vis-review .vr__card small, :root .sig--vis-review.vr__card small { font: 400 11px/1.3 var(--f-body); color: #4f3a63; }
:root .sig--vis-review .vr__card .vr__qr, :root .sig--vis-review.vr__card .vr__qr { width: 74%; margin: 6px 0 4px; border-radius: 6px; }
:root .sig--vis-review .vr__brand, :root .sig--vis-review.vr__brand { font: 600 11px/1 var(--f-display); color: #6a00c9; letter-spacing: .02em; }
:root .sig--vis-review .vr__foot, :root .sig--vis-review.vr__foot { height: 10px; margin: 0 12%; border-radius: 0 0 8px 8px; background: #b9a3cf; }
:root .sig--vis-review .vr__phone, :root .sig--vis-review.vr__phone { position: relative; z-index: 2; height: 86%; max-height: 440px; aspect-ratio: 9 / 18.5; padding: 8px; border-radius: 30px; background: #0e0c11; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12) inset, 0 40px 70px -26px rgba(0, 0, 0, .95); opacity: 0; transform: translate(60px, 24px) rotate(9deg); transition: transform 1.1s var(--ease-out), opacity .5s; }
:root .sig--vis-review .is-in .vr__phone, :root .sig--vis-review.is-in .vr__phone { opacity: 1; transform: rotate(-3deg); }
:root .sig--vis-review .vr__scr, :root .sig--vis-review.vr__scr { position: relative; height: 100%; border-radius: 23px; overflow: hidden; background: #26222b; }
:root .sig--vis-review .vr__cam, :root .sig--vis-review.vr__cam { position: absolute; inset: 0; display: grid; place-items: center; background: radial-gradient(80% 60% at 50% 45%, #3a3346, #17141b); }
:root .sig--vis-review .vr__view, :root .sig--vis-review.vr__view { width: 58%; padding: 8%; border-radius: 10px; background: #efe6f7; filter: blur(3px); transform: scale(.92) rotate(-4deg); transition: filter .6s, transform .8s var(--ease-out); }
:root .sig--vis-review .vr__view .vr__qr, :root .sig--vis-review.vr__view .vr__qr { width: 100%; }
:root .sig--vis-review .is-lock .vr__view, :root .sig--vis-review.is-lock .vr__view { filter: none; transform: none; }
:root .sig--vis-review .vr__c, :root .sig--vis-review.vr__c { position: absolute; width: 22px; height: 22px; border: 2.5px solid rgba(255, 255, 255, .7); transition: all .7s var(--ease-out); }
:root .sig--vis-review .vr__c--1, :root .sig--vis-review.vr__c--1 { left: 14%; top: 26%; border-width: 2.5px 0 0 2.5px; border-radius: 8px 0 0 0; }
:root .sig--vis-review .vr__c--2, :root .sig--vis-review.vr__c--2 { right: 14%; top: 26%; border-width: 2.5px 2.5px 0 0; border-radius: 0 8px 0 0; }
:root .sig--vis-review .vr__c--3, :root .sig--vis-review.vr__c--3 { left: 14%; bottom: 26%; border-width: 0 0 2.5px 2.5px; border-radius: 0 0 0 8px; }
:root .sig--vis-review .vr__c--4, :root .sig--vis-review.vr__c--4 { right: 14%; bottom: 26%; border-width: 0 2.5px 2.5px 0; border-radius: 0 0 8px 0; }
:root .sig--vis-review .is-lock .vr__c, :root .sig--vis-review.is-lock .vr__c { border-color: #c06bff; }
:root .sig--vis-review .is-lock .vr__c--1, :root .sig--vis-review.is-lock .vr__c--1 { left: 18%; top: 31%; }
:root .sig--vis-review .is-lock .vr__c--2, :root .sig--vis-review.is-lock .vr__c--2 { right: 18%; top: 31%; }
:root .sig--vis-review .is-lock .vr__c--3, :root .sig--vis-review.is-lock .vr__c--3 { left: 18%; bottom: 31%; }
:root .sig--vis-review .is-lock .vr__c--4, :root .sig--vis-review.is-lock .vr__c--4 { right: 18%; bottom: 31%; }
:root .sig--vis-review .vr__scan, :root .sig--vis-review.vr__scan { position: absolute; left: 16%; right: 16%; top: 28%; height: 2px; border-radius: 2px; background: #c06bff; box-shadow: none; opacity: 0; }
:root .sig--vis-review .is-scan .vr__scan, :root .sig--vis-review.is-scan .vr__scan { opacity: 1; animation: vrScan 1.4s ease-in-out infinite alternate; }
:root .sig--vis-review .is-lock .vr__scan, :root .sig--vis-review.is-lock .vr__scan { opacity: 0; animation: none; }
@keyframes vrScan{ to { top: 70%; } }
:root .sig--vis-review .vr__pill, :root .sig--vis-review.vr__pill { position: absolute; left: 50%; bottom: 11%; padding: 8px 12px; border-radius: 999px; background: #fff; color: #3b0066; font: 600 10.5px/1 var(--f-display); white-space: nowrap; opacity: 0; transform: translate(-50%, 12px); transition: opacity .4s, transform .6s var(--ease-back); }
:root .sig--vis-review .is-lock .vr__pill, :root .sig--vis-review.is-lock .vr__pill { opacity: 1; transform: translate(-50%, 0); }
:root .sig--vis-review .vr__form, :root .sig--vis-review.vr__form { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 12px; padding: 30px 14px 16px; background: #fbf8fe; color: #1d1a22; transform: translateY(100%); transition: transform .8s var(--ease-out); }
:root .sig--vis-review .is-form .vr__form, :root .sig--vis-review.is-form .vr__form { transform: none; }
:root .sig--vis-review .vr__bh, :root .sig--vis-review.vr__bh { display: flex; gap: 9px; align-items: center; }
:root .sig--vis-review .vr__logo, :root .sig--vis-review.vr__logo { width: 32px; height: 32px; flex: none; border-radius: 10px; display: grid; place-items: center; background: linear-gradient(135deg, #a100ff, #5b00a8); color: #fff; font: 600 11px/1 var(--f-display); }
:root .sig--vis-review .vr__bh b, :root .sig--vis-review.vr__bh b { display: block; font: 600 13px/1.15 var(--f-display); }
:root .sig--vis-review .vr__bh small, :root .sig--vis-review.vr__bh small { font: 400 10.5px/1.2 var(--f-body); color: #5b5363; }
:root .sig--vis-review .vr__stars, :root .sig--vis-review.vr__stars { display: flex; justify-content: center; gap: 4px; margin-top: 4px; }
:root .sig--vis-review .vr__stars svg, :root .sig--vis-review.vr__stars svg { width: clamp(22px, 5cqw, 28px); height: auto; fill: transparent; stroke: #bfb0cc; stroke-width: 1.5; stroke-linejoin: round; transition: fill .3s, stroke .3s, transform .45s var(--ease-back); }
:root .sig--vis-review .vr__stars svg.on, :root .sig--vis-review.vr__stars svg.on { fill: #a100ff; stroke: #8b00e0; transform: scale(1.18); }
:root .sig--vis-review .vr__txt, :root .sig--vis-review.vr__txt { min-height: 74px; margin: 0; padding: 10px; border-radius: 12px; border: 1px solid #e2d8ec; background: #fff; font: 400 11.5px/1.45 var(--f-body); color: #2c2533; }
:root .sig--vis-review .vr__txt i, :root .sig--vis-review.vr__txt i { display: inline-block; width: 1.5px; height: 12px; margin-left: 1px; vertical-align: -2px; background: #a100ff; opacity: 0; }
:root .sig--vis-review .is-typing .vr__txt i, :root .sig--vis-review.is-typing .vr__txt i { opacity: 1; animation: vrBlink .8s steps(2) infinite; }
@keyframes vrBlink{ 50% { opacity: 0; } }
:root .sig--vis-review .vr__btn, :root .sig--vis-review.vr__btn { align-self: flex-end; margin-top: auto; padding: 9px 16px; border-radius: 999px; background: #a100ff; color: #fff; font: 600 11.5px/1 var(--f-display); transition: transform .2s; }
:root .sig--vis-review .vr__btn.press, :root .sig--vis-review.vr__btn.press { transform: scale(.9); }
:root .sig--vis-review .vr__done, :root .sig--vis-review.vr__done { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 10px; padding: 30px 14px 16px; background: #fbf8fe; opacity: 0; transform: translateY(16px); transition: opacity .5s, transform .7s var(--ease-out); }
:root .sig--vis-review .is-done .vr__done, :root .sig--vis-review.is-done .vr__done { opacity: 1; transform: none; }
:root .sig--vis-review .vr__rv, :root .sig--vis-review.vr__rv { display: flex; gap: 8px; align-items: center; }
:root .sig--vis-review .vr__av, :root .sig--vis-review.vr__av { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #e7dcf2; color: #4a2a6a; font: 600 11px/1 var(--f-display); }
:root .sig--vis-review .vr__rv b, :root .sig--vis-review.vr__rv b { font: 600 11.5px/1.2 var(--f-display); }
:root .sig--vis-review .vr__mini, :root .sig--vis-review.vr__mini { display: flex; gap: 1px; margin-top: 2px; }
:root .sig--vis-review .vr__mini svg, :root .sig--vis-review.vr__mini svg { width: 11px; height: 11px; fill: #a100ff; stroke: #8b00e0; stroke-width: 1.5; }
:root .sig--vis-review .vr__rt, :root .sig--vis-review.vr__rt { margin: 0; font: 400 11.5px/1.45 var(--f-body); color: #2c2533; }
:root .sig--vis-review .vr__ans, :root .sig--vis-review.vr__ans { display: flex; gap: 8px; margin-top: 4px; padding: 10px; border-radius: 12px; background: #f1e7fb; opacity: 0; transform: translateY(10px); transition: opacity .5s, transform .7s var(--ease-out); }
:root .sig--vis-review .is-ans .vr__ans, :root .sig--vis-review.is-ans .vr__ans { opacity: 1; transform: none; }
:root .sig--vis-review .vr__ans > span, :root .sig--vis-review.vr__ans > span { width: 18px; height: 18px; flex: none; color: #6a00c9; }
:root .sig--vis-review .vr__ans svg, :root .sig--vis-review.vr__ans svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
:root .sig--vis-review .vr__ans b, :root .sig--vis-review.vr__ans b { display: block; font: 600 10.5px/1.2 var(--f-display); color: #4a2a6a; }
:root .sig--vis-review .vr__ans p, :root .sig--vis-review.vr__ans p { margin: 3px 0 0; font: 400 11px/1.4 var(--f-body); color: #2c2533; min-height: 1.4em; }
:root .sig--vis-review .vr__tap, :root .sig--vis-review.vr__tap { position: absolute; z-index: 5; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; background: rgba(255, 255, 255, .5); opacity: 0; pointer-events: none; }
:root .sig--vis-review .vr__tap.go, :root .sig--vis-review.vr__tap.go { animation: vrTap .55s ease-out; }
@keyframes vrTap{ 0% { opacity: .9; transform: scale(.4); } 100% { opacity: 0; transform: scale(1.5); } }
:root .sig--vis-review .is-out .vr__phone, :root .sig--vis-review.is-out .vr__phone { opacity: 0; transform: translate(40px, 10px) rotate(6deg); transition: opacity .5s, transform .7s; }
:root .sig--vis-review .vr__ok, :root .sig--vis-review.vr__ok { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px 6px 7px; border-radius: 999px; background: #e9f6ee; color: #17663a; font: 600 10.5px/1 var(--f-display); }
:root .sig--vis-review .vr__ok svg, :root .sig--vis-review.vr__ok svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
@media (prefers-reduced-motion: reduce){:root .sig--vis-review .vr__scan, :root .sig--vis-review.vr__scan, :root .sig--vis-review .vr__txt i, :root .sig--vis-review.vr__txt i { animation: none !important; }
 }