.phone-frame{width:200px;background:#0f2044;border-radius:32px;padding:12px 8px;box-shadow:0 30px 60px rgba(15,32,68,.25)}.phone-frame:first-child{transform:rotate(-6deg) translateX(-20px);z-index:1}.phone-frame:last-child{transform:rotate(4deg) translateX(20px);z-index:2}.phone-screen{background:#fff;border-radius:24px;overflow:hidden;height:360px}.phone-header{background:#0f2044;color:white;padding:10px 12px;font-size:11px;font-weight:600}.map-area{background:#f1f5f9;height:160px;position:relative;overflow:hidden}.map-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(15,32,68,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(15,32,68,.05) 1px,transparent 1px);background-size:20px 20px}.map-route{position:absolute;width:70%;height:2px;background:#122568;top:50%;left:15%;border-radius:2px}.map-pin{position:absolute;width:10px;height:10px;border-radius:50%;border:2px solid white}.map-pin.start{background:#10b981;top:45%;left:14%}.map-pin.end{background:#122568;top:45%;right:14%}.car-dot{position:absolute;width:12px;height:12px;background:#0f2044;border-radius:50%;border:2px solid white;top:43%;left:50%;transform:translateX(-50%)}.ride-options{padding:8px}.ride-option{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:8px;margin-bottom:4px;border:1px solid #e2e8f0}.ride-option.active{background:#eef1fb;border-color:#122568}.ride-name{font-size:10px;font-weight:600;color:#0f2044}.ride-price{font-size:10px;font-weight:700;color:#122568}.ride-time{font-size:9px;color:#64748b}.screen-row{display:flex;align-items:center;gap:6px;padding:5px 8px;border-bottom:1px solid #e2e8f0;font-size:9px;color:#0f2044}.screen-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.screen-dot.green{background:#10b981}.screen-dot.orange{background:#122568}