.showreel.phone-showreel{height:550px;perspective:1000px}
.phone-stage{position:absolute;inset:25px 0 32px;display:flex;align-items:center;justify-content:center;perspective:1000px}
.hero-phone{height:100%;aspect-ratio:9/17.4;padding:6px;background:linear-gradient(135deg,#adc7d0,#334551 45%,#8da5ad);border-radius:37px;position:relative;box-shadow:0 25px 60px #0009,0 0 45px #9edfeb0d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .65s cubic-bezier(.2,.7,.2,1)!important;touch-action:pan-y}
.phone-screen{position:relative;height:100%;border-radius:31px;overflow:hidden;background:#101723;isolation:isolate}
.phone-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease!important}.phone-video.is-active{opacity:1}
.phone-camera{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:65px;height:15px;border-radius:20px;background:#0b0e18;z-index:4;box-shadow:inset 0 0 0 1px #ffffff14}
.phone-shade{position:absolute;inset:65% 0 0;background:linear-gradient(transparent,#080d18d9);pointer-events:none;z-index:2}
.phone-silent{position:absolute;right:12px;top:38px;background:#0b0e1899;border:1px solid #fff3;border-radius:20px;padding:4px 7px;font-size:7px;letter-spacing:1px;z-index:3;pointer-events:none}
.phone-caption{position:absolute;bottom:25px;left:18px;right:18px;z-index:3;pointer-events:none}.phone-caption span{font-size:7px;letter-spacing:1.5px;color:#c4e5ed}.phone-caption strong{display:block;margin-top:7px;font-size:14px;color:white;line-height:1.4}
.phone-controls{position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;z-index:5;background:#14212cf2;border:1px solid #9edfeb30;border-radius:30px;padding:5px 10px;white-space:nowrap}.phone-controls button{width:34px;height:34px;border-radius:50%;background:transparent;color:var(--accent);font-size:18px}.phone-controls button:hover{background:#9edfeb20}.phone-controls span{font-size:10px;letter-spacing:1px;min-width:46px;text-align:center}
.phone-showreel .floating-label{bottom:60px;left:0;pointer-events:none}.phone-showreel .reel-format{display:none}.phone-showreel .reel-label{top:0}
@media(max-width:850px){.showreel.phone-showreel{height:475px}.phone-showreel .floating-label{bottom:60px;font-size:9px;padding:10px}.phone-showreel .floating-label small{font-size:7px}}
@media(max-width:640px){.showreel.phone-showreel{height:545px;margin-top:28px;margin-bottom:20px}.phone-stage{inset:25px 0 34px}.phone-showreel .floating-label{bottom:62px;left:0;font-size:10px}.phone-showreel .reel-label{font-size:7px}.phone-controls{bottom:-5px}}
@media(max-width:360px){.showreel.phone-showreel{height:500px}.phone-showreel .floating-label{font-size:9px;gap:8px;padding:9px}}
.phone-showreel .reel-label{top:-24px;font-size:10px;letter-spacing:1.8px;color:#c2cbd8;gap:18px;line-height:1.5}
.phone-showreel .reel-label>span{font-size:27px;color:#9edfeb}
.phone-showreel .floating-label{transform:none;background:#192735;border-color:#9edfeb55;color:#f4f8fb;font-size:14px;font-weight:700;line-height:1.5;padding:16px 18px;gap:13px;bottom:78px;box-shadow:0 12px 35px #0007}
.phone-showreel .floating-label small{font-size:12px;color:#d5e3ec;line-height:1.5;margin-top:4px;font-weight:500}
.phone-showreel .floating-label .label-star{font-size:24px;margin-left:3px}
@media(max-width:640px){.phone-showreel .reel-label{top:-14px;left:5px;font-size:9px;letter-spacing:1.3px}.phone-showreel .floating-label{font-size:13px;padding:13px 14px;gap:11px;bottom:80px}.phone-showreel .floating-label small{font-size:11px}.phone-showreel .floating-label .label-star{font-size:20px}}