.swipe-fan{--swipe-fan-size:308;--swipe-fan-card:calc(var(--swipe-fan-size) * 1px);--swipe-fan-unit:calc(var(--swipe-fan-size) / 308);position:relative;width:calc(var(--swipe-fan-card) * 2.176);height:calc(var(--swipe-fan-card) * 1.623);max-width:100%}@media (max-width:1279px){.swipe-fan{--swipe-fan-size:240}}@media (max-width:640px){.swipe-fan{--swipe-fan-size:175}}.swipe-fan-card{position:absolute;top:50%;left:50%;width:var(--swipe-fan-card);height:calc(var(--swipe-fan-card) * 435 / 308);overflow:hidden;border:3px solid #f5f5f5;border-radius:10px;background-color:#000}.swipe-fan-card-left{z-index:1;transform:translate(calc(-50% - var(--swipe-fan-card) * .422),-50%) rotate(-15deg)}.swipe-fan-card-right{z-index:2;transform:translate(calc(-50% + var(--swipe-fan-card) * .422),-50%) rotate(15deg)}.swipe-fan-card-front{z-index:3;transform:translate(calc(-50% - var(--swipe-fan-card) * .0294),calc(-50% - var(--swipe-fan-card) * .0598))}.swipe-fan-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.swipe-fan-gradient{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.4) 0,rgba(102,102,102,0))}.swipe-fan-badge{position:absolute;top:calc(19px * var(--swipe-fan-unit));left:calc(20px * var(--swipe-fan-unit));padding:0 calc(12px * var(--swipe-fan-unit));border-radius:calc(5px * var(--swipe-fan-unit));background-color:#000;color:#fff;font-size:calc(12px * var(--swipe-fan-unit));font-weight:600;line-height:calc(24px * var(--swipe-fan-unit))}.swipe-fan-like{position:absolute;top:calc(20px * var(--swipe-fan-unit));right:calc(22px * var(--swipe-fan-unit));display:flex;color:#fff}.swipe-fan-like svg{width:calc(22px * var(--swipe-fan-unit));height:calc(22px * var(--swipe-fan-unit))}.swipe-fan-rating svg{width:calc(15px * var(--swipe-fan-unit));height:calc(15px * var(--swipe-fan-unit));flex:none}.swipe-fan-body{position:absolute;right:0;bottom:0;left:0;display:flex;flex-direction:column;gap:calc(4px * var(--swipe-fan-unit));padding:calc(13px * var(--swipe-fan-unit));padding-bottom:calc(24px * var(--swipe-fan-unit));color:#fff}.swipe-fan-head{display:flex;align-items:center;justify-content:space-between;gap:calc(8px * var(--swipe-fan-unit))}.swipe-fan-rating{display:flex;align-items:center;gap:calc(3px * var(--swipe-fan-unit));font-size:calc(13px * var(--swipe-fan-unit));line-height:calc(24px * var(--swipe-fan-unit))}.swipe-fan-city,.swipe-fan-tag{font-size:calc(12px * var(--swipe-fan-unit));font-weight:500;line-height:calc(16px * var(--swipe-fan-unit))}.swipe-fan-name{font-size:calc(18px * var(--swipe-fan-unit));font-weight:700;line-height:calc(28px * var(--swipe-fan-unit))}.swipe-fan-price{margin-top:calc(4px * var(--swipe-fan-unit));font-size:calc(16px * var(--swipe-fan-unit));font-weight:700;line-height:calc(16px * var(--swipe-fan-unit))}