.cinema-operation{height:68px;margin-top:19px;padding:12px 14px;background:#ffffff07;border:1px solid #ffffff14;border-radius:11px;box-sizing:border-box;overflow:hidden}
.cinema-operation>div{height:100%;display:flex;align-items:center;gap:14px}.cinema-operation span,.cinema-operation b,.cinema-operation strong{line-height:1.3}.cinema-operation em,.cinema-operation i{font-style:normal}.cinema-ticket>span{font-size:11px;letter-spacing:2px;color:#abd4f9}.cinema-ticket>span>b{font-size:10px;letter-spacing:1px;color:#fff}.cinema-barcode{flex:1;height:32px;position:relative;background:repeating-linear-gradient(90deg,#e3edff 0 2px,transparent 2px 4px,#e3edff 4px 5px,transparent 5px 8px,#e3edff 8px 11px,transparent 11px 15px);opacity:.7}.cinema-barcode>i{position:absolute;left:0;right:0;top:-2px;height:2px;background:#83ffdf;box-shadow:0 0 10px #83ffdf;opacity:0}.ticket-ok{width:20px;color:#7ae1c0;opacity:0;transform:scale(.5);transition:.5s}.cinema-stage[data-phase="1"] .cinema-barcode>i{opacity:1;animation:cinema-scan .85s ease-in-out infinite alternate}.cinema-stage[data-phase="2"] .ticket-ok{opacity:1;transform:scale(1)}
.cinema-order>img{width:48px;height:45px;object-fit:contain}.cinema-order>span{font-size:11px;color:#c6d5e9;flex:1}.cinema-order b{font-size:17px;display:block;color:#fff;margin-top:3px}.order-seal{border:1px solid #68cca55c;border-radius:50%;color:#85e0bf;width:23px;height:23px;text-align:center;line-height:23px;opacity:0;transform:translateY(12px);transition:.6s}.cinema-stage[data-phase="2"] .order-seal{opacity:1;transform:none}.cinema-stage[data-phase="1"] .cinema-order>img{animation:cinema-pack 1s ease-in-out infinite alternate}
.cinema-wallet{position:relative;flex-wrap:wrap;gap:2px!important}.cinema-wallet>span{font-size:11px;color:#a7bdd7;width:100%}.cinema-wallet>strong{display:block;position:relative;height:25px;width:140px;font-size:20px;overflow:hidden}.cinema-wallet strong>i{position:absolute;left:0;top:0;transition:transform .7s,opacity .7s}.wallet-after{transform:translateY(27px);opacity:0}.cinema-wallet>b{position:absolute;right:0;bottom:3px;font-size:13px;color:#84dfba;opacity:.35;transition:opacity .7s,transform .7s;transform:translateY(5px)}.cinema-stage[data-phase="2"] .wallet-before{transform:translateY(-27px);opacity:0}.cinema-stage[data-phase="2"] .wallet-after{transform:none;opacity:1}.cinema-stage[data-phase="2"] .cinema-wallet>b{opacity:1;transform:none}
.cinema-route{justify-content:space-between}.cinema-route>span{display:flex;gap:7px;align-items:center;font-size:13px;font-weight:600}.cinema-route em{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#9fc7ff22;color:#c8dfff;font-size:17px}.cinema-route>i{display:flex;gap:6px;flex:1;align-items:center;justify-content:center}.cinema-route b{height:4px;width:4px;background:#78a1d8;border-radius:50%;opacity:.3}.cinema-stage[data-phase="1"] .cinema-route b{animation:cinema-route-dot .9s infinite}.cinema-route b:nth-child(2){animation-delay:.2s!important}.cinema-route b:nth-child(3){animation-delay:.4s!important}.cinema-stage[data-phase="2"] .cinema-route b{opacity:1;background:#7adeb9}
.cinema-renewal>strong{font-size:15px;letter-spacing:1px;padding:7px;border:1px solid #9cbde644;border-radius:7px}.cinema-renewal>div{flex:1}.cinema-renewal span{display:block;font-size:11px;color:#bfd1e8;margin-bottom:7px}.cinema-renewal i{display:block;height:3px;background:#9bbee420;border-radius:3px;overflow:hidden}.cinema-renewal i>b{display:block;width:30%;height:100%;background:#91caff;transition:width 1.2s}.cinema-renewal>em{font-size:23px;color:#9cd2f7}.cinema-stage[data-phase="1"] .cinema-renewal>em{animation:cinema-spin 1.3s linear infinite}.cinema-stage[data-phase="2"] .cinema-renewal i>b{width:100%;background:#74d4b1}
.cinema-enrolment>span{font-size:8px;letter-spacing:1px;color:#a8c6e6;text-align:center;border-right:1px solid #a7c5e233;padding-right:12px}.cinema-enrolment>span>b{font-size:25px;display:block;color:#fff}.cinema-enrolment>div{flex:1}.cinema-enrolment strong{display:block;font-size:12px;font-weight:500;margin-bottom:8px}.cinema-enrolment i{display:inline-block;width:18%;height:3px;margin-right:5px;background:#bed7ff26;transition:background .5s}.cinema-enrolment>em{font-size:24px;color:#84d8b8;opacity:0;transform:scale(.4);transition:transform .5s,opacity .5s}.cinema-stage[data-phase="1"] .cinema-enrolment i{animation:cinema-route-dot .8s infinite}.cinema-stage[data-phase="2"] .cinema-enrolment i{background:#84d8b8}.cinema-stage[data-phase="2"] .cinema-enrolment>em{opacity:1;transform:none}
.cinema-invoice>span{width:23px;height:29px;border:1px solid #b6cef157;border-radius:3px;display:flex;flex-direction:column;padding:7px 4px;gap:4px;box-sizing:border-box}.cinema-invoice>span>i{height:1px;width:100%;background:#b7d2f2}.cinema-invoice>div{flex:1}.cinema-invoice small{display:block;font-size:11px;color:#aec8e8}.cinema-invoice strong{display:block;font-size:18px;font-weight:500}.invoice-paid{font-size:10px;letter-spacing:1px;color:#94e2c6;padding:5px;border:1px solid #94e2c655;border-radius:4px;opacity:0;transform:scale(1.3) rotate(-7deg);transition:.45s}.cinema-stage[data-phase="2"] .invoice-paid{opacity:1;transform:scale(1) rotate(-7deg)}
@keyframes cinema-scan{to{transform:translateY(33px)}}@keyframes cinema-pack{to{transform:translateX(7px) rotate(-4deg)}}@keyframes cinema-route-dot{50%{opacity:1;transform:scale(1.4)}}
@media(prefers-reduced-motion:reduce){.cinema-operation *{animation:none!important;transition:none!important}}
.cinema-transaction{padding:20px}.cinema-demo-label{margin-bottom:14px}.cinema-progress{display:none}.cinema-operation{height:60px;margin-top:14px;padding-block:8px}.cinema-status{min-height:21px;margin:14px 0 13px}.cinema-demo-note{margin-top:10px}.cinema-stage{min-height:760px}
@media(max-width:1100px){.cinema-stage{min-height:700px}}
@media(max-width:760px){.cinema-stage{min-height:0}.cinema-transaction{padding:22px}.cinema-operation{height:68px;padding-block:12px}.cinema-status{font-size:13px}.cinema-description{font-size:14px!important}.cinema-demo-label{font-size:11px}}