.comparison-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;background:#000000f2;z-index:100;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.comparison-overlay.active{opacity:1;visibility:visible}.comparison-panel{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .2s ease}.comparison-panel:active{transform:scale(.98)}.comparison-image{max-width:100%;max-height:70%;object-fit:contain;border-radius:8px;box-shadow:0 4px 20px #0000004d;will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.comparison-label{position:absolute;bottom:1rem;padding:.5rem 1rem;background:#000000b3;color:#fff;border-radius:20px;font-size:.875rem;font-weight:500;letter-spacing:.5px;text-transform:uppercase}.comparison-current .comparison-label{background:rgba(var(--color-foreground),.9);color:rgb(var(--color-background))}.comparison-alternative .comparison-label{background:rgba(var(--color-button),.9);color:rgb(var(--color-button-text))}.comparison-divider{position:absolute;left:50%;top:10%;bottom:10%;width:2px;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.2) 20%,rgba(255,255,255,.2) 80%,transparent);transform:translate(-50%);pointer-events:none}.comparison-instructions{position:absolute;top:1rem;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:.75rem 1.5rem;border-radius:25px;font-size:.875rem;text-align:center;z-index:101;opacity:0;transition:opacity .3s ease .5s;white-space:nowrap}.comparison-overlay.active .comparison-instructions{opacity:1}.effect-btn{position:relative;user-select:none;-webkit-user-select:none}.effect-btn.long-press-active:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;transform:translate(-50%,-50%) scale(0);background:rgba(var(--color-button),.2);border-radius:inherit;animation:longPressIndicator .5s ease-out forwards}@keyframes longPressIndicator{to{transform:translate(-50%,-50%) scale(1.2);opacity:0}}.swipe-hint{position:absolute;right:2rem;top:50%;transform:translateY(-50%);opacity:0;animation:swipeHint 2s ease-out 1s;pointer-events:none}@keyframes swipeHint{0%,to{opacity:0;transform:translateY(-50%) translate(0)}20%,80%{opacity:1}50%{transform:translateY(-50%) translate(-20px)}}@media (max-width: 768px){.comparison-panel{min-height:200px}.comparison-label{font-size:.75rem;padding:.4rem .8rem}.comparison-instructions{font-size:.75rem;padding:.5rem 1rem}.comparison-panel{min-width:44px;min-height:44px}}@media (min-width: 769px){.comparison-overlay{border-radius:12px}.comparison-panel:hover{background:#ffffff05}.comparison-image{max-height:80%;transition:transform .2s ease}.comparison-panel:hover .comparison-image{transform:scale(1.02)}.comparison-instructions{font-size:1rem}}@media (prefers-reduced-motion: reduce){.comparison-overlay,.comparison-panel,.comparison-image{transition:none}@keyframes swipeHint{0%,to{opacity:0}}}@media (prefers-contrast: high){.comparison-divider{background:#fff;width:3px}.comparison-label{border:2px solid white}}@media (prefers-color-scheme: dark){.comparison-overlay{background:#000000fa}}.comparison-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:#fffc;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
/*# sourceMappingURL=/cdn/shop/t/58/assets/effect-comparison.css.map */
